From ab759db7f1e83a3d99ab99cde3688155ef77c4c8 Mon Sep 17 00:00:00 2001 From: Farhan Arshad Date: Thu, 2 Nov 2023 15:36:48 +0500 Subject: [PATCH] style: update color for the dates bullets and badges --- .../java/org/openedx/core/ui/theme/Color.kt | 12 +++--- .../java/org/openedx/core/ui/theme/Theme.kt | 22 ++++++---- .../presentation/dates/CourseDatesFragment.kt | 42 +++++++++---------- 3 files changed, 42 insertions(+), 34 deletions(-) diff --git a/core/src/main/java/org/openedx/core/ui/theme/Color.kt b/core/src/main/java/org/openedx/core/ui/theme/Color.kt index a0f3a28f4..07bbf9e68 100644 --- a/core/src/main/java/org/openedx/core/ui/theme/Color.kt +++ b/core/src/main/java/org/openedx/core/ui/theme/Color.kt @@ -31,11 +31,13 @@ data class AppColors( val warning: Color, val info: Color, - val datesBulletPastDue: Color, - val datesBulletToday: Color, - val datesBulletdefault: Color, - val datesBulletBorder: Color - + val datesBadgeDefault: Color, + val datesBadgeTextDefault: Color, + val datesBadgePastDue: Color, + val datesBadgeToday: Color, + val datesBadgeTextToday: Color, // also used for locked date block + val datesBadgeDue: Color, // Also used for not release date block text and stoke + val datesBadgeTextDue: Color // Also used for locked date block color ) { val primary: Color get() = material.primary val primaryVariant: Color get() = material.primaryVariant diff --git a/core/src/main/java/org/openedx/core/ui/theme/Theme.kt b/core/src/main/java/org/openedx/core/ui/theme/Theme.kt index 71b029233..ad8a89598 100644 --- a/core/src/main/java/org/openedx/core/ui/theme/Theme.kt +++ b/core/src/main/java/org/openedx/core/ui/theme/Theme.kt @@ -52,10 +52,13 @@ private val DarkColorPalette = AppColors( warning = Color(0xFFFFC248), info = Color(0xFF0095FF), - datesBulletPastDue = Color(0xFF6c6a69), - datesBulletToday = Color(0xFFFFC94D), - datesBulletdefault = Color(0xFF000000), - datesBulletBorder = Color(0xFFFFFFFF), + datesBadgeDefault = Color(0xFFF8F7F7), + datesBadgeTextDefault = Color(0xFFA2A2A2), + datesBadgePastDue = Color(0xFFEBE9E8), + datesBadgeToday = Color(0xFFFFE96B), + datesBadgeTextToday = Color(0xFFFFFFFF), + datesBadgeDue = Color(0xFFB7B7B7), + datesBadgeTextDue = Color(0xFF000000) ) private val LightColorPalette = AppColors( @@ -99,10 +102,13 @@ private val LightColorPalette = AppColors( warning = Color(0xFFFFC94D), info = Color(0xFF42AAFF), - datesBulletPastDue = Color(0xFFD7D3D1), - datesBulletToday = Color(0xFFFFC94D), - datesBulletdefault = Color(0xFF000000), - datesBulletBorder = Color(0xFF000000), + datesBadgeDefault = Color(0xFFF2F0EF), + datesBadgeTextDefault = Color(0xFF454545), + datesBadgePastDue = Color(0xFFD7D3D1), + datesBadgeToday = Color(0xFFD6B600), + datesBadgeTextToday = Color(0xFF000000), + datesBadgeDue = Color(0xFF707070), + datesBadgeTextDue = Color(0xFFFFFFFF) ) val MaterialTheme.appColors: AppColors diff --git a/course/src/main/java/org/openedx/course/presentation/dates/CourseDatesFragment.kt b/course/src/main/java/org/openedx/course/presentation/dates/CourseDatesFragment.kt index 1a842a33a..527cd7d84 100644 --- a/course/src/main/java/org/openedx/course/presentation/dates/CourseDatesFragment.kt +++ b/course/src/main/java/org/openedx/course/presentation/dates/CourseDatesFragment.kt @@ -349,23 +349,23 @@ private fun DateBullet( modifier = Modifier .width(1.dp) .height(6.dp) - .background(color = MaterialTheme.appColors.datesBulletBorder) + .background(color = MaterialTheme.appColors.datesBadgeTextToday) .align(Alignment.CenterHorizontally) ) } else { Spacer(modifier = Modifier.height(6.dp)) } - var circleColor: Color = MaterialTheme.appColors.datesBulletdefault + var circleColor: Color = MaterialTheme.appColors.datesBadgeDefault var circleSize: Dp = 10.dp when (dateBlock.dateBlockBadge) { CourseDatesBadge.TODAY -> { - circleColor = MaterialTheme.appColors.datesBulletToday + circleColor = MaterialTheme.appColors.datesBadgeToday circleSize = 14.dp } CourseDatesBadge.PAST_DUE -> { - circleColor = MaterialTheme.appColors.datesBulletPastDue + circleColor = MaterialTheme.appColors.datesBadgePastDue } CourseDatesBadge.BLANK, @@ -380,9 +380,9 @@ private fun DateBullet( } circleColor = if (isDatePassed && (dateBlock.dateBlockBadge == CourseDatesBadge.VERIFIED_ONLY).not()) { - MaterialTheme.appColors.datesBulletPastDue + MaterialTheme.appColors.datesBadgePastDue } else { - MaterialTheme.appColors.datesBulletdefault + MaterialTheme.appColors.datesBadgeTextToday } } @@ -391,7 +391,7 @@ private fun DateBullet( Box( modifier = Modifier .size(circleSize) - .border(1.dp, MaterialTheme.appColors.datesBulletBorder, CircleShape) + .border(1.dp, MaterialTheme.appColors.datesBadgeTextToday, CircleShape) .clip(CircleShape) .background(circleColor) .align(Alignment.CenterHorizontally) @@ -401,7 +401,7 @@ private fun DateBullet( modifier = Modifier .width(1.dp) .fillMaxHeight() - .background(color = MaterialTheme.appColors.datesBulletBorder) + .background(color = MaterialTheme.appColors.datesBadgeTextToday) .align(Alignment.CenterHorizontally) ) } @@ -447,35 +447,35 @@ private fun PlaceDateBadge(title: String, titleSize: TextUnit, blockBadge: Cours var badgeIcon: Painter? = null when (blockBadge) { CourseDatesBadge.TODAY -> { - badgeBackground = MaterialTheme.appColors.warning - textAppearance = MaterialTheme.appColors.textPrimary + badgeBackground = MaterialTheme.appColors.datesBadgeToday + textAppearance = MaterialTheme.appColors.datesBadgeTextToday } CourseDatesBadge.VERIFIED_ONLY -> { - badgeBackground = MaterialTheme.appColors.datesBulletdefault - textAppearance = MaterialTheme.appColors.textSecondary + badgeBackground = MaterialTheme.appColors.datesBadgeTextToday + textAppearance = MaterialTheme.appColors.datesBadgeTextDue badgeIcon = painterResource(R.drawable.ic_lock) } CourseDatesBadge.COMPLETED -> { - badgeBackground = MaterialTheme.appColors.textFieldBackground - textAppearance = MaterialTheme.appColors.textPrimaryVariant + badgeBackground = MaterialTheme.appColors.datesBadgeDefault + textAppearance = MaterialTheme.appColors.datesBadgeTextDefault } CourseDatesBadge.PAST_DUE -> { - badgeBackground = MaterialTheme.appColors.datesBulletPastDue - textAppearance = MaterialTheme.appColors.textPrimaryVariant + badgeBackground = MaterialTheme.appColors.datesBadgePastDue + textAppearance = MaterialTheme.appColors.datesBadgeTextDefault } CourseDatesBadge.DUE_NEXT -> { - badgeBackground = MaterialTheme.appColors.textPrimaryVariant - textAppearance = MaterialTheme.appColors.textFieldBackground + badgeBackground = MaterialTheme.appColors.datesBadgeDue + textAppearance = MaterialTheme.appColors.datesBadgeTextDue } CourseDatesBadge.NOT_YET_RELEASED -> { badgeBackground = Color.Transparent - textAppearance = MaterialTheme.appColors.textPrimaryVariant - badgeStrokeColor = MaterialTheme.appColors.textPrimaryVariant + textAppearance = MaterialTheme.appColors.datesBadgeDue + badgeStrokeColor = MaterialTheme.appColors.datesBadgeDue } else -> {} @@ -526,7 +526,7 @@ private fun PlaceDateBadge(title: String, titleSize: TextUnit, blockBadge: Cours placeholderVerticalAlign = PlaceholderVerticalAlign.TextCenter ) ) { - Icon(badgeIcon, "", tint = Color.White) + Icon(badgeIcon, "", tint = MaterialTheme.appColors.datesBadgeTextDue) } } Text(