didvan-app/lib/config/theme_data.dart

import 'package:didvan/config/design_config.dart';
import 'package:flutter/material.dart';

class LightThemeConfig {
  static const Color _primary = Color(0xFF007EA7);
  static const Color _white = Color(0xFFFFFFFF);
  static const Color _black = Color(0xFF292929);
  static const Color _background = Color(0xFFF8F8FA);

  static ThemeData get themeData => ThemeData(
        scaffoldBackgroundColor: _background,
        textTheme: _TextThemeData.data,
        cardColor: _colorScheme.surface,
        checkboxTheme: CheckboxThemeData(
          fillColor: MaterialStateProperty.resolveWith((states) {
            if (!states.contains(MaterialState.selected)) {
              return Colors.transparent;
            }
            return _colorScheme.secondary;
          }),
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(4),
          ),
        ),
        iconTheme: IconThemeData(
          color: _colorScheme.text,
        ),
        colorScheme: _colorScheme.copyWith(background: _background),
      );

  static const ColorScheme _colorScheme = ColorScheme(
    primary: _primary,
    primaryContainer: _white,
    secondary: Color(0xFFB20436),
    secondaryContainer: _white,
    surface: _white,
    background: _background,
    error: Color(0xFFF00505),
    onPrimary: _white,
    onSecondary: _white,
    onSurface: _black,
    onBackground: _white,
    onError: _white,
    brightness: Brightness.light,
  );
}

class DarkThemeConfig {
  static const Color _primary = Color(0xFF007EA7);
  static const Color _white = Color(0xFFFFFFFF);
  static const Color _background = Color(0xFF202224);

  static ThemeData get themeData => ThemeData(
        scaffoldBackgroundColor: _background,
        textTheme: _TextThemeData.data,
        iconTheme: IconThemeData(
          color: _colorScheme.text,
        ),
        checkboxTheme: CheckboxThemeData(
          materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
          fillColor: MaterialStateProperty.resolveWith((states) {
            if (!states.contains(MaterialState.selected)) {
              return Colors.transparent;
            }
            return _colorScheme.secondary;
          }),
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(4),
          ),
        ),
        cardColor: _colorScheme.surface,
        colorScheme: _colorScheme.copyWith(background: _background),
      );

  static const ColorScheme _colorScheme = ColorScheme(
    primary: _primary,
    primaryContainer: _white,
    secondary: Color(0xFFB21542),
    secondaryContainer: _white,
    surface: Color(0xFF181B1F),
    background: _background,
    error: Color(0xFFF53B3B),
    onPrimary: _white,
    onSecondary: _white,
    onSurface: text,
    onBackground: text,
    onError: _white,
    brightness: Brightness.dark,
  );

  // Grey colors
  static const Color white = Color(0xFFFFFFFF);
  static const Color title = Color(0xFFF5F5F5);
  static const Color text = Color(0xFFD6D6D6);
  static const Color hint = Color(0xFFBBBBBB);
  static const Color border = Color(0xFF666666);

  // Error and success
  static const Color errorLight = Color(0xFFF0C9CD);
  static const Color error = Color(0xFFF53B3B);
  static const Color successLight = Color(0xFFBBD6B4);
  static const Color success = Color(0xFF32A64C);
}

class _TextThemeData {
  static TextTheme get data => DesignConfig.context == null
      ? const TextTheme()
      : TextTheme(
          bodyLarge: _body1Text,
          bodyMedium: _body2Text,
          bodySmall: _captionText,
          titleSmall: _subtitle2Text,
          titleMedium: _subtitle1Text,
          displaySmall: _headline3Text,
          labelSmall: _overlineText,
        );

  static TextStyle get _headline3Text => TextStyle(
        fontSize: 20 * DesignConfig.fontScale,
        fontWeight: FontWeight.w600,
      );
  static TextStyle get _subtitle1Text => TextStyle(
        fontSize: 17 * DesignConfig.fontScale,
        fontWeight: FontWeight.w700,
      );
  static TextStyle get _subtitle2Text => TextStyle(
        fontSize: 15 * DesignConfig.fontScale,
        fontWeight: FontWeight.w700,
      );
  static TextStyle get _body1Text => TextStyle(
        fontSize: 15 * DesignConfig.fontScale,
        fontWeight: FontWeight.w700,
      );
  static TextStyle get _body2Text => TextStyle(
        fontSize: 15 * DesignConfig.fontScale,
        fontWeight: FontWeight.w400,
      );
  static TextStyle get _captionText => TextStyle(
        fontSize: 13 * DesignConfig.fontScale,
        fontWeight: FontWeight.w400,
      );
  static TextStyle get _overlineText => TextStyle(
        fontSize: 12 * DesignConfig.fontScale,
        fontWeight: FontWeight.w300,
      );
}

extension DidvanColorScheme on ColorScheme {
  // Secondary colors
  Color get secondaryDisabled => brightness == Brightness.dark
      ? const Color(0xFF703848)
      : const Color(0xFFFFC8D7);

  Color get white => const Color(0xFFFFFFFF);
  Color get focused => brightness == Brightness.dark
      ? const Color(0xFF20272E)
      : const Color(0xFFE6F3FA);
  Color get navigation => brightness == Brightness.dark
      ? const Color(0xFF181B1F)
      : const Color(0xFF012348);
  Color get focusedBorder => brightness == Brightness.dark
      ? const Color(0xFF9FB2C2)
      : const Color(0xFF195D80);
  Color get title => brightness == Brightness.dark
      ? const Color(0xFFD6D6D6)
      : const Color(0xFF1B3C59);
  Color get text => brightness == Brightness.dark
      ? const Color(0xFFD6D6D6)
      : const Color(0xFF292929);
  Color get inputText => brightness == Brightness.dark
      ? const Color(0xFFA3A3A3)
      : const Color(0xFF3D3D3D);
  Color get caption => brightness == Brightness.dark
      ? const Color(0xFFBBBBBB)
      : const Color(0xFF666666);
  Color get hint => brightness == Brightness.dark
      ? const Color(0xFF7A7A7A)
      : const Color(0xFFBBBBBB);
  Color get disabledText => brightness == Brightness.dark
      ? const Color(0xFF5C5C5C)
      : const Color(0xFFBBBBBB);
  Color get border => brightness == Brightness.dark
      ? const Color(0xFF5C5C5C)
      : const Color(0xFFE0E0E0);
  Color get cardBorder => brightness == Brightness.dark
      ? const Color(0xFF5C5C5C)
      : const Color(0xFFEBEBEB);
  Color get disabledBackground => brightness == Brightness.dark
      ? const Color(0xFF333333)
      : const Color(0xFFE0E0E0);
  Color get secondCTA => brightness == Brightness.dark
      ? const Color(0xFF474747)
      : const Color(0xFFF5F5F5);
  Color get splash => brightness == Brightness.dark
      ? const Color(0xFF333333)
      : const Color(0xFFC8E0F4);
  Color get black => brightness == Brightness.dark
      ? const Color(0xFF1F1F1F)
      : const Color(0xFF292929);
  Color get overlay => brightness == Brightness.dark
      ? const Color(0xFF0F1011)
      : const Color(0xFF292929);
  Color get yellow => const Color(0XFFEAA92A);

  // Error and success colors
  Color get errorBack => brightness == Brightness.dark
      ? const Color(0xFF2B2325)
      : const Color(0xFFFFF8F8);
  Color get successBack => brightness == Brightness.dark
      ? const Color(0xFF2C332B)
      : const Color(0xFFF5FFFC);
  Color get success => brightness == Brightness.dark
      ? const Color(0xFF2FC250)
      : const Color(0xFF2BB24A);
}