Files
social-app/apps/lib/core/theme/design_tokens.dart
T

204 lines
6.0 KiB
Dart

import 'package:flutter/material.dart';
class AppColorPalette extends ThemeExtension<AppColorPalette> {
final List<Color> eventPresetColors;
final List<Color> avatarColors;
final Color g1Text, g1Divider, g1Border;
final Color g2Text, g2Divider, g2Border;
final Color g3Text, g3Divider, g3Border;
final Color eventDefault;
final Color eventArchived;
final Color warning;
final Color warningContainer;
final Color onWarning;
final Color onWarningContainer;
const AppColorPalette({
required this.eventPresetColors,
required this.avatarColors,
required this.g1Text,
required this.g1Divider,
required this.g1Border,
required this.g2Text,
required this.g2Divider,
required this.g2Border,
required this.g3Text,
required this.g3Divider,
required this.g3Border,
required this.eventDefault,
required this.eventArchived,
required this.warning,
required this.warningContainer,
required this.onWarning,
required this.onWarningContainer,
});
static const light = AppColorPalette(
eventPresetColors: [
Color(0xFF3B82F6),
Color(0xFF8B5CF6),
Color(0xFF10B981),
Color(0xFFF59E0B),
Color(0xFFEF4444),
],
avatarColors: [
Color(0xFF3B82F6),
Color(0xFF7C3AED),
Color(0xFF2563EB),
Color(0xFF2D6CDF),
Color(0xFF8B5CF6),
],
g1Text: Color(0xFFB91C1C),
g1Divider: Color(0xFFFEE2E2),
g1Border: Color(0xFFF3C6C6),
g2Text: Color(0xFFB45309),
g2Divider: Color(0xFFFFEDD5),
g2Border: Color(0xFFFDE2B8),
g3Text: Color(0xFF1D4ED8),
g3Divider: Color(0xFFEAF3FF),
g3Border: Color(0xFFCFE1FB),
eventDefault: Color(0xFF3B82F6),
eventArchived: Color(0xFF64748B),
warning: Color(0xFFF59E0B),
warningContainer: Color(0xFFFEF3C7),
onWarning: Color(0xFFFFFFFF),
onWarningContainer: Color(0xFF78350F),
);
static const dark = AppColorPalette(
eventPresetColors: [
Color(0xFF60A5FA),
Color(0xFFA78BFA),
Color(0xFF34D399),
Color(0xFFFBBF24),
Color(0xFFF87171),
],
avatarColors: [
Color(0xFF60A5FA),
Color(0xFFA78BFA),
Color(0xFF3B82F6),
Color(0xFF60A5FA),
Color(0xFF818CF8),
],
g1Text: Color(0xFFFCA5A5),
g1Divider: Color(0xFF7F1D1D),
g1Border: Color(0xFFB91C1C),
g2Text: Color(0xFFFCD34D),
g2Divider: Color(0xFF78350F),
g2Border: Color(0xFFD97706),
g3Text: Color(0xFF93C5FD),
g3Divider: Color(0xFF1E3A8A),
g3Border: Color(0xFF2563EB),
eventDefault: Color(0xFF60A5FA),
eventArchived: Color(0xFF94A3B8),
warning: Color(0xFFFBBF24),
warningContainer: Color(0xFF78350F),
onWarning: Color(0xFF0F172A),
onWarningContainer: Color(0xFFFEF3C7),
);
@override
AppColorPalette copyWith({
List<Color>? eventPresetColors,
List<Color>? avatarColors,
Color? g1Text,
Color? g1Divider,
Color? g1Border,
Color? g2Text,
Color? g2Divider,
Color? g2Border,
Color? g3Text,
Color? g3Divider,
Color? g3Border,
Color? eventDefault,
Color? eventArchived,
Color? warning,
Color? warningContainer,
Color? onWarning,
Color? onWarningContainer,
}) {
return AppColorPalette(
eventPresetColors: eventPresetColors ?? this.eventPresetColors,
avatarColors: avatarColors ?? this.avatarColors,
g1Text: g1Text ?? this.g1Text,
g1Divider: g1Divider ?? this.g1Divider,
g1Border: g1Border ?? this.g1Border,
g2Text: g2Text ?? this.g2Text,
g2Divider: g2Divider ?? this.g2Divider,
g2Border: g2Border ?? this.g2Border,
g3Text: g3Text ?? this.g3Text,
g3Divider: g3Divider ?? this.g3Divider,
g3Border: g3Border ?? this.g3Border,
eventDefault: eventDefault ?? this.eventDefault,
eventArchived: eventArchived ?? this.eventArchived,
warning: warning ?? this.warning,
warningContainer: warningContainer ?? this.warningContainer,
onWarning: onWarning ?? this.onWarning,
onWarningContainer: onWarningContainer ?? this.onWarningContainer,
);
}
@override
AppColorPalette lerp(ThemeExtension<AppColorPalette>? other, double t) {
if (other is! AppColorPalette) return this;
return AppColorPalette(
eventPresetColors: eventPresetColors
.asMap()
.entries
.map((e) => Color.lerp(e.value, other.eventPresetColors[e.key], t)!)
.toList(),
avatarColors: avatarColors
.asMap()
.entries
.map((e) => Color.lerp(e.value, other.avatarColors[e.key], t)!)
.toList(),
g1Text: Color.lerp(g1Text, other.g1Text, t)!,
g1Divider: Color.lerp(g1Divider, other.g1Divider, t)!,
g1Border: Color.lerp(g1Border, other.g1Border, t)!,
g2Text: Color.lerp(g2Text, other.g2Text, t)!,
g2Divider: Color.lerp(g2Divider, other.g2Divider, t)!,
g2Border: Color.lerp(g2Border, other.g2Border, t)!,
g3Text: Color.lerp(g3Text, other.g3Text, t)!,
g3Divider: Color.lerp(g3Divider, other.g3Divider, t)!,
g3Border: Color.lerp(g3Border, other.g3Border, t)!,
eventDefault: Color.lerp(eventDefault, other.eventDefault, t)!,
eventArchived: Color.lerp(eventArchived, other.eventArchived, t)!,
warning: Color.lerp(warning, other.warning, t)!,
warningContainer: Color.lerp(
warningContainer,
other.warningContainer,
t,
)!,
onWarning: Color.lerp(onWarning, other.onWarning, t)!,
onWarningContainer: Color.lerp(
onWarningContainer,
other.onWarningContainer,
t,
)!,
);
}
}
class AppSpacing {
AppSpacing._();
static const double none = 0.0;
static const double xs = 4.0;
static const double sm = 8.0;
static const double md = 12.0;
static const double lg = 16.0;
static const double xl = 20.0;
static const double xxl = 24.0;
}
class AppRadius {
AppRadius._();
static const double sm = 6.0;
static const double md = 12.0;
static const double lg = 16.0;
static const double xl = 18.0;
static const double xxl = 24.0;
static const double full = 999.0;
}