Compose: match theme colors with XML theme.

UweTrottmann · Jan 31, 2024 · a45c697 · a45c697
1 parent 0100736
commit a45c697
Show file tree

Hide file tree

Showing 2 changed files with 44 additions and 42 deletions.
diff --git a/app/src/main/java/com/battlelancer/seriesguide/ui/theme/Color.kt b/app/src/main/java/com/battlelancer/seriesguide/ui/theme/Color.kt
@@ -3,68 +3,70 @@ package com.battlelancer.seriesguide.ui.theme
 import androidx.compose.ui.graphics.Color
 
 // Compose Material 3 colors, should match the XML colors in colors_md.xml
-// TODO Match colors with XML
 
 val seed = Color(0xFF6545A0)
+val white = Color(0xFFFFFFFF)
+val sg_color_background_light = Color(0xFFEBEBEB)
+val sg_color_background_dark = Color(0xFF19161E)
 
 val md_theme_light_primary = seed
-val md_theme_light_onPrimary = Color(0xFFFFFFFF)
-val md_theme_light_primaryContainer = Color(0xFFEBDCFF)
-val md_theme_light_onPrimaryContainer = Color(0xFF260059)
-val md_theme_light_secondary = Color(0xFF006B5D)
-val md_theme_light_onSecondary = Color(0xFFFFFFFF)
-val md_theme_light_secondaryContainer = Color(0xFF76F8E0)
-val md_theme_light_onSecondaryContainer = Color(0xFF00201B)
-val md_theme_light_tertiary = Color(0xFF99405C)
-val md_theme_light_onTertiary = Color(0xFFFFFFFF)
-val md_theme_light_tertiaryContainer = Color(0xFFFFD9E0)
-val md_theme_light_onTertiaryContainer = Color(0xFF3F001A)
+val md_theme_light_onPrimary = white
+val md_theme_light_primaryContainer = Color(0xFFB69DF8)
+val md_theme_light_onPrimaryContainer = Color(0xFF381E72)
+val md_theme_light_secondary = Color(0xFF00796a)
+val md_theme_light_onSecondary = white
+val md_theme_light_secondaryContainer = Color(0xFFB3E6DE)
+val md_theme_light_onSecondaryContainer = Color(0xFF092A26)
+val md_theme_light_tertiary = Color(0xFF7E525D)
+val md_theme_light_onTertiary = white
+val md_theme_light_tertiaryContainer = Color(0xFFFFD9E2)
+val md_theme_light_onTertiaryContainer = Color(0xFF32101B)
 val md_theme_light_error = Color(0xFFBA1B1B)
-val md_theme_light_errorContainer = Color(0xFFFFDAD6)
-val md_theme_light_onError = Color(0xFFFFFFFF)
-val md_theme_light_onErrorContainer = Color(0xFF410002)
-val md_theme_light_background = Color(0xFFFFFBFF)
-val md_theme_light_onBackground = Color(0xFF1D1B1E)
-val md_theme_light_surface = Color(0xFFFFFBFF)
-val md_theme_light_onSurface = Color(0xFF1D1B1E)
+val md_theme_light_errorContainer = Color(0xFFFFDAD4)
+val md_theme_light_onError = white
+val md_theme_light_onErrorContainer = Color(0xFF410001)
+val md_theme_light_background = sg_color_background_light
+val md_theme_light_onBackground = sg_color_background_dark
+val md_theme_light_surface = md_theme_light_background // Should match background
+val md_theme_light_onSurface = md_theme_light_onBackground
 val md_theme_light_surfaceVariant = Color(0xFFE7E0EB)
 val md_theme_light_onSurfaceVariant = Color(0xFF49454E)
 val md_theme_light_outline = Color(0xFF7A757F)
 val md_theme_light_inverseOnSurface = Color(0xFFF5EFF4)
 val md_theme_light_inverseSurface = Color(0xFF323033)
-val md_theme_light_inversePrimary = Color(0xFFD3BBFF)
-val md_theme_light_shadow = Color(0xFF000000)
+val md_theme_light_inversePrimary = Color(0xFFD5BBFF)
+//val md_theme_light_shadow = Color(0xFF000000)
 val md_theme_light_surfaceTint = Color(0xFF6C4CA8)
 val md_theme_light_outlineVariant = Color(0xFFCBC4CF)
 val md_theme_light_scrim = Color(0xFF000000)
 
 val md_theme_dark_primary = Color(0xFF927bbc)
 val md_theme_dark_onPrimary = Color(0xFF3D1976)
 val md_theme_dark_primaryContainer = Color(0xFF54338E)
-val md_theme_dark_onPrimaryContainer = Color(0xFFEBDCFF)
-val md_theme_dark_secondary = Color(0xFF56DBC5)
+val md_theme_dark_onPrimaryContainer = Color(0xFFECDCFF)
+val md_theme_dark_secondary = Color(0xFF009688)
 val md_theme_dark_onSecondary = Color(0xFF003730)
-val md_theme_dark_secondaryContainer = Color(0xFF009688)
-val md_theme_dark_onSecondaryContainer = Color(0xFF76F8E0)
-val md_theme_dark_tertiary = Color(0xFFFFB1C4)
-val md_theme_dark_onTertiary = Color(0xFF5E112E)
-val md_theme_dark_tertiaryContainer = Color(0xFF7C2945)
-val md_theme_dark_onTertiaryContainer = Color(0xFFFFD9E0)
+val md_theme_dark_secondaryContainer = Color(0xFF005047)
+val md_theme_dark_onSecondaryContainer = Color(0xFF7BEFE0)
+val md_theme_dark_tertiary = Color(0xFFF1B8C5)
+val md_theme_dark_onTertiary = Color(0xFF4B2530)
+val md_theme_dark_tertiaryContainer = Color(0xFF643B46)
+val md_theme_dark_onTertiaryContainer = Color(0xFFFFD9E2)
 val md_theme_dark_error = Color(0xFFFFB4A9)
-val md_theme_dark_errorContainer = Color(0xFF93000A)
-val md_theme_dark_onError = Color(0xFF690005)
-val md_theme_dark_onErrorContainer = Color(0xFFFFDAD6)
-val md_theme_dark_background = Color(0xFF1D1B1E)
-val md_theme_dark_onBackground = Color(0xFFE6E1E6)
-val md_theme_dark_surface = Color(0xFF1D1B1E)
-val md_theme_dark_onSurface = Color(0xFFE6E1E6)
+val md_theme_dark_errorContainer = Color(0xFF930006)
+val md_theme_dark_onError = Color(0xFF680003)
+val md_theme_dark_onErrorContainer = Color(0xFFFFDAD4)
+val md_theme_dark_background = sg_color_background_dark
+val md_theme_dark_onBackground = Color(0xFFE6E1E5)
+val md_theme_dark_surface = md_theme_dark_background // Should match background
+val md_theme_dark_onSurface = md_theme_dark_onBackground
 val md_theme_dark_surfaceVariant = Color(0xFF49454E)
 val md_theme_dark_onSurfaceVariant = Color(0xFFCBC4CF)
-val md_theme_dark_outline = Color(0xFF948F99)
-val md_theme_dark_inverseOnSurface = Color(0xFF1D1B1E)
-val md_theme_dark_inverseSurface = Color(0xFFE6E1E6)
-val md_theme_dark_inversePrimary = Color(0xFF6C4CA8)
-val md_theme_dark_shadow = Color(0xFF000000)
+val md_theme_dark_outline = Color(0xFF948E99)
+val md_theme_dark_inverseOnSurface = sg_color_background_dark
+val md_theme_dark_inverseSurface = Color(0xFFE6E1E5)
+val md_theme_dark_inversePrimary = Color(0xFF6C4CA7)
+//val md_theme_dark_shadow = Color(0xFF000000)
 val md_theme_dark_surfaceTint = Color(0xFFD3BBFF)
 val md_theme_dark_outlineVariant = Color(0xFF49454E)
 val md_theme_dark_scrim = Color(0xFF000000)
diff --git a/app/src/main/res/values/themes.xml b/app/src/main/res/values/themes.xml
@@ -107,7 +107,7 @@
         <item name="colorOnTertiaryContainer">@color/md_theme_light_onTertiaryContainer</item>
         <item name="colorError">@color/md_theme_light_error</item>
         <item name="colorErrorContainer">@color/md_theme_light_errorContainer</item>
-        <item name="colorOnError">@color/md_theme_light_onError</item>
+        <item name="colorOnError">@color/sg_white</item>
         <item name="colorOnErrorContainer">@color/md_theme_light_onErrorContainer</item>
         <item name="android:colorBackground">@color/sg_color_background_light</item>
         <item name="colorOnBackground">@color/sg_color_background_dark</item>