Files
hash-wallet/lib/themes/theme_classes/black_theme.dart
T
jwinterm 59a6b25ff3 Theme overhaul: green primary + Such Software pink/blue accents
Tier A (theme classes):
- light_theme.dart: primary #1A5C38 (Hash green), secondary #B83278 (Such
  pink), tertiary #1F7DBF (Such blue), surface #F2F8F4 (very light minty).
  Full ColorScheme rewritten with green-family containers and green-tinted
  surface tokens.
- dark_theme.dart: primary #7FCAA0 (mint, readable on dark), secondary
  #E16FA6 (soft pink), tertiary #6AB7E6 (soft blue), surface #0B1F14
  (deep green). Containers + surface tokens tuned for the green palette.
- black_theme.dart: replaced accent enum (cakePrimary/tronRed/frostingPurple
  removed; hashGreen, suchPink, suchBlue added). bchGreen / bitcoinYellow /
  moneroOrange kept as chain identifiers.

Tier A (custom theme colors):
- light_theme_custom_colors.dart: backgroundGradient + cardGradient +
  toggleColorOffState retuned to green tints.
- dark_theme_custom_colors.dart: same for the dark variant.
- black_theme_custom_colors.dart: untouched (pure black AMOLED is brand-
  neutral on purpose).

Tier B (palette.dart):
- Cake's blue-family accents (Palette.blue, royalBlue, cornflower,
  blueCraiola family, pinkFlamingo, lavenders, oceanBlue, nightBlue,
  protectiveBlue, etc.) repainted into the green/pink/blue brand system.
- PaletteDark's night-blue surfaces wholesale repainted into deep-green
  equivalents. Original const names retained so every call-site compiles
  unchanged.
- moneroOrange, moneroLightOrange, bitcoinOrange, moneroCard, BCH green
  intentionally NOT touched — chain identifiers.
- Pure neutrals (gray, darkGray, manatee, dullGray, highContrastGray,
  shadowWhite, stateGray, granite, matrixGreen, red, error reds) kept.

Tier C deferred — hardcoded Color(0xFF...) literals scattered through
lib/ remain blue. Most should pull from ColorScheme so this should be
~80% visually rebranded already; iterate from screenshots.
2026-05-16 10:34:53 -04:00

301 lines
9.3 KiB
Dart

import 'package:flutter/material.dart';
import 'package:cake_wallet/themes/core/material_base_theme.dart';
import 'package:cake_wallet/themes/core/custom_theme_colors.dart';
import 'package:cake_wallet/themes/custom_theme_colors/black_theme_custom_colors.dart';
enum BlackThemeAccentColor implements ThemeAccentColor {
hashGreen(Color(0xFF7FCAA0), 'Hash Green'),
suchPink(Color(0xFFE16FA6), 'Such Pink'),
suchBlue(Color(0xFF6AB7E6), 'Such Blue'),
bchGreen(Color(0xFF44BA52), 'BCH Green'),
bitcoinYellow(Color(0xFFFFC107), 'Bitcoin Yellow'),
moneroOrange(Color(0xFFFF6600), 'Monero Orange');
const BlackThemeAccentColor(this.color, this.name);
@override
final Color color;
@override
final String name;
}
class BlackTheme extends MaterialThemeBase {
BlackTheme(this.accentColor, {this.isOled = false});
final BlackThemeAccentColor accentColor;
final bool isOled;
@override
Brightness get brightness => Brightness.dark;
@override
ThemeMode get themeMode => ThemeMode.dark;
@override
Color get primaryColor => accentColor.color;
@override
Color get secondaryColor => const Color(0xFFCCC4CD);
@override
Color get errorColor => const Color(0xFFFFB4AB);
@override
Color get surfaceColor => isOled ? const Color(0xFF000000) : const Color(0xFF131314);
@override
Color get tertiaryColor => const Color(0xFFDEBFC5);
@override
ColorScheme get colorScheme => ColorScheme.dark(
primary: primaryColor,
onPrimary: const Color(0xFF352D3C),
primaryContainer: const Color(0xFF28212F),
onPrimaryContainer: const Color(0xFFB7ABBE),
secondary: secondaryColor,
onSecondary: const Color(0xFF332F36),
secondaryContainer: const Color(0xFF454148),
onSecondaryContainer: const Color(0xFFDFD6DF),
tertiary: tertiaryColor,
onTertiary: const Color(0xFF3F2B30),
tertiaryContainer: const Color(0xFF321F24),
onTertiaryContainer: const Color(0xFFC6A8AE),
error: errorColor,
onError: const Color(0xFFB71919),
errorContainer: const Color(0xFFC53636),
onErrorContainer: const Color(0xFFFFDAD6),
surface: surfaceColor,
surfaceDim: const Color(0xFF000000),
background: surfaceColor,
onSurface: const Color(0xFFE6E1E3),
onSurfaceVariant: const Color(0xFFB4B4B4),
surfaceContainerLowest: isOled ? const Color(0xFF000000) : const Color(0xFF0F0E0F),
surfaceContainerLow: Color(0xFF1C1B1C),
surfaceContainer: Color(0xFF211F20),
surfaceContainerHigh: Color(0xFF2B292B),
surfaceContainerHighest: Color(0xFF363435),
outline: const Color(0xFF958F95),
outlineVariant: const Color(0xFF2F2D2F),
);
static const String fontFamily = 'Wix Madefor Text';
@override
TextTheme get textTheme => TextTheme(
displayLarge: TextStyle(
fontSize: 57,
fontWeight: FontWeight.w400,
letterSpacing: -0.25,
color: colorScheme.onSurface,
),
displayMedium: TextStyle(
fontSize: 45,
fontWeight: FontWeight.w400,
letterSpacing: 0,
color: colorScheme.onSurface,
),
displaySmall: TextStyle(
fontSize: 36,
fontWeight: FontWeight.w400,
letterSpacing: 0,
color: colorScheme.onSurface,
),
headlineLarge: TextStyle(
fontSize: 22,
fontWeight: FontWeight.w600,
letterSpacing: 0,
color: colorScheme.onSurface,
),
headlineMedium: TextStyle(
fontSize: 18,
fontWeight: FontWeight.w600,
letterSpacing: 0,
color: colorScheme.onSurface,
),
headlineSmall: TextStyle(
fontSize: 14,
fontWeight: FontWeight.w600,
letterSpacing: 0,
color: colorScheme.onSurface,
),
titleLarge: TextStyle(
fontSize: 22,
fontWeight: FontWeight.w500,
letterSpacing: 0,
color: colorScheme.onSurface,
),
titleMedium: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w500,
letterSpacing: 0.15,
color: colorScheme.onSurface,
),
titleSmall: TextStyle(
fontSize: 14,
fontWeight: FontWeight.w500,
letterSpacing: 0.1,
color: colorScheme.onSurface,
),
bodyLarge: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w400,
letterSpacing: 0.5,
color: colorScheme.onSurface,
),
bodyMedium: TextStyle(
fontSize: 14,
fontWeight: FontWeight.w400,
letterSpacing: 0.25,
color: colorScheme.onSurface,
),
bodySmall: TextStyle(
fontSize: 12,
fontWeight: FontWeight.w400,
letterSpacing: 0.4,
color: colorScheme.onSurface,
),
labelLarge: TextStyle(
fontSize: 14,
fontWeight: FontWeight.w500,
letterSpacing: 0.1,
color: colorScheme.onSurface,
),
labelMedium: TextStyle(
fontSize: 12,
fontWeight: FontWeight.w500,
letterSpacing: 0.5,
color: colorScheme.onSurface,
),
labelSmall: TextStyle(
fontSize: 10,
fontWeight: FontWeight.w500,
letterSpacing: 0.5,
color: colorScheme.onSurface,
),
);
@override
ThemeData get themeData => ThemeData(
useMaterial3: true,
fontFamily: fontFamily,
brightness: brightness,
colorScheme: colorScheme,
scaffoldBackgroundColor: surfaceColor,
canvasColor: surfaceColor,
cardColor: colorScheme.surface,
textTheme: textTheme,
appBarTheme: AppBarTheme(
backgroundColor: surfaceColor,
foregroundColor: colorScheme.onSurface,
elevation: 0,
),
cardTheme: CardThemeData(
color: colorScheme.surface,
elevation: 1,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12),
),
),
elevatedButtonTheme: ElevatedButtonThemeData(
style: ElevatedButton.styleFrom(
backgroundColor: colorScheme.primary,
foregroundColor: colorScheme.onPrimary,
elevation: 0,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(18),
),
),
),
outlinedButtonTheme: OutlinedButtonThemeData(
style: OutlinedButton.styleFrom(
foregroundColor: colorScheme.primary,
side: BorderSide(color: colorScheme.outline),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(18),
),
),
),
textButtonTheme: TextButtonThemeData(
style: TextButton.styleFrom(
foregroundColor: colorScheme.primary,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(18),
),
),
),
inputDecorationTheme: InputDecorationTheme(
filled: true,
fillColor: colorScheme.surfaceContainer,
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(18),
borderSide: BorderSide.none,
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(18),
borderSide: BorderSide.none,
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(18),
borderSide: BorderSide(color: colorScheme.primary),
),
errorBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(18),
borderSide: BorderSide(color: colorScheme.error),
),
focusedErrorBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(18),
borderSide: BorderSide(color: colorScheme.error),
),
disabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(18),
borderSide: BorderSide.none,
),
),
);
@override
String get title => 'Black Theme (${accentColor.name})';
@override
ThemeType get type => ThemeType.dark;
@override
int get raw {
final baseValue = switch (accentColor) {
BlackThemeAccentColor.hashGreen => 12,
BlackThemeAccentColor.bchGreen => 13,
BlackThemeAccentColor.bitcoinYellow => 14,
BlackThemeAccentColor.moneroOrange => 15,
BlackThemeAccentColor.suchPink => 16,
BlackThemeAccentColor.suchBlue => 17,
};
if (!isOled) return baseValue;
// OLED encodes as 100 + base to avoid collisions
return 100 + baseValue;
}
@override
CustomThemeColors get customColors => BlackThemeCustomColors();
@override
String? get themeFamily => 'BlackTheme';
@override
String? get accentColorId => accentColor.name.toLowerCase();
@override
String? get accentColorName => accentColor.name;
@override
bool operator ==(Object other) =>
identical(this, other) ||
other is BlackTheme &&
runtimeType == other.runtimeType &&
accentColor == other.accentColor &&
isOled == other.isOled;
@override
int get hashCode => Object.hash(accentColor, isOled);
}