style: App-UI an Admin-Bereich angleichen (#92)
- Color.kt: Farbpalette von Olivgrün auf Admin-Palette umgestellt
(burnt orange #C1440E primary, warm beige #E8D5B0 text,
dark brown #16140F background, tan #A89070 labels)
- Type.kt: Neue Typography mit Monospace für Headings/Titles/Labels
(analog Admin Share Tech Mono), system-ui für Body
- Theme.kt: KrisenvorratTypography eingebunden
- Dark Mode vollständig spezifiziert, Admin-konsistent
- Alle bestehenden Screens profitieren automatisch via MaterialTheme
- Build ✅, alle Tests grün (70 tasks)
This commit is contained in:
parent
077d16f056
commit
0fb1ebbdca
3 changed files with 91 additions and 41 deletions
|
|
@ -3,61 +3,65 @@ package de.krisenvorrat.app.ui.theme
|
|||
import androidx.compose.ui.graphics.Color
|
||||
|
||||
/**
|
||||
* Material 3 color tokens generated from seed color #4A6741 (Olivgrün/Militärgrün).
|
||||
* Material 3 color tokens aligned with Admin-UI palette.
|
||||
*
|
||||
* Generated using Material Theme Builder tonal palette algorithm.
|
||||
* Dark theme is the primary usage.
|
||||
* Admin design reference colors:
|
||||
* - Primary accent: #C1440E (burnt orange)
|
||||
* - Text: #E8D5B0 (warm beige)
|
||||
* - Background: #16140F (dark chocolate brown)
|
||||
* - Borders: #4A3F2F (dark olive-brown)
|
||||
* - Labels: #A89070 (muted tan)
|
||||
*/
|
||||
|
||||
// Primary
|
||||
val md_theme_dark_primary = Color(0xFFA1D395)
|
||||
val md_theme_dark_onPrimary = Color(0xFF0B3900)
|
||||
val md_theme_dark_primaryContainer = Color(0xFF1E5110)
|
||||
val md_theme_dark_onPrimaryContainer = Color(0xFFBCEFAF)
|
||||
// Primary – burnt orange accent (Admin: button.primary, border-bottom, h2::before)
|
||||
val md_theme_dark_primary = Color(0xFFE8875A)
|
||||
val md_theme_dark_onPrimary = Color(0xFF3A1100)
|
||||
val md_theme_dark_primaryContainer = Color(0xFF5C2000)
|
||||
val md_theme_dark_onPrimaryContainer = Color(0xFFFFBB9A)
|
||||
|
||||
// Secondary
|
||||
val md_theme_dark_secondary = Color(0xFFBBCBB2)
|
||||
val md_theme_dark_onSecondary = Color(0xFF273422)
|
||||
val md_theme_dark_secondaryContainer = Color(0xFF3D4B37)
|
||||
val md_theme_dark_onSecondaryContainer = Color(0xFFD7E8CD)
|
||||
// Secondary – warm tan (Admin: labels, secondary text)
|
||||
val md_theme_dark_secondary = Color(0xFFD4BFA8)
|
||||
val md_theme_dark_onSecondary = Color(0xFF382C1E)
|
||||
val md_theme_dark_secondaryContainer = Color(0xFF4A3F2F)
|
||||
val md_theme_dark_onSecondaryContainer = Color(0xFFE8D5B0)
|
||||
|
||||
// Tertiary
|
||||
val md_theme_dark_tertiary = Color(0xFFA0D0CB)
|
||||
val md_theme_dark_onTertiary = Color(0xFF003735)
|
||||
val md_theme_dark_tertiaryContainer = Color(0xFF1E4E4C)
|
||||
val md_theme_dark_onTertiaryContainer = Color(0xFFBBECE7)
|
||||
// Tertiary – gold/amber (Admin: inv-badge color)
|
||||
val md_theme_dark_tertiary = Color(0xFFD4B060)
|
||||
val md_theme_dark_onTertiary = Color(0xFF3A2E10)
|
||||
val md_theme_dark_tertiaryContainer = Color(0xFF4A3A14)
|
||||
val md_theme_dark_onTertiaryContainer = Color(0xFFF0D888)
|
||||
|
||||
// Error
|
||||
// Error – kept slightly warm for readability
|
||||
val md_theme_dark_error = Color(0xFFFFB4AB)
|
||||
val md_theme_dark_onError = Color(0xFF690005)
|
||||
val md_theme_dark_errorContainer = Color(0xFF93000A)
|
||||
val md_theme_dark_errorContainer = Color(0xFF8B1A1A)
|
||||
val md_theme_dark_onErrorContainer = Color(0xFFFFDAD6)
|
||||
|
||||
// Background & Surface
|
||||
val md_theme_dark_background = Color(0xFF1A1C18)
|
||||
val md_theme_dark_onBackground = Color(0xFFE2E3DC)
|
||||
val md_theme_dark_surface = Color(0xFF1A1C18)
|
||||
val md_theme_dark_onSurface = Color(0xFFE2E3DC)
|
||||
// Background & Surface (Admin: body #16140F, header #1A1815)
|
||||
val md_theme_dark_background = Color(0xFF16140F)
|
||||
val md_theme_dark_onBackground = Color(0xFFE8D5B0)
|
||||
val md_theme_dark_surface = Color(0xFF1A1815)
|
||||
val md_theme_dark_onSurface = Color(0xFFE8D5B0)
|
||||
|
||||
// Surface Variant & Outline
|
||||
val md_theme_dark_surfaceVariant = Color(0xFF424940)
|
||||
val md_theme_dark_onSurfaceVariant = Color(0xFFC2C9BD)
|
||||
val md_theme_dark_outline = Color(0xFF8C9388)
|
||||
val md_theme_dark_outlineVariant = Color(0xFF424940)
|
||||
// Surface Variant & Outline (Admin: borders #4A3F2F, footer #6B5B3E)
|
||||
val md_theme_dark_surfaceVariant = Color(0xFF3A3428)
|
||||
val md_theme_dark_onSurfaceVariant = Color(0xFFA89070)
|
||||
val md_theme_dark_outline = Color(0xFF6B5B3E)
|
||||
val md_theme_dark_outlineVariant = Color(0xFF4A3F2F)
|
||||
|
||||
// Inverse
|
||||
val md_theme_dark_inverseSurface = Color(0xFFE2E3DC)
|
||||
val md_theme_dark_inverseOnSurface = Color(0xFF2F312C)
|
||||
val md_theme_dark_inversePrimary = Color(0xFF336B25)
|
||||
val md_theme_dark_inverseSurface = Color(0xFFE8D5B0)
|
||||
val md_theme_dark_inverseOnSurface = Color(0xFF2E2B22)
|
||||
val md_theme_dark_inversePrimary = Color(0xFFC1440E)
|
||||
|
||||
// Scrim
|
||||
val md_theme_dark_scrim = Color(0xFF000000)
|
||||
|
||||
// Surface containers
|
||||
val md_theme_dark_surfaceDim = Color(0xFF1A1C18)
|
||||
val md_theme_dark_surfaceBright = Color(0xFF404F3D)
|
||||
val md_theme_dark_surfaceContainerLowest = Color(0xFF0F120D)
|
||||
val md_theme_dark_surfaceContainerLow = Color(0xFF222520)
|
||||
val md_theme_dark_surfaceContainer = Color(0xFF262924)
|
||||
val md_theme_dark_surfaceContainerHigh = Color(0xFF31342E)
|
||||
val md_theme_dark_surfaceContainerHighest = Color(0xFF3C3F39)
|
||||
// Surface containers (Admin tonal progression: #16140F → #1A1815 → #1E1C17 → #242119 → #2E2B22 → #3A3428)
|
||||
val md_theme_dark_surfaceDim = Color(0xFF14120D)
|
||||
val md_theme_dark_surfaceBright = Color(0xFF3A3428)
|
||||
val md_theme_dark_surfaceContainerLowest = Color(0xFF110F0A)
|
||||
val md_theme_dark_surfaceContainerLow = Color(0xFF1E1C17)
|
||||
val md_theme_dark_surfaceContainer = Color(0xFF242119)
|
||||
val md_theme_dark_surfaceContainerHigh = Color(0xFF2E2B22)
|
||||
val md_theme_dark_surfaceContainerHighest = Color(0xFF3A3428)
|
||||
|
|
|
|||
|
|
@ -67,6 +67,7 @@ fun KrisenvorratTheme(
|
|||
|
||||
MaterialTheme(
|
||||
colorScheme = colorScheme,
|
||||
typography = KrisenvorratTypography,
|
||||
content = content
|
||||
)
|
||||
}
|
||||
|
|
|
|||
45
app/src/main/java/de/krisenvorrat/app/ui/theme/Type.kt
Normal file
45
app/src/main/java/de/krisenvorrat/app/ui/theme/Type.kt
Normal file
|
|
@ -0,0 +1,45 @@
|
|||
package de.krisenvorrat.app.ui.theme
|
||||
|
||||
import androidx.compose.material3.Typography
|
||||
import androidx.compose.ui.text.font.FontFamily
|
||||
import androidx.compose.ui.unit.sp
|
||||
|
||||
/**
|
||||
* Typography aligned with Admin-UI: monospace headings (Share Tech Mono style),
|
||||
* system sans-serif for body text.
|
||||
*/
|
||||
val KrisenvorratTypography = Typography(
|
||||
displayLarge = Typography().displayLarge.copy(fontFamily = FontFamily.Monospace),
|
||||
displayMedium = Typography().displayMedium.copy(fontFamily = FontFamily.Monospace),
|
||||
displaySmall = Typography().displaySmall.copy(fontFamily = FontFamily.Monospace),
|
||||
headlineLarge = Typography().headlineLarge.copy(
|
||||
fontFamily = FontFamily.Monospace,
|
||||
letterSpacing = 0.5.sp
|
||||
),
|
||||
headlineMedium = Typography().headlineMedium.copy(
|
||||
fontFamily = FontFamily.Monospace,
|
||||
letterSpacing = 0.5.sp
|
||||
),
|
||||
headlineSmall = Typography().headlineSmall.copy(
|
||||
fontFamily = FontFamily.Monospace,
|
||||
letterSpacing = 0.5.sp
|
||||
),
|
||||
titleLarge = Typography().titleLarge.copy(
|
||||
fontFamily = FontFamily.Monospace,
|
||||
letterSpacing = 0.5.sp
|
||||
),
|
||||
titleMedium = Typography().titleMedium.copy(
|
||||
fontFamily = FontFamily.Monospace,
|
||||
letterSpacing = 0.5.sp
|
||||
),
|
||||
titleSmall = Typography().titleSmall.copy(
|
||||
fontFamily = FontFamily.Monospace,
|
||||
letterSpacing = 0.5.sp
|
||||
),
|
||||
labelLarge = Typography().labelLarge.copy(fontFamily = FontFamily.Monospace),
|
||||
labelMedium = Typography().labelMedium.copy(fontFamily = FontFamily.Monospace),
|
||||
labelSmall = Typography().labelSmall.copy(fontFamily = FontFamily.Monospace),
|
||||
bodyLarge = Typography().bodyLarge,
|
||||
bodyMedium = Typography().bodyMedium,
|
||||
bodySmall = Typography().bodySmall,
|
||||
)
|
||||
Loading…
Reference in a new issue