Implementation
ThemeData highContrastDarkTheme() {
return ThemeData(
useMaterial3: true,
brightness: Brightness.dark,
scaffoldBackgroundColor: kBackgroundDarkHC,
fontFamily: GoogleFonts.notoSans().fontFamily,
primaryColor: kPrimaryHighContrast,
colorScheme: const ColorScheme.dark(
primary: kPrimaryHighContrast,
surface: kSurfaceDarkHC,
onPrimary: Colors.black,
onSurface: kTextPrimaryDarkHC,
surfaceContainerHighest: Color(0xFF303030),
onSurfaceVariant: Colors.white,
primaryContainer:
Color(0xFF82B1FF), // Light Blue for contrast against dark
onPrimaryContainer: Colors.black,
),
appBarTheme: AppBarTheme(
backgroundColor: kBackgroundDarkHC,
elevation: 0,
centerTitle: true,
iconTheme: const IconThemeData(color: kPrimaryHighContrast, size: 28),
titleTextStyle: GoogleFonts.spaceGrotesk(
color: kPrimaryHighContrast,
fontSize: 22,
fontWeight: FontWeight.bold,
),
toolbarHeight: 64,
),
switchTheme: SwitchThemeData(
thumbColor: WidgetStateProperty.all(kPrimaryHighContrast),
trackColor: WidgetStateProperty.all(Colors.grey),
materialTapTargetSize: MaterialTapTargetSize.padded,
),
inputDecorationTheme: const InputDecorationTheme(
filled: true,
fillColor: kBackgroundDarkHC,
contentPadding: EdgeInsets.symmetric(horizontal: 20, vertical: 20),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: kBorderDarkHC, width: 3),
borderRadius: BorderRadius.all(Radius.circular(12)),
),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: kPrimaryHighContrast, width: 4),
borderRadius: BorderRadius.all(Radius.circular(12)),
),
border: OutlineInputBorder(
borderSide: BorderSide(color: kBorderDarkHC, width: 3),
borderRadius: BorderRadius.all(Radius.circular(12)),
),
),
textTheme: textTheme().apply(
bodyColor: kTextPrimaryDarkHC,
displayColor: kTextPrimaryDarkHC,
),
elevatedButtonTheme: ElevatedButtonThemeData(
style: ElevatedButton.styleFrom(
backgroundColor: kPrimaryHighContrast,
foregroundColor: Colors.black,
padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 16),
minimumSize: const Size(88, 56),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12),
side: const BorderSide(color: kBorderDarkHC, width: 4),
),
),
),
textButtonTheme: TextButtonThemeData(
style: TextButton.styleFrom(
foregroundColor: kPrimaryHighContrast,
padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 14),
minimumSize: const Size(64, 52),
),
),
outlinedButtonTheme: OutlinedButtonThemeData(
style: OutlinedButton.styleFrom(
foregroundColor: kPrimaryHighContrast,
padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 16),
minimumSize: const Size(88, 56),
side: const BorderSide(color: kBorderDarkHC, width: 5),
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
),
),
floatingActionButtonTheme: const FloatingActionButtonThemeData(
backgroundColor: kPrimaryHighContrast,
foregroundColor: Colors.black,
iconSize: 32,
sizeConstraints: BoxConstraints.tightFor(width: 68, height: 68),
),
iconTheme: const IconThemeData(
color: kTextPrimaryDarkHC,
size: 28,
),
dividerColor: kBorderDarkHC,
dividerTheme: const DividerThemeData(
color: kBorderDarkHC,
thickness: 2,
space: 32,
),
cardTheme: CardThemeData(
color: kSurfaceDarkHC,
elevation: 0,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(16),
side: const BorderSide(color: kBorderDarkHC, width: 5),
),
margin: const EdgeInsets.all(12),
),
listTileTheme: const ListTileThemeData(
contentPadding: EdgeInsets.symmetric(horizontal: 20, vertical: 16),
minLeadingWidth: 64,
minVerticalPadding: 16,
iconColor: kPrimaryHighContrast,
textColor: kTextPrimaryDarkHC,
),
extensions: <ThemeExtension<dynamic>>[
DiagramTheme(
canvasBg: kBackgroundDarkHC,
panelBg: kSurfaceDarkHC,
gridLine: Colors.white.withValues(alpha: 0.25),
nodeBg: kSurfaceDarkHC,
nodeBorder: kBorderDarkHC,
textColor: kTextPrimaryDarkHC,
accentColor: kPrimaryHighContrast,
isDark: true,
),
],
);
}