fix(ui): WCAG light-theme accent, overflow-safe audit page, formal address
Some checks are pending
Security / Security check (push) Waiting to run
Some checks are pending
Security / Security check (push) Waiting to run
Accessibility/responsive audit pass with two new permanent test gates (test/a11y_test.dart: WCAG text contrast + labeled tap targets on every page in both themes; test/responsive_test.dart: no layout overflow at 800/960/1280/1920 px). Findings fixed: - Light theme primary/tertiary sky-500 → sky-700: white text on the lighter accent only reached 2.8:1 (welcome CTA, active sidebar label); sky-700 clears WCAG AA at ~5.9:1. Dark theme unchanged (already compliant). FABs now follow the same accent instead of Material 3's washed-out tonal default. - Audit page: filter chips collapse into a checkmark popup menu below 900 px window width (app bar overflowed); the live-status bar's left text is now Expanded with ellipsis so the row can shrink, and the disconnected state's copyable error gets the full remaining width. - German strings now use formal address consistently (~20 strings still used du-forms next to Sie-forms on welcome/setup), the audit event-type chip "Step" is "Schritt", and the doctor page's event count pluralises correctly in both languages. flutter analyze clean, 64 tests green. Screenshot pass light+dark via the guide-shots harness (verified parity, no overflows). Signed-off-by: flemming-it <stefan.a.flemming@googlemail.com>
This commit is contained in:
parent
efaa089454
commit
da58125f20
9 changed files with 339 additions and 95 deletions
|
|
@ -197,7 +197,11 @@ class ChainTheme {
|
|||
static ThemeData light() {
|
||||
final scheme = ColorScheme(
|
||||
brightness: Brightness.light,
|
||||
primary: ChainColors.accentDeep,
|
||||
// Sky-700, not sky-500: white button/label text on the lighter
|
||||
// accent only reaches 2.8:1 — WCAG AA needs 4.5:1 (a11y_test.dart
|
||||
// pins this). The dark theme keeps the lighter accent because it
|
||||
// pairs it with near-black text.
|
||||
primary: ChainColors.accentMuted,
|
||||
onPrimary: ChainColors.lightSurface,
|
||||
primaryContainer: const Color(0xFFE0F2FE),
|
||||
onPrimaryContainer: ChainColors.accentMuted,
|
||||
|
|
@ -205,7 +209,7 @@ class ChainTheme {
|
|||
onSecondary: ChainColors.lightSurface,
|
||||
secondaryContainer: ChainColors.lightSurfaceHigh,
|
||||
onSecondaryContainer: ChainColors.lightText,
|
||||
tertiary: ChainColors.accentDeep,
|
||||
tertiary: ChainColors.accentMuted,
|
||||
onTertiary: ChainColors.lightSurface,
|
||||
tertiaryContainer: const Color(0xFFE0F2FE),
|
||||
onTertiaryContainer: ChainColors.accentMuted,
|
||||
|
|
@ -261,6 +265,13 @@ class ChainTheme {
|
|||
),
|
||||
margin: EdgeInsets.zero,
|
||||
),
|
||||
// Match FABs to the filled-button accent: Material 3 defaults
|
||||
// them to primaryContainer, which reads as a washed-out tonal
|
||||
// surface next to the sky-700 CTAs in the light theme.
|
||||
floatingActionButtonTheme: FloatingActionButtonThemeData(
|
||||
backgroundColor: scheme.primary,
|
||||
foregroundColor: scheme.onPrimary,
|
||||
),
|
||||
filledButtonTheme: FilledButtonThemeData(
|
||||
style: FilledButton.styleFrom(
|
||||
backgroundColor: scheme.primary,
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue