133 lines
4.6 KiB
Dart
133 lines
4.6 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:google_fonts/google_fonts.dart';
|
|
|
|
class AppTheme {
|
|
// Editorial Organicism Tokens
|
|
static const Color primary = Color(0xFFFFEF00);
|
|
static const Color primaryContainer = Color(0xFFFFEF00);
|
|
static const Color secondary = Color(0xFF705900);
|
|
static const Color secondaryContainer = Color(0xFFFACD34);
|
|
static const Color onPrimaryContainer = Color(0xFF5F5800);
|
|
static const Color onSecondaryContainer = Color(0xFF584500);
|
|
|
|
// Surface Hierarchy
|
|
static const Color surface = Color(0xFFF7F7F4);
|
|
static const Color surfaceContainer = Color(0xFFE8E8E5);
|
|
static const Color surfaceContainerLow = Color(0xFFF0F1EE);
|
|
static const Color surfaceContainerLowest = Colors.white;
|
|
static const Color surfaceContainerHighest = Color(0xFFDCDDDA);
|
|
|
|
// Text & On-Colors
|
|
static const Color onSurface = Color(0xFF2D2F2D);
|
|
static const Color onSurfaceVariant = Color(0xFF5A5C5A);
|
|
static const Color onPrimary = Color(0xFFFFF59B);
|
|
static const Color outlineVariant = Color(0xFFACADAB);
|
|
|
|
static ThemeData get lightTheme {
|
|
final baseTheme = ThemeData.light();
|
|
|
|
return ThemeData(
|
|
useMaterial3: true,
|
|
scaffoldBackgroundColor: surface,
|
|
colorScheme: const ColorScheme.light(
|
|
primary: primary,
|
|
primaryContainer: primaryContainer,
|
|
secondary: secondary,
|
|
secondaryContainer: secondaryContainer,
|
|
onSecondaryContainer: onSecondaryContainer,
|
|
surface: surface,
|
|
onSurface: onSurface,
|
|
onSurfaceVariant: onSurfaceVariant,
|
|
onPrimary: onPrimary,
|
|
error: Color(0xFFB02500),
|
|
),
|
|
textTheme: baseTheme.textTheme.copyWith(
|
|
displayLarge: GoogleFonts.epilogue(
|
|
color: onSurface,
|
|
fontWeight: FontWeight.bold,
|
|
letterSpacing: -0.02,
|
|
),
|
|
displayMedium: GoogleFonts.epilogue(
|
|
color: onSurface,
|
|
fontWeight: FontWeight.bold,
|
|
letterSpacing: -0.02,
|
|
),
|
|
displaySmall: GoogleFonts.epilogue(
|
|
color: onSurface,
|
|
fontWeight: FontWeight.bold,
|
|
letterSpacing: -0.02,
|
|
),
|
|
headlineMedium: GoogleFonts.epilogue(
|
|
color: onSurface,
|
|
fontWeight: FontWeight.bold,
|
|
letterSpacing: -0.02,
|
|
),
|
|
titleLarge: GoogleFonts.epilogue(
|
|
color: onSurface,
|
|
fontWeight: FontWeight.bold,
|
|
),
|
|
titleMedium: GoogleFonts.epilogue(
|
|
color: onSurface,
|
|
fontWeight: FontWeight.bold,
|
|
),
|
|
titleSmall: GoogleFonts.epilogue(
|
|
color: onSurface,
|
|
fontWeight: FontWeight.w600,
|
|
),
|
|
bodyLarge: GoogleFonts.manrope(color: onSurface),
|
|
bodyMedium: GoogleFonts.manrope(color: onSurfaceVariant),
|
|
bodySmall: GoogleFonts.manrope(color: onSurfaceVariant),
|
|
labelLarge: GoogleFonts.manrope(color: onSurfaceVariant),
|
|
),
|
|
elevatedButtonTheme: ElevatedButtonThemeData(
|
|
style: ElevatedButton.styleFrom(
|
|
shape: const RoundedRectangleBorder(
|
|
borderRadius: BorderRadius.zero,
|
|
),
|
|
foregroundColor: onPrimaryContainer,
|
|
backgroundColor: primaryContainer,
|
|
elevation: 0,
|
|
side: const BorderSide(color: Colors.red, width: 2),
|
|
),
|
|
),
|
|
cardTheme: const CardThemeData(
|
|
color: surfaceContainerLow,
|
|
elevation: 0,
|
|
shape: RoundedRectangleBorder(borderRadius: BorderRadius.zero),
|
|
margin: EdgeInsets.zero,
|
|
),
|
|
inputDecorationTheme: InputDecorationTheme(
|
|
filled: true,
|
|
fillColor: surfaceContainer, // Spec: surfaceContainer with 0px radius
|
|
contentPadding: const EdgeInsets.symmetric(horizontal: 16, vertical: 16),
|
|
border: const OutlineInputBorder(
|
|
borderSide: BorderSide.none,
|
|
borderRadius: BorderRadius.zero,
|
|
),
|
|
enabledBorder: const OutlineInputBorder(
|
|
borderSide: BorderSide.none,
|
|
borderRadius: BorderRadius.zero,
|
|
),
|
|
focusedBorder: OutlineInputBorder(
|
|
borderSide: BorderSide(color: primary.withOpacity(0.5), width: 2),
|
|
borderRadius: BorderRadius.zero,
|
|
),
|
|
labelStyle: const TextStyle(color: onSurfaceVariant),
|
|
hintStyle: GoogleFonts.manrope(color: onSurfaceVariant),
|
|
),
|
|
appBarTheme: AppBarTheme(
|
|
backgroundColor: surface,
|
|
foregroundColor: onSurface,
|
|
elevation: 0,
|
|
surfaceTintColor: Colors.transparent,
|
|
titleTextStyle: GoogleFonts.epilogue(
|
|
color: onSurface,
|
|
fontSize: 20,
|
|
fontWeight: FontWeight.bold,
|
|
letterSpacing: -0.02,
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|