Michael/xtremflow
1
0 Fork 0
mirror of https://github.com/R0m1k3/xtremflow.git synced 2026-10-11 17:30:00 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat(design): Warm Cinema theme + event-driven adaptive players

Browse Source 
Replaces the Projector Noir palette with "Warm Cinema" and rebuilds the
web players around a shared, event-driven engine.

Design
- app_colors: warm charcoal (#0B0908), cream (#F3E9DF), ember (#D9541F);
  adds posterScrim/heroScrim gradients, lift()/emberFocus() shadows,
  const cream-alpha tokens replacing Colors.whiteNN, and primaryFill,
  a deeper ember reserved for text-bearing fills so white labels clear
  the 4.5:1 AA threshold that #D9541F alone does not
- app_theme / mobile_theme: Fraunces (display serif) + Karla (body),
  tighter radii, 20+ component themes
- glass_container: opaque layered surfaces replace the blurred glass
- themed_loading_screen restyled; players and boot splash follow

Performance
- drop every BackdropFilter: backdrop blur forced a full framebuffer
  read per frame per card, the main source of scroll jank
- bundle Fraunces/Karla as assets so google_fonts stops fetching from
  fonts.gstatic.com at startup
- bound image decode size on 12 sites: a 40-poster grid drops from
  ~240 MB to a few tens of MB of GPU memory

Players (new shared engine: web/xf-player-core.js)
- start on media events instead of polling the buffer every 100-200 ms
- hls.js/mpegts.js loaded on demand, so ~213 KB of mpegts is never
  fetched for HLS streams
- liveSyncDurationCount 10 -> 2, startFragPrefetch on, testBandwidth
  off, MPEG-TS initial stash 512 KB -> 64 KB
- adaptive escalation fast -> balanced -> safe after repeated stalls in
  a 60 s window, applied live for HLS so there is no visible cut

Preserved from the recent streaming work on main: server-side quality
selection, stable player viewId, the turbo direct MPEG-TS path, vendored
library cache headers and the CI/Docker changes. Only the theme layer and
the player front-end were replaced; GlassCard stays in ui_components.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
MichaelandClaude Opus 5 committed 2026-08-10 21:42:56 +02:00
1 parent e332895d7d
commit 1feeaae78a
49 files changed
+2341 -1751
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

lib/core/theme/app_colors.dart
+171 -99
View File
@@ -1,134 +1,202 @@
import 'package:flutter/material.dart';
/// Projector Noir Design System — Material 3 Token Palette
/// XtremFlow — "Warm Cinema" Design System
///
/// Warm tungsten light on deep film-black, like a projector beam cutting
/// through a dark screening room. Verdigris teal as the counterpoint accent.
/// Optimized for OLED displays and low-light environments.
/// Primary accent: Tungsten amber (#F39A1F / #FFB35C)
/// Palette: charbon chaud + crème + orange brûlé (ember).
/// Inspiration: salle de projection, pellicule, affiches 70s.
///
/// Règle de perf : AUCUNE couleur de surface n'est translucide.
/// Les anciennes "glass" surfaces sont désormais opaques et pré-teintées,
/// ce qui supprime tout besoin de `BackdropFilter` (killer de perf sur
/// Flutter Web). La profondeur vient des ombres et du contraste, pas du flou.
class AppColors {
AppColors._();
// ============ COMPATIBILITY ALIASES (transition) ============
// ============ COMPATIBILITY ALIASES ============
static Color get focusColor => primaryContainer;
static Color get border => outlineVariant;
// ============ SURFACE / ON SURFACE ============
static const Color onSurface = Color(0xFFECE6DA);
static const Color onSurfaceVariant = Color(0xFFCDC4B4);
static const Color onSurface = Color(0xFFF3E9DF); // crème
static const Color onSurfaceVariant = Color(0xFFC5B3A5); // crème atténué
// ============ BASE LEVEL 0 ============
static const Color baseLevel0 = Color(0xFF0B0A08);
/// Noir chaud — le "noir de salle", jamais un noir pur bleuté.
static const Color baseLevel0 = Color(0xFF0B0908);
// ============ BACKGROUNDS ============
static const Color background = Color(0xFF14110C);
static const Color onBackground = Color(0xFFECE6DA);
static const Color background = Color(0xFF100C0A);
static const Color onBackground = Color(0xFFF3E9DF);
static const Color surface = Color(0xFF14110C);
static const Color surfaceDim = Color(0xFF14110C);
static const Color surfaceBright = Color(0xFF3E382C);
static const Color surface = Color(0xFF100C0A);
static const Color surfaceDim = Color(0xFF0B0908);
static const Color surfaceBright = Color(0xFF3C322C);
// Surface Containers (Material 3 hierarchy)
static const Color surfaceContainerLowest = Color(0xFF0E0C09);
static const Color surfaceContainerLow = Color(0xFF1B1812);
static const Color surfaceContainer = Color(0xFF211D16);
static const Color surfaceContainerHigh = Color(0xFF2B261E);
static const Color surfaceContainerHighest = Color(0xFF363027);
static const Color surfaceVariant = Color(0xFF363027);
// Surface Containers (hiérarchie Material 3, toutes opaques)
static const Color surfaceContainerLowest = Color(0xFF070505);
static const Color surfaceContainerLow = Color(0xFF181310);
static const Color surfaceContainer = Color(0xFF1F1815);
static const Color surfaceContainerHigh = Color(0xFF2A211C);
static const Color surfaceContainerHighest = Color(0xFF352A24);
static const Color surfaceVariant = Color(0xFF352A24);
// ============ PRIMARY (Tungsten Amber) ============
static const Color primary = Color(0xFFFFB35C);
static const Color onPrimary = Color(0xFF452800);
static const Color primaryContainer = Color(0xFFF39A1F);
static const Color onPrimaryContainer = Color(0xFF2E1B00);
static const Color inversePrimary = Color(0xFF8F5B00);
static const Color primaryFixed = Color(0xFFFFDDB3);
static const Color primaryFixedDim = Color(0xFFFFB35C);
static const Color onPrimaryFixed = Color(0xFF2A1700);
static const Color onPrimaryFixedVariant = Color(0xFF6B4300);
// ============ PRIMARY (Ember / orange brûlé) ============
static const Color primary = Color(0xFFFFB68C); // texte & icônes sur sombre
static const Color onPrimary = Color(0xFF521B00);
static const Color primaryContainer = Color(0xFFD9541F); // remplissage ember
static const Color onPrimaryContainer = Color(0xFF2B0A00);
static const Color inversePrimary = Color(0xFFA63B10);
// ============ SECONDARY (Warm Taupe) ============
static const Color secondary = Color(0xFFD3C6B2);
static const Color onSecondary = Color(0xFF382F21);
static const Color secondaryContainer = Color(0xFF504535);
static const Color onSecondaryContainer = Color(0xFFD8CCB9);
static const Color secondaryFixed = Color(0xFFF0E4D0);
static const Color secondaryFixedDim = Color(0xFFD3C6B2);
static const Color onSecondaryFixed = Color(0xFF231B0E);
static const Color onSecondaryFixedVariant = Color(0xFF4D4232);
/// Braise profonde — réservée aux **remplissages portant du texte**.
/// `primaryContainer` (#D9541F) est trop lumineux : blanc dessus plafonne
/// vers 3,9:1, sous le seuil AA de 4,5:1 pour du corps de texte. Cette
/// variante passe le seuil tout en restant la même couleur perçue.
static const Color primaryFill = Color(0xFFA8360C);
static const Color primaryFixed = Color(0xFFFFDBC8);
static const Color primaryFixedDim = Color(0xFFFFB68C);
static const Color onPrimaryFixed = Color(0xFF360F00);
static const Color onPrimaryFixedVariant = Color(0xFF7A2C08);
// ============ TERTIARY (Verdigris Teal) ============
static const Color tertiary = Color(0xFFA4CCBE);
static const Color onTertiary = Color(0xFF0F352B);
static const Color tertiaryContainer = Color(0xFF2F5A4C);
static const Color onTertiaryContainer = Color(0xFFC0E8D9);
static const Color tertiaryFixed = Color(0xFFC0E8D9);
static const Color tertiaryFixedDim = Color(0xFFA4CCBE);
static const Color onTertiaryFixed = Color(0xFF04201A);
static const Color onTertiaryFixedVariant = Color(0xFF274B40);
// ============ SECONDARY (Terre cuite / argile) ============
static const Color secondary = Color(0xFFE7C3AC);
static const Color onSecondary = Color(0xFF442A1B);
static const Color secondaryContainer = Color(0xFF5D4030);
static const Color onSecondaryContainer = Color(0xFFFFDCC8);
static const Color secondaryFixed = Color(0xFFFFDCC8);
static const Color secondaryFixedDim = Color(0xFFE7C3AC);
static const Color onSecondaryFixed = Color(0xFF2B160A);
static const Color onSecondaryFixedVariant = Color(0xFF5D4030);
// ============ TERTIARY (Laiton / doré patiné) ============
static const Color tertiary = Color(0xFFD9C88C);
static const Color onTertiary = Color(0xFF3A3016);
static const Color tertiaryContainer = Color(0xFF52472A);
static const Color onTertiaryContainer = Color(0xFFF6E4A6);
static const Color tertiaryFixed = Color(0xFFF6E4A6);
static const Color tertiaryFixedDim = Color(0xFFD9C88C);
static const Color onTertiaryFixed = Color(0xFF231B04);
static const Color onTertiaryFixedVariant = Color(0xFF52472A);
// ============ ERROR ============
static const Color error = Color(0xFFffb4ab);
static const Color onError = Color(0xFF690005);
static const Color errorContainer = Color(0xFF93000a);
static const Color onErrorContainer = Color(0xFFffdad6);
static const Color error = Color(0xFFFFB4A6);
static const Color onError = Color(0xFF5F1409);
static const Color errorContainer = Color(0xFF8C2416);
static const Color onErrorContainer = Color(0xFFFFDAD4);
// ============ OUTLINE ============
static const Color outline = Color(0xFF998F7C);
static const Color outlineVariant = Color(0xFF4A4334);
static const Color outline = Color(0xFF9C8878);
static const Color outlineVariant = Color(0xFF4A3C33);
// ============ INVERSE SURFACE ============
static const Color inverseSurface = Color(0xFFECE6DA);
static const Color inverseOnSurface = Color(0xFF332F26);
static const Color inverseSurface = Color(0xFFF3E9DF);
static const Color inverseOnSurface = Color(0xFF2A211C);
// ============ SURFACE TINT ============
static const Color surfaceTint = Color(0xFFFFB35C);
static const Color surfaceTint = Color(0xFFFFB68C);
// ============ TEXT / CONTENT COLORS ============
static const Color textPrimary = Color(0xFFECE6DA);
static const Color textSecondary = Color(0xFFCDC4B4);
static const Color textTertiary = Color(0xFF998F7C);
// ============ TEXT / CONTENT ============
static const Color textPrimary = Color(0xFFF3E9DF);
static const Color textSecondary = Color(0xFFC5B3A5);
static const Color textTertiary = Color(0xFF9C8878);
// ============ STATUS COLORS ============
static const Color success = Color(0xFF6BD89B);
static const Color warning = Color(0xFFFFAB00);
static const Color info = Color(0xFF64B6AC);
// ============ CRÈME À OPACITÉ (remplace les Colors.whiteNN) ============
// Déclarés `const` pour rester utilisables dans les widgets constants.
// Un blanc pur sur fond chaud tire vers le bleu : on décline la crème.
static const Color onSurface06 = Color(0x0FF3E9DF);
static const Color onSurface12 = Color(0x1FF3E9DF);
static const Color onSurface24 = Color(0x3DF3E9DF);
static const Color onSurface38 = Color(0x61F3E9DF);
static const Color onSurface54 = Color(0x8AF3E9DF);
// ============ CATEGORY COLORS (kept for semantic meaning) ============
static const Color live = Color(0xFFFF6E5E);
static const Color movies = Color(0xFFE8B64C);
static const Color series = Color(0xFF5FC9AE);
// ============ STATUS ============
static const Color success = Color(0xFF9BC46A); // olive lumineux
static const Color warning = Color(0xFFE9B23C); // ambre
static const Color info = Color(0xFFA3B8C4); // bleu-gris fumé
// ============ CATÉGORIES ============
static const Color live = Color(0xFFE5484D); // rouge enseigne
static const Color movies = Color(0xFFD9541F); // ember
static const Color series = Color(0xFFD9C88C); // laiton
// ============ RATING / PREMIUM ============
static const Color ratingGold = Color(0xFFFFD166);
static const Color premiumGold = Color(0xFFFFA000);
static const Color ratingGold = Color(0xFFE9B23C);
static const Color premiumGold = Color(0xFFC9922A);
// ============ GLASSMORPHISM LEVELS ============
static const Color glassLevel1Bg = Color(0x6614110C); // 40% opacity
static const Color glassLevel1Border = Color(0x1AFFE9C9); // 10% warm white
// ============ SHIMMER (placeholders de chargement) ============
static const Color shimmer = Color(0xFF2A211C);
static const Color shimmerHighlight = Color(0xFF3C302A);
static const Color glassLevel2Bg = Color(0x9914110C); // 60% opacity
static const Color glassLevel2Border = Color(0x1AFFE9C9); // 10% warm white
static const Color glassLevel2InnerGlow = Color(0x33FFB35C); // 20% primary top-left
// ============ SURFACES "GLASS" — désormais OPAQUES ============
// Noms conservés pour compatibilité avec les 33 sites d'appel existants.
// Plus aucune transparence : zéro BackdropFilter, zéro repaint coûteux.
static const Color glassLevel1Bg = Color(0xFF181310);
static const Color glassLevel1Border = Color(0x14F3E9DF); // crème 8 %
static const Color glassLevel2Bg = Color(0xFF1F1815);
static const Color glassLevel2Border = Color(0x1FF3E9DF); // crème 12 %
static const Color glassLevel2InnerGlow = Color(0x3DD9541F); // ember 24 %
// ============ GRADIENTS ============
/// Braise : orange brûlé vers rouge profond.
static const LinearGradient primaryGradient = LinearGradient(
colors: [Color(0xFFE8941A), Color(0xFFFFC36A)],
begin: Alignment.centerLeft,
end: Alignment.centerRight,
colors: [Color(0xFFE9701F), Color(0xFFC13A1C)],
begin: Alignment.topLeft,
end: Alignment.bottomRight,
);
/// Fond de salle : projecteur chaud en haut, obscurité en bas.
static const LinearGradient backgroundGradient = LinearGradient(
colors: [Color(0xFF0B0A08), Color(0xFF14110C)],
colors: [Color(0xFF1A1310), Color(0xFF0B0908)],
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
);
// ============ GLOW / SHADOWS ============
/// Voile d'affiche : lecture du texte par-dessus une jaquette.
static const LinearGradient posterScrim = LinearGradient(
colors: [Color(0x000B0908), Color(0xCC0B0908), Color(0xFF0B0908)],
stops: [0.0, 0.55, 1.0],
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
);
/// Voile latéral pour les héros pleine largeur.
static const LinearGradient heroScrim = LinearGradient(
colors: [Color(0xF20B0908), Color(0x990B0908), Color(0x000B0908)],
stops: [0.0, 0.45, 1.0],
begin: Alignment.centerLeft,
end: Alignment.centerRight,
);
// ============ GLOW / OMBRES ============
static Color glowPrimary(double opacity) =>
const Color(0xFFF39A1F).withOpacity(opacity);
const Color(0xFFD9541F).withValues(alpha: opacity);
static Color glowPrimaryDim(double opacity) =>
const Color(0xFFFFB35C).withOpacity(opacity);
const Color(0xFFFFB68C).withValues(alpha: opacity);
/// Ombre portée « projecteur » : profonde, chaude, jamais grise.
static List<BoxShadow> lift({double intensity = 1.0}) => [
BoxShadow(
color: const Color(0xFF000000).withValues(alpha: 0.55 * intensity),
blurRadius: 28 * intensity,
spreadRadius: -8,
offset: Offset(0, 12 * intensity),
),
];
/// Halo ember pour l'élément focalisé (navigation TV / télécommande).
static List<BoxShadow> emberFocus({double intensity = 1.0}) => [
BoxShadow(
color: const Color(0xFFD9541F).withValues(alpha: 0.45 * intensity),
blurRadius: 32 * intensity,
spreadRadius: -4,
),
BoxShadow(
color: const Color(0xFF000000).withValues(alpha: 0.6),
blurRadius: 24,
spreadRadius: -10,
offset: const Offset(0, 14),
),
];
// ============ COLOR SCHEMES ============
static ColorScheme get darkColorScheme => const ColorScheme.dark(
@@ -150,6 +218,7 @@ class AppColors {
onErrorContainer: onErrorContainer,
surface: surface,
onSurface: onSurface,
onSurfaceVariant: onSurfaceVariant,
surfaceContainerLowest: surfaceContainerLowest,
surfaceContainerLow: surfaceContainerLow,
surfaceContainer: surfaceContainer,
@@ -163,24 +232,27 @@ class AppColors {
brightness: Brightness.dark,
);
// Light scheme is minimal — Projector Noir is dark-first
/// Thème clair : « papier kraft » — même famille chaude, inversée.
static ColorScheme get lightColorScheme => const ColorScheme.light(
primary: Color(0xFF8F5B00),
primary: Color(0xFFA63B10),
onPrimary: Colors.white,
primaryContainer: Color(0xFFFFDDB3),
onPrimaryContainer: Color(0xFF2A1700),
secondary: Color(0xFF6F6353),
primaryContainer: Color(0xFFFFDBC8),
onPrimaryContainer: Color(0xFF360F00),
secondary: Color(0xFF765847),
onSecondary: Colors.white,
secondaryContainer: Color(0xFFF0E4D0),
onSecondaryContainer: Color(0xFF231B0E),
error: Color(0xFFba1a1a),
secondaryContainer: Color(0xFFFFDCC8),
onSecondaryContainer: Color(0xFF2B160A),
tertiary: Color(0xFF6A5F3F),
onTertiary: Colors.white,
error: Color(0xFFB3261E),
onError: Colors.white,
errorContainer: Color(0xFFFFdad6),
onErrorContainer: Color(0xFF410002),
surface: Color(0xFFFFF8F0),
onSurface: Color(0xFF1E1B15),
outline: Color(0xFF7F766A),
outlineVariant: Color(0xFFD0C5B4),
errorContainer: Color(0xFFFFDAD4),
onErrorContainer: Color(0xFF410E05),
surface: Color(0xFFFBF3EC),
onSurface: Color(0xFF201A16),
onSurfaceVariant: Color(0xFF52443B),
outline: Color(0xFF847369),
outlineVariant: Color(0xFFD6C3B7),
brightness: Brightness.light,
);
}
lib/core/theme/app_theme.dart
+404 -171
View File
@@ -2,15 +2,15 @@ import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
import 'app_colors.dart';
/// XtremFlow Projector Noir Theme
/// XtremFlow — Thème « Warm Cinema »
///
/// Warm tungsten light on deep film-black.
/// Fonts: Syne (headlines, art-house geometric) + Instrument Sans (body/labels)
/// Style: Dark-first glassmorphism with tungsten amber accents.
/// Typo : Fraunces (display, serif éditorial) + Karla (corps / UI).
/// Style : charbon chaud, crème, orange brûlé. Profondeur par l'ombre,
/// jamais par le flou — aucun `BackdropFilter` dans tout le thème.
class AppTheme {
AppTheme._();
// ============ SPACING (8px rhythmic system) ============
// ============ ESPACEMENT (rythme 4 / 8) ============
static const double spacingXs = 4.0;
static const double spacingSm = 8.0;
static const double spacingBase = 8.0;
@@ -20,33 +20,69 @@ class AppTheme {
static const double spacing2xl = 48.0;
static const double spacing3xl = 80.0;
// ============ RADIUS ============
// Alias numériques (utilisés dans plusieurs écrans)
static const double spacing4 = 4.0;
static const double spacing8 = 8.0;
static const double spacing12 = 12.0;
static const double spacing16 = 16.0;
static const double spacing24 = 24.0;
static const double spacing32 = 32.0;
static const double spacing48 = 48.0;
// ============ RAYONS ============
// Cinéma : angles doux mais assumés, jamais des bulles.
static const double radiusNone = 0.0;
static const double radiusSm = 8.0;
static const double radiusMd = 12.0;
static const double radiusLg = 16.0;
static const double radiusXl = 24.0;
static const double radiusSm = 6.0;
static const double radiusMd = 10.0;
static const double radiusLg = 14.0;
static const double radiusXl = 20.0;
static const double radiusFull = 9999.0;
// ============ ANIMATION ============
static const Duration durationFast = Duration(milliseconds: 200);
static const Duration durationNormal = Duration(milliseconds: 300);
static const Duration durationSm = Duration(milliseconds: 200);
static const Duration durationMd = Duration(milliseconds: 300);
static const Duration durationLg = Duration(milliseconds: 400);
static const Duration durationXl = Duration(milliseconds: 500);
static const Curve curveDefault = Curves.fastOutSlowIn;
static const Curve curveSmooth = Curves.fastOutSlowIn;
// Rythme lent, « fondu de projection ».
static const Duration durationXs = Duration(milliseconds: 120);
static const Duration durationFast = Duration(milliseconds: 180);
static const Duration durationNormal = Duration(milliseconds: 260);
static const Duration durationSm = Duration(milliseconds: 180);
static const Duration durationMd = Duration(milliseconds: 260);
static const Duration durationLg = Duration(milliseconds: 380);
static const Duration durationXl = Duration(milliseconds: 520);
// ============ TYPOGRAPHY HELPERS ============
static TextStyle _syne({
static const Curve curveDefault = Curves.easeOutCubic;
static const Curve curveSmooth = Curves.easeOutCubic;
/// Courbe « entrée cinéma » : démarre vite, s'installe lentement.
static const Curve curveCinema = Cubic(0.16, 1.0, 0.3, 1.0);
// ============ TYPOGRAPHIE ============
/// Display serif éditorial — titres, héros, chiffres marquants.
static TextStyle display({
required double fontSize,
required FontWeight fontWeight,
double? letterSpacing,
double? height,
Color color = AppColors.onSurface,
FontStyle? fontStyle,
}) {
return GoogleFonts.fraunces(
fontSize: fontSize,
fontWeight: fontWeight,
letterSpacing: letterSpacing,
height: height,
color: color,
fontStyle: fontStyle,
);
}
/// Corps / UI — humaniste chaud, très lisible à distance TV.
static TextStyle body({
required double fontSize,
required FontWeight fontWeight,
double? letterSpacing,
double? height,
Color color = AppColors.onSurface,
}) {
return GoogleFonts.syne(
return GoogleFonts.karla(
fontSize: fontSize,
fontWeight: fontWeight,
letterSpacing: letterSpacing,
@@ -55,137 +91,178 @@ class AppTheme {
);
}
static TextStyle _instrumentSans({
/// Micro-label capitales espacées — « GÉNÉRIQUE DE FILM ».
static TextStyle eyebrow({
double fontSize = 11,
Color color = AppColors.textTertiary,
FontWeight fontWeight = FontWeight.w700,
}) {
return GoogleFonts.karla(
fontSize: fontSize,
fontWeight: fontWeight,
letterSpacing: 1.6,
height: 1.1,
color: color,
);
}
// Alias internes historiques
static TextStyle _display({
required double fontSize,
required FontWeight fontWeight,
double? letterSpacing,
double? height,
Color color = AppColors.onSurface,
}) {
return GoogleFonts.instrumentSans(
fontSize: fontSize,
fontWeight: fontWeight,
letterSpacing: letterSpacing,
height: height,
color: color,
);
}
}) =>
display(
fontSize: fontSize,
fontWeight: fontWeight,
letterSpacing: letterSpacing,
height: height,
color: color,
);
// ============ DARK THEME (Main) ============
static TextStyle _body({
required double fontSize,
required FontWeight fontWeight,
double? letterSpacing,
double? height,
Color color = AppColors.onSurface,
}) =>
body(
fontSize: fontSize,
fontWeight: fontWeight,
letterSpacing: letterSpacing,
height: height,
color: color,
);
// ============ THÈME SOMBRE (principal) ============
static ThemeData get darkTheme {
final baseTheme = ThemeData.dark(useMaterial3: true);
return baseTheme.copyWith(
colorScheme: AppColors.darkColorScheme,
scaffoldBackgroundColor: AppColors.background,
canvasColor: AppColors.background,
splashColor: AppColors.primaryContainer.withValues(alpha: 0.12),
highlightColor: AppColors.primaryContainer.withValues(alpha: 0.08),
// Typography
textTheme: TextTheme(
// Display / Headline (Syne)
displayLarge: _syne(
fontSize: 48,
// Display — Fraunces, serrée, autoritaire
displayLarge: _display(
fontSize: 56,
fontWeight: FontWeight.w700,
letterSpacing: -0.02,
height: 1.1,
letterSpacing: -1.4,
height: 1.02,
),
displayMedium: _syne(
displayMedium: _display(
fontSize: 40,
fontWeight: FontWeight.w600,
letterSpacing: -0.9,
height: 1.08,
),
displaySmall: _display(
fontSize: 30,
fontWeight: FontWeight.w600,
letterSpacing: -0.5,
height: 1.15,
),
headlineLarge: _display(
fontSize: 32,
fontWeight: FontWeight.w600,
letterSpacing: -0.01,
height: 1.2,
letterSpacing: -0.6,
height: 1.12,
),
displaySmall: _syne(
headlineMedium: _display(
fontSize: 24,
fontWeight: FontWeight.w500,
height: 1.3,
),
headlineLarge: _syne(
fontSize: 32,
fontWeight: FontWeight.w600,
letterSpacing: -0.01,
letterSpacing: -0.3,
height: 1.2,
),
headlineMedium: _syne(
fontSize: 24,
fontWeight: FontWeight.w500,
height: 1.3,
),
headlineSmall: _syne(
fontSize: 20,
fontWeight: FontWeight.w500,
height: 1.3,
),
titleLarge: _syne(
headlineSmall: _display(
fontSize: 20,
fontWeight: FontWeight.w600,
letterSpacing: -0.2,
height: 1.25,
),
titleMedium: _instrumentSans(
titleLarge: _display(
fontSize: 19,
fontWeight: FontWeight.w600,
letterSpacing: -0.1,
),
titleMedium: _body(
fontSize: 16,
fontWeight: FontWeight.w600,
fontWeight: FontWeight.w700,
letterSpacing: 0.1,
),
titleSmall: _instrumentSans(
titleSmall: _body(
fontSize: 14,
fontWeight: FontWeight.w600,
fontWeight: FontWeight.w700,
letterSpacing: 0.2,
),
// Body (Instrument Sans)
bodyLarge: _instrumentSans(
fontSize: 18,
// Corps — Karla
bodyLarge: _body(
fontSize: 17,
fontWeight: FontWeight.w400,
height: 1.6,
height: 1.62,
color: AppColors.onSurfaceVariant,
),
bodyMedium: _instrumentSans(
fontSize: 16,
bodyMedium: _body(
fontSize: 15,
fontWeight: FontWeight.w400,
height: 1.5,
height: 1.55,
color: AppColors.onSurfaceVariant,
),
bodySmall: _instrumentSans(
fontSize: 14,
bodySmall: _body(
fontSize: 13,
fontWeight: FontWeight.w400,
height: 1.4,
height: 1.45,
color: AppColors.onSurfaceVariant,
),
// Labels (Instrument Sans with tracking)
labelLarge: _instrumentSans(
fontSize: 14,
fontWeight: FontWeight.w600,
letterSpacing: 0.05,
// Labels — capitales espacées, esprit générique de film
labelLarge: _body(
fontSize: 13,
fontWeight: FontWeight.w700,
letterSpacing: 1.1,
height: 1.2,
),
labelMedium: _instrumentSans(
labelMedium: _body(
fontSize: 12,
fontWeight: FontWeight.w500,
letterSpacing: 0.02,
fontWeight: FontWeight.w600,
letterSpacing: 0.9,
height: 1.2,
),
labelSmall: _instrumentSans(
labelSmall: _body(
fontSize: 11,
fontWeight: FontWeight.w500,
letterSpacing: 0.02,
fontWeight: FontWeight.w600,
letterSpacing: 1.4,
height: 1.2,
color: AppColors.textTertiary,
),
),
// AppBar: Transparent glass
// AppBar : plate, sans élévation, le fond fait le travail
appBarTheme: AppBarTheme(
backgroundColor: Colors.transparent,
surfaceTintColor: Colors.transparent,
foregroundColor: AppColors.onSurface,
elevation: 0,
centerTitle: true,
centerTitle: false,
scrolledUnderElevation: 0,
titleTextStyle: _syne(
fontSize: 20,
titleTextStyle: _display(
fontSize: 22,
fontWeight: FontWeight.w600,
letterSpacing: -0.3,
),
),
// Inputs: Dark filled with amber glow on focus
// Champs : creusés dans la surface, liseré ember au focus
inputDecorationTheme: InputDecorationTheme(
filled: true,
fillColor: AppColors.surfaceContainerLow,
contentPadding: const EdgeInsets.symmetric(
horizontal: spacingLg,
horizontal: spacingMd,
vertical: spacingMd,
),
border: OutlineInputBorder(
@@ -198,84 +275,116 @@ class AppTheme {
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(radiusMd),
borderSide: const BorderSide(color: AppColors.primaryContainer, width: 2),
borderSide:
const BorderSide(color: AppColors.primaryContainer, width: 2),
),
errorBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(radiusMd),
borderSide: const BorderSide(color: AppColors.error, width: 1),
),
hintStyle: _instrumentSans(
fontSize: 16,
focusedErrorBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(radiusMd),
borderSide: const BorderSide(color: AppColors.error, width: 2),
),
hintStyle: _body(
fontSize: 15,
fontWeight: FontWeight.w400,
color: AppColors.outline,
),
labelStyle: _instrumentSans(
fontSize: 14,
fontWeight: FontWeight.w500,
color: AppColors.onSurfaceVariant,
color: AppColors.textTertiary,
),
labelStyle: eyebrow(color: AppColors.onSurfaceVariant),
floatingLabelStyle: eyebrow(color: AppColors.primary),
),
// Buttons: Gradient primary, ghost secondary
// Boutons pleins : ember franc, coins nets
filledButtonTheme: FilledButtonThemeData(
style: FilledButton.styleFrom(
backgroundColor: AppColors.primaryContainer,
foregroundColor: AppColors.onPrimaryContainer,
backgroundColor: AppColors.primaryFill,
foregroundColor: AppColors.onSurface,
disabledBackgroundColor: AppColors.surfaceContainerHigh,
disabledForegroundColor: AppColors.textTertiary,
elevation: 0,
padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 14),
padding: const EdgeInsets.symmetric(horizontal: 26, vertical: 16),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(radiusMd),
),
textStyle: _instrumentSans(
fontSize: 14,
fontWeight: FontWeight.w600,
letterSpacing: 0.05,
textStyle: _body(
fontSize: 13,
fontWeight: FontWeight.w700,
letterSpacing: 1.1,
),
).copyWith(
overlayColor: WidgetStateProperty.resolveWith((states) {
if (states.contains(WidgetState.hovered)) {
return Colors.white.withOpacity(0.1);
}
if (states.contains(WidgetState.pressed)) {
return Colors.white.withOpacity(0.2);
return Colors.black.withValues(alpha: 0.18);
}
if (states.contains(WidgetState.hovered) ||
states.contains(WidgetState.focused)) {
return AppColors.onSurface.withValues(alpha: 0.12);
}
return null;
}),
),
),
// Outlined buttons: ghost style
elevatedButtonTheme: ElevatedButtonThemeData(
style: ElevatedButton.styleFrom(
backgroundColor: AppColors.surfaceContainerHigh,
foregroundColor: AppColors.onSurface,
elevation: 0,
padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 15),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(radiusMd),
),
textStyle: _body(
fontSize: 13,
fontWeight: FontWeight.w700,
letterSpacing: 1.1,
),
),
),
// Boutons contour : liseré crème discret
outlinedButtonTheme: OutlinedButtonThemeData(
style: OutlinedButton.styleFrom(
foregroundColor: AppColors.onSurface,
side: const BorderSide(color: AppColors.outlineVariant, width: 1),
padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 14),
padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 15),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(radiusMd),
),
textStyle: _instrumentSans(
fontSize: 14,
fontWeight: FontWeight.w600,
letterSpacing: 0.05,
textStyle: _body(
fontSize: 13,
fontWeight: FontWeight.w700,
letterSpacing: 1.1,
),
),
),
// Text buttons
textButtonTheme: TextButtonThemeData(
style: TextButton.styleFrom(
foregroundColor: AppColors.primary,
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 10),
textStyle: _instrumentSans(
fontSize: 14,
fontWeight: FontWeight.w600,
padding: const EdgeInsets.symmetric(horizontal: 14, vertical: 10),
textStyle: _body(
fontSize: 13,
fontWeight: FontWeight.w700,
letterSpacing: 0.8,
),
),
),
// Cards: Glass style
iconButtonTheme: IconButtonThemeData(
style: IconButton.styleFrom(
foregroundColor: AppColors.onSurfaceVariant,
hoverColor: AppColors.primaryContainer.withValues(alpha: 0.14),
highlightColor: AppColors.primaryContainer.withValues(alpha: 0.2),
),
),
// Cartes : surface opaque + ombre profonde (zéro blur)
cardTheme: CardThemeData(
color: AppColors.glassLevel1Bg,
color: AppColors.surfaceContainerLow,
surfaceTintColor: Colors.transparent,
shadowColor: Colors.black,
elevation: 0,
margin: EdgeInsets.zero,
shape: RoundedRectangleBorder(
@@ -284,115 +393,239 @@ class AppTheme {
),
),
// Dialogs: Floating glass
// Dialogues : bloc opaque flottant
dialogTheme: DialogThemeData(
backgroundColor: AppColors.glassLevel2Bg,
elevation: 24,
backgroundColor: AppColors.surfaceContainer,
surfaceTintColor: Colors.transparent,
elevation: 0,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(radiusXl),
side: const BorderSide(color: AppColors.glassLevel2Border, width: 1),
),
titleTextStyle: _syne(
fontSize: 20,
titleTextStyle: _display(
fontSize: 22,
fontWeight: FontWeight.w600,
letterSpacing: -0.3,
),
contentTextStyle: _instrumentSans(
fontSize: 16,
contentTextStyle: _body(
fontSize: 15,
fontWeight: FontWeight.w400,
height: 1.55,
color: AppColors.onSurfaceVariant,
),
),
// Bottom sheets
bottomSheetTheme: const BottomSheetThemeData(
backgroundColor: AppColors.surfaceContainerLow,
backgroundColor: AppColors.surfaceContainer,
surfaceTintColor: Colors.transparent,
elevation: 0,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.vertical(top: Radius.circular(radiusXl)),
),
),
// Snackbars
snackBarTheme: SnackBarThemeData(
backgroundColor: AppColors.surfaceContainerHigh,
contentTextStyle: _instrumentSans(
backgroundColor: AppColors.surfaceContainerHighest,
contentTextStyle: _body(
fontSize: 14,
fontWeight: FontWeight.w500,
color: AppColors.onSurface,
),
actionTextColor: AppColors.primary,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(radiusMd),
),
behavior: SnackBarBehavior.floating,
elevation: 0,
),
// Chips: Pill shaped
// Chips : étiquettes de bobine
chipTheme: ChipThemeData(
backgroundColor: AppColors.primary.withOpacity(0.1),
deleteIconColor: AppColors.onSurface,
disabledColor: AppColors.surfaceContainerHighest,
selectedColor: AppColors.primaryContainer,
secondarySelectedColor: AppColors.primaryContainer,
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
shape: StadiumBorder(
side: BorderSide(color: AppColors.primary.withOpacity(0.3)),
backgroundColor: AppColors.surfaceContainerHigh,
deleteIconColor: AppColors.onSurfaceVariant,
disabledColor: AppColors.surfaceContainer,
selectedColor: AppColors.primaryFill,
secondarySelectedColor: AppColors.primaryFill,
checkmarkColor: AppColors.onSurface,
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
side: const BorderSide(color: AppColors.outlineVariant, width: 1),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(radiusSm),
),
labelStyle: _instrumentSans(
fontSize: 12,
fontWeight: FontWeight.w500,
color: AppColors.onSurface,
),
secondaryLabelStyle: _instrumentSans(
labelStyle: _body(
fontSize: 12,
fontWeight: FontWeight.w600,
color: AppColors.onPrimaryContainer,
letterSpacing: 0.6,
color: AppColors.onSurfaceVariant,
),
secondaryLabelStyle: _body(
fontSize: 12,
fontWeight: FontWeight.w700,
letterSpacing: 0.6,
color: AppColors.onSurface,
),
),
// Tabs
// Onglets : soulignement ember épais
tabBarTheme: TabBarThemeData(
labelColor: AppColors.onSurface,
unselectedLabelColor: AppColors.outline,
unselectedLabelColor: AppColors.textTertiary,
indicatorColor: AppColors.primaryContainer,
labelStyle: _instrumentSans(fontSize: 14, fontWeight: FontWeight.w600),
unselectedLabelStyle: _instrumentSans(fontSize: 14, fontWeight: FontWeight.w500),
indicatorSize: TabBarIndicatorSize.label,
dividerColor: Colors.transparent,
labelStyle: _body(
fontSize: 14,
fontWeight: FontWeight.w700,
letterSpacing: 0.8,
),
unselectedLabelStyle: _body(
fontSize: 14,
fontWeight: FontWeight.w500,
letterSpacing: 0.8,
),
),
navigationRailTheme: NavigationRailThemeData(
backgroundColor: AppColors.surfaceContainerLowest,
indicatorColor: AppColors.primaryContainer.withValues(alpha: 0.22),
selectedIconTheme: const IconThemeData(color: AppColors.primary),
unselectedIconTheme: const IconThemeData(color: AppColors.textTertiary),
selectedLabelTextStyle: eyebrow(color: AppColors.primary),
unselectedLabelTextStyle: eyebrow(color: AppColors.textTertiary),
),
navigationBarTheme: NavigationBarThemeData(
backgroundColor: AppColors.surfaceContainerLowest,
surfaceTintColor: Colors.transparent,
indicatorColor: AppColors.primaryContainer.withValues(alpha: 0.22),
elevation: 0,
labelTextStyle: WidgetStateProperty.resolveWith(
(states) => eyebrow(
color: states.contains(WidgetState.selected)
? AppColors.primary
: AppColors.textTertiary,
),
),
iconTheme: WidgetStateProperty.resolveWith(
(states) => IconThemeData(
color: states.contains(WidgetState.selected)
? AppColors.primary
: AppColors.textTertiary,
size: 24,
),
),
),
// Divider
dividerTheme: const DividerThemeData(
color: AppColors.outlineVariant,
thickness: 1,
space: 1,
),
// Scrollbar
scrollbarTheme: ScrollbarThemeData(
thumbColor: WidgetStateProperty.all(AppColors.outlineVariant),
trackColor: WidgetStateProperty.all(Colors.transparent),
radius: const Radius.circular(4),
thickness: WidgetStateProperty.all(6),
radius: const Radius.circular(2),
thickness: WidgetStateProperty.all(5),
),
progressIndicatorTheme: const ProgressIndicatorThemeData(
color: AppColors.primaryContainer,
linearTrackColor: AppColors.surfaceContainerHigh,
circularTrackColor: Colors.transparent,
),
sliderTheme: SliderThemeData(
activeTrackColor: AppColors.primaryContainer,
inactiveTrackColor: AppColors.surfaceContainerHigh,
thumbColor: AppColors.primary,
overlayColor: AppColors.primaryContainer.withValues(alpha: 0.18),
trackHeight: 4,
),
// Switch
switchTheme: SwitchThemeData(
thumbColor: WidgetStateProperty.resolveWith((states) {
if (states.contains(WidgetState.selected)) {
return AppColors.onPrimary;
}
if (states.contains(WidgetState.selected)) return AppColors.onSurface;
return AppColors.outline;
}),
trackColor: WidgetStateProperty.resolveWith((states) {
if (states.contains(WidgetState.selected)) {
return AppColors.primaryContainer;
}
return AppColors.surfaceContainerHighest;
return AppColors.surfaceContainerHigh;
}),
trackOutlineColor:
WidgetStateProperty.all(AppColors.outlineVariant),
),
checkboxTheme: CheckboxThemeData(
fillColor: WidgetStateProperty.resolveWith((states) {
if (states.contains(WidgetState.selected)) {
return AppColors.primaryContainer;
}
return Colors.transparent;
}),
checkColor: WidgetStateProperty.all(AppColors.onSurface),
side: const BorderSide(color: AppColors.outline, width: 1.5),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(4),
),
),
tooltipTheme: TooltipThemeData(
decoration: BoxDecoration(
color: AppColors.surfaceContainerHighest,
borderRadius: BorderRadius.circular(radiusSm),
border: Border.all(color: AppColors.outlineVariant),
),
textStyle: _body(
fontSize: 12,
fontWeight: FontWeight.w500,
color: AppColors.onSurface,
),
),
listTileTheme: ListTileThemeData(
iconColor: AppColors.onSurfaceVariant,
textColor: AppColors.onSurface,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(radiusMd),
),
),
popupMenuTheme: PopupMenuThemeData(
color: AppColors.surfaceContainerHigh,
surfaceTintColor: Colors.transparent,
elevation: 0,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(radiusMd),
side: const BorderSide(color: AppColors.outlineVariant),
),
textStyle: _body(fontSize: 14, fontWeight: FontWeight.w500),
),
);
}
// Light theme is minimal — Projector Noir is dark-first
static ThemeData get lightTheme => ThemeData.light(useMaterial3: true).copyWith(
colorScheme: AppColors.lightColorScheme,
scaffoldBackgroundColor: AppColors.lightColorScheme.surface,
textTheme: GoogleFonts.instrumentSansTextTheme(ThemeData.light().textTheme),
);
// ============ THÈME CLAIR (« papier kraft ») ============
static ThemeData get lightTheme {
final scheme = AppColors.lightColorScheme;
return ThemeData.light(useMaterial3: true).copyWith(
colorScheme: scheme,
scaffoldBackgroundColor: scheme.surface,
textTheme: GoogleFonts.karlaTextTheme(ThemeData.light().textTheme),
appBarTheme: AppBarTheme(
backgroundColor: Colors.transparent,
surfaceTintColor: Colors.transparent,
foregroundColor: scheme.onSurface,
elevation: 0,
centerTitle: false,
titleTextStyle: GoogleFonts.fraunces(
fontSize: 22,
fontWeight: FontWeight.w600,
letterSpacing: -0.3,
color: scheme.onSurface,
),
),
);
}
}
lib/core/widgets/components/hero_carousel.dart
+4 -3
View File
@@ -107,6 +107,7 @@ class _HeroCarouselState extends State<HeroCarousel> {
CachedNetworkImage(
imageUrl: item.imageUrl,
fit: BoxFit.cover,
memCacheWidth: 1280,
placeholder: (context, url) => Container(color: AppColors.surfaceContainerLow),
errorWidget: (context, url, error) => Container(
color: AppColors.surfaceContainerLow,
@@ -140,7 +141,7 @@ class _HeroCarouselState extends State<HeroCarousel> {
children: [
Text(
item.title,
style: GoogleFonts.syne(
style: GoogleFonts.fraunces(
fontSize: 32,
fontWeight: FontWeight.bold,
color: AppColors.onSurface,
@@ -152,7 +153,7 @@ class _HeroCarouselState extends State<HeroCarousel> {
const SizedBox(height: 8),
Text(
item.subtitle!,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 16,
color: AppColors.onSurface,
),
@@ -245,7 +246,7 @@ class _HeroButtonState extends State<_HeroButton> {
const SizedBox(width: 8),
Text(
widget.label,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
color: AppColors.onSurface,
fontWeight: FontWeight.w600,
),
lib/core/widgets/components/ui_components.dart
+7 -6
View File
@@ -149,7 +149,7 @@ class _GradientButtonState extends State<GradientButton>
],
Text(
widget.label,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
color: AppColors.onSurface,
fontWeight: FontWeight.w600,
fontSize: 14,
@@ -253,7 +253,7 @@ class LiveBadge extends StatelessWidget {
const SizedBox(width: 4),
Text(
'LIVE',
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
color: AppColors.onSurface,
fontSize: 10,
fontWeight: FontWeight.w700,
@@ -302,7 +302,7 @@ class CategoryChip extends StatelessWidget {
),
child: Text(
label,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 13,
fontWeight: isSelected ? FontWeight.w600 : FontWeight.w500,
color: isSelected ? AppColors.primary : AppColors.onSurfaceVariant,
@@ -413,6 +413,7 @@ class _MediaCardState extends State<MediaCard>
CachedNetworkImage(
imageUrl: widget.imageUrl!,
fit: BoxFit.cover,
memCacheWidth: 400,
placeholder: (context, url) => Container(
color: AppColors.surfaceContainerLow,
child: Center(
@@ -458,7 +459,7 @@ class _MediaCardState extends State<MediaCard>
const SizedBox(width: 4),
Text(
widget.rating!,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
color: AppColors.onSurface,
fontSize: 10,
fontWeight: FontWeight.w700,
@@ -502,7 +503,7 @@ class _MediaCardState extends State<MediaCard>
textAlign: TextAlign.center,
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
color: _isHovered
? AppColors.primary
: AppColors.onSurface,
@@ -518,7 +519,7 @@ class _MediaCardState extends State<MediaCard>
textAlign: TextAlign.center,
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
color: AppColors.onSurfaceVariant,
fontSize: 11,
),
lib/core/widgets/digital_clock.dart
+3 -3
View File
@@ -32,13 +32,13 @@ class _DigitalClockState extends State<DigitalClock> {
return Container(
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
decoration: BoxDecoration(
color: Colors.white.withOpacity(0.1),
color: AppColors.onSurface.withOpacity(0.1),
borderRadius: BorderRadius.circular(20),
border: Border.all(color: Colors.white.withOpacity(0.05)),
border: Border.all(color: AppColors.onSurface.withOpacity(0.05)),
),
child: Text(
timeString,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontWeight: FontWeight.w600,
fontSize: 16,
color: AppColors.onSurface,
lib/core/widgets/glass_container.dart
+106 -85
View File
@@ -1,12 +1,19 @@
import 'dart:ui';
import 'package:flutter/material.dart';
import '../theme/app_colors.dart';
/// Glassmorphism container with 3 depth levels (Stitch Design System)
/// Conteneur de surface « Warm Cinema » — 3 niveaux de profondeur.
///
/// Level 0: Pure base background (#0F1014), no blur.
/// Level 1: Translucent layer with backdrop blur 20px, 1px border 10% white.
/// Level 2: High-blur floating container with subtle inner glow in primary accent.
/// Level 0 : socle brut (#0B0908), aucune ombre.
/// Level 1 : plaque opaque légèrement éclaircie, liseré crème 8 %, ombre douce.
/// Level 2 : bloc flottant, liseré ember sur l'arête haute, ombre profonde.
///
/// PERF : cette version n'utilise **aucun** `BackdropFilter`. Le flou de fond
/// forçait Flutter Web à relire le framebuffer à chaque frame pour chaque
/// carte à l'écran (33 sites d'appel ici) — cause principale du jank au
/// scroll. La profondeur est désormais rendue par des surfaces opaques
/// pré-teintées et des ombres, ce qui coûte quasiment rien au GPU.
///
/// L'API publique est inchangée : aucun site d'appel n'a besoin d'être modifié.
enum GlassLevel { level0, level1, level2 }
class GlassContainer extends StatelessWidget {
@@ -21,6 +28,14 @@ class GlassContainer extends StatelessWidget {
final bool border;
final List<BoxShadow>? boxShadow;
/// Alias de [border] (nom utilisé par les widgets de navigation TV).
/// Prioritaire sur [border] lorsqu'il est fourni.
final bool? hasBorder;
/// Passer `false` supprime toute ombre portée — utile pour les barres
/// collées à un bord, où l'ombre créerait une couture visible.
final bool showShadow;
const GlassContainer({
super.key,
required this.child,
@@ -28,14 +43,18 @@ class GlassContainer extends StatelessWidget {
this.height,
this.padding = const EdgeInsets.all(16),
this.margin,
this.borderRadius = 16.0,
this.borderRadius = 14.0,
this.level = GlassLevel.level1,
this.borderColor,
this.border = true,
this.boxShadow,
this.hasBorder,
this.showShadow = true,
});
/// Convenience constructor for Level 0 (pure base)
bool get _showBorder => hasBorder ?? border;
/// Niveau 0 — socle brut.
const GlassContainer.base({
super.key,
required this.child,
@@ -43,13 +62,15 @@ class GlassContainer extends StatelessWidget {
this.height,
this.padding = const EdgeInsets.all(16),
this.margin,
this.borderRadius = 16.0,
this.borderRadius = 14.0,
this.borderColor,
this.border = false,
this.boxShadow,
this.hasBorder,
this.showShadow = true,
}) : level = GlassLevel.level0;
/// Convenience constructor for Level 1 (standard glass)
/// Niveau 1 — plaque standard.
const GlassContainer.glass({
super.key,
required this.child,
@@ -57,13 +78,15 @@ class GlassContainer extends StatelessWidget {
this.height,
this.padding = const EdgeInsets.all(16),
this.margin,
this.borderRadius = 16.0,
this.borderRadius = 14.0,
this.borderColor,
this.border = true,
this.boxShadow,
this.hasBorder,
this.showShadow = true,
}) : level = GlassLevel.level1;
/// Convenience constructor for Level 2 (floating with inner glow)
/// Niveau 2 — bloc flottant (modales, panneaux, overlays).
const GlassContainer.floating({
super.key,
required this.child,
@@ -71,10 +94,12 @@ class GlassContainer extends StatelessWidget {
this.height,
this.padding = const EdgeInsets.all(16),
this.margin,
this.borderRadius = 24.0,
this.borderRadius = 20.0,
this.borderColor,
this.border = true,
this.boxShadow,
this.hasBorder,
this.showShadow = true,
}) : level = GlassLevel.level2;
@override
@@ -98,12 +123,13 @@ class GlassContainer extends StatelessWidget {
decoration: BoxDecoration(
color: AppColors.baseLevel0,
borderRadius: BorderRadius.circular(borderRadius),
border: border
border: _showBorder
? Border.all(
color: borderColor ?? Colors.transparent,
width: 1,
)
: null,
boxShadow: showShadow ? boxShadow : null,
),
child: child,
);
@@ -114,34 +140,29 @@ class GlassContainer extends StatelessWidget {
width: width,
height: height,
margin: margin,
child: ClipRRect(
padding: padding,
decoration: BoxDecoration(
color: AppColors.glassLevel1Bg,
borderRadius: BorderRadius.circular(borderRadius),
child: BackdropFilter(
filter: ImageFilter.blur(sigmaX: 20, sigmaY: 20),
child: Container(
padding: padding,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(borderRadius),
color: AppColors.glassLevel1Bg,
border: border
? Border.all(
color: borderColor ?? AppColors.glassLevel1Border,
width: 1,
)
: null,
boxShadow: boxShadow ??
[
BoxShadow(
color: Colors.black.withOpacity(0.2),
blurRadius: 20,
spreadRadius: -5,
),
],
),
child: child,
),
),
border: _showBorder
? Border.all(
color: borderColor ?? AppColors.glassLevel1Border,
width: 1,
)
: null,
boxShadow: !showShadow
? null
: boxShadow ??
const [
BoxShadow(
color: Color(0x59000000), // noir 35 %
blurRadius: 18,
spreadRadius: -6,
offset: Offset(0, 8),
),
],
),
child: child,
);
}
@@ -150,54 +171,54 @@ class GlassContainer extends StatelessWidget {
width: width,
height: height,
margin: margin,
child: ClipRRect(
borderRadius: BorderRadius.circular(borderRadius),
child: BackdropFilter(
filter: ImageFilter.blur(sigmaX: 40, sigmaY: 40),
child: Container(
padding: padding,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(borderRadius),
color: AppColors.glassLevel2Bg,
border: border
? Border(
top: BorderSide(
color: borderColor ?? AppColors.glassLevel2InnerGlow,
width: 1,
),
left: BorderSide(
color: borderColor ?? AppColors.glassLevel2InnerGlow,
width: 1,
),
right: BorderSide(
color: borderColor ?? AppColors.glassLevel2Border,
width: 1,
),
bottom: BorderSide(
color: borderColor ?? AppColors.glassLevel2Border,
width: 1,
),
)
: null,
boxShadow: boxShadow ??
[
BoxShadow(
color: Colors.black.withOpacity(0.5),
blurRadius: 30,
spreadRadius: -10,
offset: const Offset(0, 10),
),
BoxShadow(
color: AppColors.primary.withOpacity(0.1),
blurRadius: 40,
spreadRadius: -10,
),
],
),
child: child,
),
padding: padding,
decoration: BoxDecoration(
// Dégradé très court : arête haute captant la « lumière du projecteur ».
gradient: const LinearGradient(
colors: [Color(0xFF262019), Color(0xFF1F1815)],
stops: [0.0, 0.45],
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
),
borderRadius: BorderRadius.circular(borderRadius),
border: _showBorder
? Border(
top: BorderSide(
color: borderColor ?? AppColors.glassLevel2InnerGlow,
width: 1,
),
left: BorderSide(
color: borderColor ?? AppColors.glassLevel2Border,
width: 1,
),
right: BorderSide(
color: borderColor ?? AppColors.glassLevel2Border,
width: 1,
),
bottom: BorderSide(
color: borderColor ?? AppColors.glassLevel2Border,
width: 1,
),
)
: null,
boxShadow: !showShadow
? null
: boxShadow ??
const [
BoxShadow(
color: Color(0xA6000000), // noir 65 %
blurRadius: 40,
spreadRadius: -12,
offset: Offset(0, 20),
),
BoxShadow(
color: Color(0x1FD9541F), // halo ember 12 %
blurRadius: 48,
spreadRadius: -18,
),
],
),
child: child,
);
}
}
lib/core/widgets/hero_carousel.dart
+6 -5
View File
@@ -179,6 +179,7 @@ class _HeroCarouselState extends State<HeroCarousel>
Image.network(
item.imageUrl!,
fit: BoxFit.cover,
cacheWidth: 1280,
errorBuilder: (context, error, stackTrace) {
return Container(
color: AppColors.surface,
@@ -220,7 +221,7 @@ class _HeroCarouselState extends State<HeroCarousel>
),
child: Text(
item.badge!,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 12,
fontWeight: FontWeight.w700,
color: AppColors.primary,
@@ -233,7 +234,7 @@ class _HeroCarouselState extends State<HeroCarousel>
item.title,
maxLines: 2,
overflow: TextOverflow.ellipsis,
style: GoogleFonts.syne(
style: GoogleFonts.fraunces(
fontSize: 48,
fontWeight: FontWeight.w800,
color: AppColors.textPrimary,
@@ -247,7 +248,7 @@ class _HeroCarouselState extends State<HeroCarousel>
item.subtitle!,
maxLines: 2,
overflow: TextOverflow.ellipsis,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 16,
fontWeight: FontWeight.w400,
color: AppColors.textSecondary,
@@ -292,7 +293,7 @@ class _HeroCarouselState extends State<HeroCarousel>
const SizedBox(width: 8),
Text(
'Play',
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 16,
fontWeight: FontWeight.w700,
color: AppColors.primary,
@@ -330,7 +331,7 @@ class _HeroCarouselState extends State<HeroCarousel>
const SizedBox(width: 8),
Text(
'More Info',
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 16,
fontWeight: FontWeight.w700,
color: AppColors.textPrimary,
lib/core/widgets/themed_loading_screen.dart
+29 -24
View File
@@ -1,44 +1,49 @@
import 'package:flutter/material.dart';
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
import '../theme/app_colors.dart';
/// Stitch-themed loading screen with dark gradient and blue accent.
/// Écran de chargement « Warm Cinema » — salle qui s'éteint avant projection.
class ThemedLoading extends StatelessWidget {
const ThemedLoading({super.key});
@override
Widget build(BuildContext context) {
return Container(
decoration: const BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topLeft,
end: Alignment.bottomRight,
colors: [
AppColors.baseLevel0,
AppColors.background,
],
),
),
return const DecoratedBox(
decoration: BoxDecoration(gradient: AppColors.backgroundGradient),
child: Center(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
const CircularProgressIndicator(
color: AppColors.primaryContainer,
strokeWidth: 3,
),
const SizedBox(height: 16),
Text(
'Loading...',
style: GoogleFonts.instrumentSans(
color: AppColors.onSurfaceVariant,
fontSize: 14,
fontWeight: FontWeight.w500,
SizedBox(
width: 34,
height: 34,
child: CircularProgressIndicator(
color: AppColors.primaryContainer,
strokeWidth: 2,
),
),
SizedBox(height: 20),
_LoadingLabel(),
],
),
),
);
}
}
class _LoadingLabel extends StatelessWidget {
const _LoadingLabel();
@override
Widget build(BuildContext context) {
return Text(
'PROJECTION',
style: GoogleFonts.karla(
color: AppColors.textTertiary,
fontSize: 11,
fontWeight: FontWeight.w700,
letterSpacing: 3.2,
),
);
}
}
lib/features/admin/screens/admin_panel.dart
+7 -7
View File
@@ -152,7 +152,7 @@ class _AdminContentState extends ConsumerState<AdminContent>
const SizedBox(width: 8),
Text(
label,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontWeight: FontWeight.w600,
fontSize: 14,
color: isSelected ? AppColors.textPrimary : AppColors.textSecondary,
@@ -265,7 +265,7 @@ class _PlaylistsTab extends ConsumerWidget {
style: Theme.of(context)
.textTheme
.titleMedium
?.copyWith(color: Colors.white),
?.copyWith(color: AppColors.onSurface),
),
const SizedBox(height: 4),
Text(
@@ -273,7 +273,7 @@ class _PlaylistsTab extends ConsumerWidget {
style: Theme.of(context)
.textTheme
.bodyMedium
?.copyWith(color: Colors.white60),
?.copyWith(color: AppColors.onSurface54),
),
],
),
@@ -282,7 +282,7 @@ class _PlaylistsTab extends ConsumerWidget {
children: [
IconButton(
icon: const Icon(Icons.edit_outlined, size: 20),
color: Colors.white70,
color: AppColors.onSurfaceVariant,
onPressed: () =>
_showPlaylistDialog(context, ref, playlist),
tooltip: 'Edit',
@@ -544,7 +544,7 @@ class _UsersTab extends ConsumerWidget {
style: Theme.of(context)
.textTheme
.titleMedium
?.copyWith(color: Colors.white),
?.copyWith(color: AppColors.onSurface),
),
if (user.isAdmin) ...[
const SizedBox(width: 8),
@@ -576,7 +576,7 @@ class _UsersTab extends ConsumerWidget {
style: Theme.of(context)
.textTheme
.bodyMedium
?.copyWith(color: Colors.white60),
?.copyWith(color: AppColors.onSurface54),
),
],
),
@@ -584,7 +584,7 @@ class _UsersTab extends ConsumerWidget {
PopupMenuButton<String>(
icon: const Icon(
Icons.more_vert,
color: Colors.white70,
color: AppColors.onSurfaceVariant,
),
color: AppColors.surface,
shape: RoundedRectangleBorder(
lib/features/auth/screens/login_screen.dart
+6 -6
View File
@@ -144,7 +144,7 @@ class _LoginScreenState extends ConsumerState<LoginScreen> {
// Title
Text(
'XtremFlow',
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 42,
fontWeight: FontWeight.w700,
color: AppColors.textPrimary,
@@ -154,7 +154,7 @@ class _LoginScreenState extends ConsumerState<LoginScreen> {
const SizedBox(height: 8),
Text(
'Sign in to sync your playlists',
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 18,
color: AppColors.textSecondary,
fontWeight: FontWeight.w400,
@@ -266,7 +266,7 @@ class _LoginScreenState extends ConsumerState<LoginScreen> {
)
: Text(
'Sign In',
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
color: AppColors.primary,
fontSize: 18,
fontWeight: FontWeight.w600,
@@ -282,7 +282,7 @@ class _LoginScreenState extends ConsumerState<LoginScreen> {
const SizedBox(height: 32),
Text(
'Default: admin / admin',
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 14,
color: AppColors.textTertiary,
),
@@ -310,13 +310,13 @@ class _LoginScreenState extends ConsumerState<LoginScreen> {
return TextFormField(
controller: controller,
obscureText: obscureText,
style: GoogleFonts.instrumentSans(fontSize: 18, color: AppColors.textPrimary),
style: GoogleFonts.karla(fontSize: 18, color: AppColors.textPrimary),
autofocus: autofocus,
textInputAction: nextFocus ? TextInputAction.next : TextInputAction.done,
onFieldSubmitted: isLast ? (_) => onSubmitted?.call() : null,
decoration: InputDecoration(
labelText: label,
labelStyle: GoogleFonts.instrumentSans(color: AppColors.textSecondary),
labelStyle: GoogleFonts.karla(color: AppColors.textSecondary),
prefixIcon: Icon(icon, color: AppColors.textSecondary),
suffixIcon: suffix,
filled: true,
lib/features/iptv/screens/player_screen.dart
+31 -31
View File
@@ -535,7 +535,7 @@ class _PlayerScreenState extends ConsumerState<PlayerScreen> {
'Unknown')
.toString()
: widget.title,
style: GoogleFonts.syne(
style: GoogleFonts.fraunces(
color: AppColors.textPrimary,
fontSize: 18,
fontWeight: FontWeight.w600,
@@ -544,7 +544,7 @@ class _PlayerScreenState extends ConsumerState<PlayerScreen> {
),
Text(
'Live TV',
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
color: AppColors.primary,
fontSize: 12,
fontWeight: FontWeight.bold,
@@ -601,7 +601,7 @@ class _PlayerScreenState extends ConsumerState<PlayerScreen> {
_buildInlineEpg(),
const SizedBox(height: 12),
const Divider(
color: Colors.white10,
color: AppColors.onSurface06,
),
const SizedBox(height: 8),
// Control Buttons
@@ -706,10 +706,10 @@ class _PlayerScreenState extends ConsumerState<PlayerScreen> {
Expanded(
child: Text(
widget.title,
style: GoogleFonts.syne(
style: GoogleFonts.fraunces(
fontSize: 20,
fontWeight: FontWeight.w600,
color: Colors.white,
color: AppColors.onSurface,
),
),
),
@@ -733,7 +733,7 @@ class _PlayerScreenState extends ConsumerState<PlayerScreen> {
right: 40,
child: GlassContainer.glass(
borderRadius: 24,
borderColor: Colors.white.withOpacity(0.1),
borderColor: AppColors.onSurface.withOpacity(0.1),
padding: const EdgeInsets.all(24),
child: Column(
mainAxisSize: MainAxisSize.min,
@@ -747,8 +747,8 @@ class _PlayerScreenState extends ConsumerState<PlayerScreen> {
seconds: _currentPosition.toInt(),
),
),
style: GoogleFonts.instrumentSans(
color: Colors.white70,
style: GoogleFonts.karla(
color: AppColors.onSurfaceVariant,
),
),
const SizedBox(width: 16),
@@ -758,8 +758,8 @@ class _PlayerScreenState extends ConsumerState<PlayerScreen> {
trackHeight: 4,
activeTrackColor: AppColors.primary,
inactiveTrackColor:
Colors.white.withOpacity(0.2),
thumbColor: Colors.white,
AppColors.onSurface.withOpacity(0.2),
thumbColor: AppColors.onSurface,
thumbShape: const RoundSliderThumbShape(
enabledThumbRadius: 8,
),
@@ -799,8 +799,8 @@ class _PlayerScreenState extends ConsumerState<PlayerScreen> {
seconds: _totalDuration.toInt(),
),
),
style: GoogleFonts.instrumentSans(
color: Colors.white70,
style: GoogleFonts.karla(
color: AppColors.onSurfaceVariant,
),
),
],
@@ -892,7 +892,7 @@ class _PlayerScreenState extends ConsumerState<PlayerScreen> {
}) {
// Button with direct Material/InkWell - PointerInterceptor is on outer container
final button = Material(
color: transparent ? Colors.transparent : Colors.white.withOpacity(0.1),
color: transparent ? Colors.transparent : AppColors.onSurface.withOpacity(0.1),
shape: const CircleBorder(),
child: InkWell(
onTap: onTap,
@@ -905,9 +905,9 @@ class _PlayerScreenState extends ConsumerState<PlayerScreen> {
shape: BoxShape.circle,
border: transparent
? null
: Border.all(color: Colors.white.withOpacity(0.1)),
: Border.all(color: AppColors.onSurface.withOpacity(0.1)),
),
child: Icon(icon, color: Colors.white, size: iconSize),
child: Icon(icon, color: AppColors.onSurface, size: iconSize),
),
),
);
@@ -987,7 +987,7 @@ class _PlayerScreenState extends ConsumerState<PlayerScreen> {
final button = Material(
color: highlighted
? AppColors.primary.withOpacity(0.2)
: Colors.white.withOpacity(0.1),
: AppColors.onSurface.withOpacity(0.1),
shape: const CircleBorder(),
child: InkWell(
onTap: onTap,
@@ -1003,13 +1003,13 @@ class _PlayerScreenState extends ConsumerState<PlayerScreen> {
border: Border.all(
color: highlighted
? AppColors.primary.withOpacity(0.5)
: Colors.white.withOpacity(0.2),
: AppColors.onSurface.withOpacity(0.2),
width: highlighted ? 2 : 1,
),
),
child: Icon(
icon,
color: highlighted ? AppColors.primary : Colors.white,
color: highlighted ? AppColors.primary : AppColors.onSurface,
size: iconSize,
),
),
@@ -1048,7 +1048,7 @@ class _PlayerScreenState extends ConsumerState<PlayerScreen> {
child: const Text(
'LIVE',
style: TextStyle(
color: Colors.white,
color: AppColors.onSurface,
fontSize: 11,
fontWeight: FontWeight.bold,
),
@@ -1060,8 +1060,8 @@ class _PlayerScreenState extends ConsumerState<PlayerScreen> {
widget.channels != null
? widget.channels![_currentIndex].name
: widget.title,
style: GoogleFonts.syne(
color: Colors.white,
style: GoogleFonts.fraunces(
color: AppColors.onSurface,
fontSize: 16,
fontWeight: FontWeight.w600,
),
@@ -1096,7 +1096,7 @@ class _PlayerScreenState extends ConsumerState<PlayerScreen> {
child: const Text(
'LIVE',
style: TextStyle(
color: Colors.white,
color: AppColors.onSurface,
fontSize: 11,
fontWeight: FontWeight.bold,
),
@@ -1110,8 +1110,8 @@ class _PlayerScreenState extends ConsumerState<PlayerScreen> {
children: [
Text(
currentProgram.title,
style: GoogleFonts.syne(
color: Colors.white,
style: GoogleFonts.fraunces(
color: AppColors.onSurface,
fontSize: 15,
fontWeight: FontWeight.w600,
),
@@ -1121,8 +1121,8 @@ class _PlayerScreenState extends ConsumerState<PlayerScreen> {
if (currentProgram.description.isNotEmpty)
Text(
currentProgram.description,
style: GoogleFonts.instrumentSans(
color: Colors.white60,
style: GoogleFonts.karla(
color: AppColors.onSurface54,
fontSize: 12,
),
maxLines: 1,
@@ -1145,7 +1145,7 @@ class _PlayerScreenState extends ConsumerState<PlayerScreen> {
child: const Text(
'LIVE',
style: TextStyle(
color: Colors.white,
color: AppColors.onSurface,
fontSize: 11,
fontWeight: FontWeight.bold,
),
@@ -1156,8 +1156,8 @@ class _PlayerScreenState extends ConsumerState<PlayerScreen> {
widget.channels != null
? widget.channels![_currentIndex].name
: widget.title,
style: GoogleFonts.syne(
color: Colors.white,
style: GoogleFonts.fraunces(
color: AppColors.onSurface,
fontSize: 16,
fontWeight: FontWeight.w600,
),
@@ -1168,8 +1168,8 @@ class _PlayerScreenState extends ConsumerState<PlayerScreen> {
widget.channels != null
? widget.channels![_currentIndex].name
: widget.title,
style: GoogleFonts.syne(
color: Colors.white,
style: GoogleFonts.fraunces(
color: AppColors.onSurface,
fontSize: 16,
fontWeight: FontWeight.w600,
),
lib/features/iptv/screens/playlist_selection_screen.dart
+18 -18
View File
@@ -27,7 +27,7 @@ class PlaylistSelectionScreen extends ConsumerWidget {
appBar: AppBar(
title: Text(
'Select Playlist',
style: GoogleFonts.roboto(
style: GoogleFonts.karla(
fontWeight: FontWeight.w600,
color: AppColors.textPrimary,
),
@@ -97,7 +97,7 @@ class PlaylistSelectionScreen extends ConsumerWidget {
const SizedBox(height: 16),
Text(
'Error loading playlists',
style: GoogleFonts.syne(
style: GoogleFonts.fraunces(
fontSize: 18,
color: AppColors.textSecondary,
),
@@ -109,7 +109,7 @@ class PlaylistSelectionScreen extends ConsumerWidget {
backgroundColor: AppColors.primary,
foregroundColor: AppColors.textPrimary,
),
child: Text('Retry', style: GoogleFonts.instrumentSans()),
child: Text('Retry', style: GoogleFonts.karla()),
),
],
),
@@ -123,14 +123,14 @@ class PlaylistSelectionScreen extends ConsumerWidget {
const Icon(
Icons.playlist_remove,
size: 64,
color: Colors.white24,
color: AppColors.onSurface24,
),
const SizedBox(height: 16),
Text(
'No playlists available',
style: GoogleFonts.syne(
style: GoogleFonts.fraunces(
fontSize: 18,
color: Colors.white60,
color: AppColors.onSurface54,
),
),
const SizedBox(height: 8),
@@ -138,9 +138,9 @@ class PlaylistSelectionScreen extends ConsumerWidget {
currentUser?.isAdmin ?? false
? 'Add playlists in Admin Panel'
: 'Contact administrator',
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 14,
color: Colors.white38,
color: AppColors.onSurface38,
),
),
],
@@ -209,13 +209,13 @@ class _PlaylistCardState extends State<_PlaylistCard> {
duration: const Duration(milliseconds: 200),
decoration: BoxDecoration(
color: _isHovered
? Colors.white.withOpacity(0.1)
: Colors.white.withOpacity(0.03),
? AppColors.onSurface.withOpacity(0.1)
: AppColors.onSurface.withOpacity(0.03),
borderRadius: BorderRadius.circular(24),
border: Border.all(
color: _isHovered
? AppColors.primary.withOpacity(0.5)
: Colors.white.withOpacity(0.08),
: AppColors.onSurface.withOpacity(0.08),
width: 1.5,
),
boxShadow: _isHovered
@@ -245,8 +245,8 @@ class _PlaylistCardState extends State<_PlaylistCard> {
begin: Alignment.topLeft,
end: Alignment.bottomRight,
colors: [
Colors.white.withOpacity(0.1),
Colors.white.withOpacity(0.05),
AppColors.onSurface.withOpacity(0.1),
AppColors.onSurface.withOpacity(0.05),
],
),
shape: BoxShape.circle,
@@ -263,16 +263,16 @@ class _PlaylistCardState extends State<_PlaylistCard> {
child: Icon(
Icons.playlist_play_rounded,
size: 32,
color: _isHovered ? Colors.white : Colors.white70,
color: _isHovered ? AppColors.onSurface : AppColors.onSurfaceVariant,
),
),
const SizedBox(height: 20),
Text(
widget.playlist.name,
style: GoogleFonts.syne(
style: GoogleFonts.fraunces(
fontSize: 22,
fontWeight: FontWeight.bold,
color: Colors.white,
color: AppColors.onSurface,
height: 1.2,
),
maxLines: 2,
@@ -281,9 +281,9 @@ class _PlaylistCardState extends State<_PlaylistCard> {
const SizedBox(height: 8),
Text(
Uri.tryParse(widget.playlist.dns)?.host ?? widget.playlist.dns,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 13,
color: Colors.white38,
color: AppColors.onSurface38,
letterSpacing: 0.5,
),
maxLines: 1,
lib/features/iptv/screens/series_detail_screen.dart
+11 -10
View File
@@ -130,6 +130,7 @@ class _SeriesDetailScreenState extends ConsumerState<SeriesDetailScreen> {
width: 248,
height: 350,
fit: BoxFit.cover,
memCacheWidth: 500,
errorWidget: (_, __, ___) => Container(
width: 248,
height: 350,
@@ -143,7 +144,7 @@ class _SeriesDetailScreenState extends ConsumerState<SeriesDetailScreen> {
// Title
Text(
_seriesInfo!.name,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 18,
fontWeight: FontWeight.bold,
color: AppColors.onSurface,
@@ -159,7 +160,7 @@ class _SeriesDetailScreenState extends ConsumerState<SeriesDetailScreen> {
const SizedBox(width: 4),
Text(
_formatRating(_seriesInfo!.rating!)!,
style: GoogleFonts.roboto(fontSize: 13, color: AppColors.onSurfaceVariant),
style: GoogleFonts.karla(fontSize: 13, color: AppColors.onSurfaceVariant),
),
],
),
@@ -169,7 +170,7 @@ class _SeriesDetailScreenState extends ConsumerState<SeriesDetailScreen> {
if (_seriesInfo!.plot != null && _seriesInfo!.plot!.isNotEmpty)
Text(
_seriesInfo!.plot!,
style: GoogleFonts.roboto(fontSize: 12, color: AppColors.onSurfaceVariant),
style: GoogleFonts.karla(fontSize: 12, color: AppColors.onSurfaceVariant),
maxLines: 5,
overflow: TextOverflow.ellipsis,
),
@@ -178,7 +179,7 @@ class _SeriesDetailScreenState extends ConsumerState<SeriesDetailScreen> {
// Season selector
Text(
'Seasons',
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 14,
fontWeight: FontWeight.w600,
color: AppColors.onSurface,
@@ -200,7 +201,7 @@ class _SeriesDetailScreenState extends ConsumerState<SeriesDetailScreen> {
},
selectedColor: AppColors.primaryContainer,
backgroundColor: AppColors.surfaceContainer,
labelStyle: GoogleFonts.instrumentSans(
labelStyle: GoogleFonts.karla(
color: isSelected ? AppColors.onPrimary : AppColors.onSurfaceVariant,
fontSize: 12,
),
@@ -224,7 +225,7 @@ class _SeriesDetailScreenState extends ConsumerState<SeriesDetailScreen> {
padding: const EdgeInsets.all(16),
child: Text(
'Season $_selectedSeason - ${currentEpisodes.length} Episodes',
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 16,
fontWeight: FontWeight.w600,
color: AppColors.onSurface,
@@ -236,7 +237,7 @@ class _SeriesDetailScreenState extends ConsumerState<SeriesDetailScreen> {
? Center(
child: Text(
'No episodes found',
style: GoogleFonts.roboto(color: AppColors.onSurfaceVariant),
style: GoogleFonts.karla(color: AppColors.onSurfaceVariant),
),
)
: ListView.builder(
@@ -323,7 +324,7 @@ class _SeriesDetailScreenState extends ConsumerState<SeriesDetailScreen> {
? const Icon(Icons.check, color: AppColors.onSurface, size: 20)
: Text(
'${episode.episodeNum}',
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 16,
fontWeight: FontWeight.bold,
color: AppColors.onSurface,
@@ -340,7 +341,7 @@ class _SeriesDetailScreenState extends ConsumerState<SeriesDetailScreen> {
children: [
Text(
episode.title,
style: GoogleFonts.roboto(
style: GoogleFonts.karla(
fontSize: 14,
fontWeight: FontWeight.w500,
color: isWatched ? AppColors.onSurfaceVariant : AppColors.onSurface,
@@ -351,7 +352,7 @@ class _SeriesDetailScreenState extends ConsumerState<SeriesDetailScreen> {
if (episode.durationSecs != null && episode.durationSecs! > 0)
Text(
_formatDuration(episode.durationSecs!),
style: GoogleFonts.roboto(
style: GoogleFonts.karla(
fontSize: 12,
color: AppColors.onSurfaceVariant,
),
lib/features/iptv/widgets/category_carousel.dart
+2 -2
View File
@@ -123,8 +123,8 @@ class CategoryCarousel<T> extends StatelessWidget {
end: Alignment.centerRight,
colors: [
Colors.transparent,
Colors.white,
Colors.white,
AppColors.onSurface,
AppColors.onSurface,
Colors.transparent,
],
stops: [0.0, 0.02, 0.98, 1.0],
lib/features/iptv/widgets/epg_overlay.dart
+1 -1
View File
@@ -52,7 +52,7 @@ class EpgOverlay extends ConsumerWidget {
color: AppColors.surfaceContainerLow
.withOpacity(0.85), // Match Native player controls
borderRadius: BorderRadius.circular(24),
border: Border.all(color: Colors.white.withOpacity(0.1)),
border: Border.all(color: AppColors.onSurface.withOpacity(0.1)),
),
child: Row(
mainAxisSize: MainAxisSize.min,
lib/features/iptv/widgets/epg_widget.dart
+3 -3
View File
@@ -99,7 +99,7 @@ class _EPGWidgetState extends ConsumerState<EPGWidget> {
),
child: Text(
'LIVE',
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 9,
fontWeight: FontWeight.bold,
color: AppColors.onSurface,
@@ -110,7 +110,7 @@ class _EPGWidgetState extends ConsumerState<EPGWidget> {
Expanded(
child: Text(
_epg!.nowPlaying!,
style: GoogleFonts.roboto(
style: GoogleFonts.karla(
fontSize: 11,
fontWeight: FontWeight.w600,
color: AppColors.onSurface,
@@ -151,7 +151,7 @@ class _EPGWidgetState extends ConsumerState<EPGWidget> {
Expanded(
child: Text(
'Next: ${_epg!.nextPlaying}',
style: GoogleFonts.roboto(
style: GoogleFonts.karla(
fontSize: 10,
color: AppColors.outline,
),
lib/features/iptv/widgets/live_tv_tab.dart
+34 -32
View File
@@ -63,7 +63,7 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
body: channelsAsync.when(
loading: () => const ThemedLoading(),
error: (e, s) => Center(
child: Text('Error: $e', style: const TextStyle(color: Colors.white)),
child: Text('Error: $e', style: const TextStyle(color: AppColors.onSurface)),
),
data: (groupedChannels) {
var categories = groupedChannels.keys.toList();
@@ -118,12 +118,12 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
child: Container(
padding: const EdgeInsets.all(8),
decoration: BoxDecoration(
color: Colors.white.withOpacity(0.1),
color: AppColors.onSurface.withOpacity(0.1),
shape: BoxShape.circle,
),
child: const Icon(
Icons.arrow_back,
color: Colors.white,
color: AppColors.onSurface,
),
),
),
@@ -137,10 +137,10 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
: _showFavoritesOnly
? 'Favorites'
: _selectedCategory ?? 'Live TV',
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 24,
fontWeight: FontWeight.w700,
color: Colors.white,
color: AppColors.onSurface,
),
maxLines: 1,
overflow: TextOverflow.ellipsis,
@@ -152,17 +152,17 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
width: 250,
height: 44,
decoration: BoxDecoration(
color: Colors.white.withOpacity(0.1),
color: AppColors.onSurface.withOpacity(0.1),
borderRadius: BorderRadius.circular(12),
),
child: TextField(
controller: _searchController,
style: GoogleFonts.instrumentSans(color: Colors.white),
style: GoogleFonts.karla(color: AppColors.onSurface),
decoration: InputDecoration(
hintText: 'Search channels...',
hintStyle: GoogleFonts.instrumentSans(color: Colors.white54),
hintStyle: GoogleFonts.karla(color: AppColors.onSurface54),
prefixIcon:
const Icon(Icons.search, color: Colors.white54),
const Icon(Icons.search, color: AppColors.onSurface54),
border: InputBorder.none,
contentPadding: const EdgeInsets.symmetric(
horizontal: 16,
@@ -172,7 +172,7 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
? IconButton(
icon: const Icon(
Icons.clear,
color: Colors.white,
color: AppColors.onSurface,
),
onPressed: _searchController.clear,
)
@@ -197,7 +197,7 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
decoration: BoxDecoration(
color: _showFavoritesOnly
? AppColors.live.withOpacity(0.2)
: Colors.white.withOpacity(0.1),
: AppColors.onSurface.withOpacity(0.1),
borderRadius: BorderRadius.circular(12),
border: _showFavoritesOnly
? Border.all(color: AppColors.live)
@@ -209,7 +209,7 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
: Icons.favorite_border,
color: _showFavoritesOnly
? AppColors.live
: Colors.white,
: AppColors.onSurface,
),
),
),
@@ -230,13 +230,13 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
Icon(
Icons.tv_off,
size: 64,
color: Colors.white.withOpacity(0.3),
color: AppColors.onSurface.withOpacity(0.3),
),
const SizedBox(height: 16),
Text(
'No channels found',
style: GoogleFonts.instrumentSans(
color: Colors.white54,
style: GoogleFonts.karla(
color: AppColors.onSurface54,
fontSize: 18,
),
),
@@ -310,7 +310,7 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
children: [
Icon(
Icons.folder_copy_outlined,
color: Colors.white.withOpacity(0.9),
color: AppColors.onSurface.withOpacity(0.9),
size: 32,
),
const SizedBox(height: 12),
@@ -319,10 +319,10 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
child: Text(
category,
textAlign: TextAlign.center,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 16,
fontWeight: FontWeight.w600,
color: Colors.white,
color: AppColors.onSurface,
),
maxLines: 2,
overflow: TextOverflow.ellipsis,
@@ -331,9 +331,9 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
const SizedBox(height: 4),
Text(
'$count Channels',
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 13,
color: Colors.white54,
color: AppColors.onSurface54,
),
),
],
@@ -386,7 +386,7 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
Expanded(
child: Container(
decoration: BoxDecoration(
color: Colors.white.withOpacity(
color: AppColors.onSurface.withOpacity(
0.05,
), // Subtle transparent background
borderRadius: const BorderRadius.vertical(
@@ -398,18 +398,20 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
child: channel.streamIcon.isNotEmpty
? Image.network(
_getProxiedIconUrl(channel.streamIcon)!,
cacheWidth: 160,
filterQuality: FilterQuality.low,
errorBuilder: (_, __, ___) => Icon(
Icons.tv,
color: Colors.white.withOpacity(0.3),
color: AppColors.onSurface.withOpacity(0.3),
size: 40,
),
)
: Text(
channel.name.characters.first.toUpperCase(),
style: GoogleFonts.syne(
style: GoogleFonts.fraunces(
fontSize: 40,
fontWeight: FontWeight.bold,
color: Colors.white24,
color: AppColors.onSurface24,
),
),
),
@@ -427,8 +429,8 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
children: [
Text(
channel.name,
style: GoogleFonts.instrumentSans(
color: Colors.white,
style: GoogleFonts.karla(
color: AppColors.onSurface,
fontSize: 13,
fontWeight: FontWeight.w500,
),
@@ -452,8 +454,8 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
if (epgList.isEmpty) {
return Text(
'No Info',
style: GoogleFonts.instrumentSans(
color: Colors.white54,
style: GoogleFonts.karla(
color: AppColors.onSurface54,
fontSize: 10,
),
);
@@ -480,7 +482,7 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
return Text(
currentProgram.title,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
color: AppColors.ratingGold,
fontSize: 10,
fontWeight: FontWeight.w600,
@@ -491,14 +493,14 @@ class _LiveTVTabState extends ConsumerState<LiveTVTab>
},
loading: () => Text(
'...',
style: GoogleFonts.instrumentSans(
color: Colors.white24,
style: GoogleFonts.karla(
color: AppColors.onSurface24,
fontSize: 10,
),
),
error: (_, __) => Text(
'Err',
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
color: Colors.red,
fontSize: 10,
),
lib/features/iptv/widgets/movies_tab.dart
+8 -6
View File
@@ -219,7 +219,7 @@ class _MoviesTabState extends ConsumerState<MoviesTab> {
children: [
Text(
'Movies',
style: GoogleFonts.syne(
style: GoogleFonts.fraunces(
fontSize: 24,
fontWeight: FontWeight.w700,
color: AppColors.onSurface,
@@ -251,14 +251,14 @@ class _MoviesTabState extends ConsumerState<MoviesTab> {
Expanded(
child: TextField(
controller: _searchController,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 14,
color: AppColors.onSurface,
),
decoration: InputDecoration(
hintText: 'Search movies...',
hintStyle:
GoogleFonts.instrumentSans(color: AppColors.outline),
GoogleFonts.karla(color: AppColors.outline),
border: InputBorder.none,
isDense: true,
contentPadding:
@@ -353,6 +353,8 @@ class _MoviesTabState extends ConsumerState<MoviesTab> {
? Image.network(
_getProxiedImageUrl(movie.streamIcon),
fit: BoxFit.cover,
cacheWidth: 400,
filterQuality: FilterQuality.low,
errorBuilder: (ctx, err, stack) => Container(
color: AppColors.surfaceContainerLow,
child: Center(
@@ -426,7 +428,7 @@ class _MoviesTabState extends ConsumerState<MoviesTab> {
const SizedBox(width: 4),
Text(
_formatRating(movie.rating)!,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 10,
fontWeight: FontWeight.bold,
color: AppColors.onSurface,
@@ -448,7 +450,7 @@ class _MoviesTabState extends ConsumerState<MoviesTab> {
children: [
Text(
movie.name,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
color: AppColors.onSurface,
fontSize: 13,
fontWeight: FontWeight.w600,
@@ -467,7 +469,7 @@ class _MoviesTabState extends ConsumerState<MoviesTab> {
padding: const EdgeInsets.only(top: 4),
child: Text(
'WATCHED',
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
color: AppColors.primary,
fontSize: 10,
fontWeight: FontWeight.bold,
lib/features/iptv/widgets/quality_selector_widget.dart
+5 -5
View File
@@ -64,7 +64,7 @@ class QualitySelectorButton extends StatelessWidget {
Text(
q.label,
overflow: TextOverflow.ellipsis,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
color: AppColors.textPrimary,
fontWeight: FontWeight.w600,
fontSize: 14,
@@ -73,7 +73,7 @@ class QualitySelectorButton extends StatelessWidget {
Text(
q.description,
overflow: TextOverflow.ellipsis,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
color: AppColors.textTertiary,
fontSize: 11,
),
@@ -91,13 +91,13 @@ class QualitySelectorButton extends StatelessWidget {
height: size,
alignment: Alignment.center,
decoration: BoxDecoration(
color: Colors.white.withOpacity(0.1),
color: AppColors.onSurface.withOpacity(0.1),
shape: BoxShape.circle,
border: Border.all(color: Colors.white.withOpacity(0.2)),
border: Border.all(color: AppColors.onSurface.withOpacity(0.2)),
),
child: const Icon(
Icons.high_quality_rounded,
color: Colors.white,
color: AppColors.onSurface,
size: 22,
),
),
lib/features/iptv/widgets/recording_modal.dart
+14 -14
View File
@@ -106,7 +106,7 @@ class _RecordingModalState extends State<RecordingModal> {
Expanded(
child: Text(
'Programmer un enregistrement',
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 20,
fontWeight: FontWeight.bold,
color: AppColors.onSurface,
@@ -120,12 +120,12 @@ class _RecordingModalState extends State<RecordingModal> {
// Informations Chaine
Text(
'Chaîne ciblée :',
style: GoogleFonts.instrumentSans(color: AppColors.onSurfaceVariant, fontSize: 14),
style: GoogleFonts.karla(color: AppColors.onSurfaceVariant, fontSize: 14),
),
const SizedBox(height: 8),
Text(
widget.channel.name,
style: GoogleFonts.instrumentSans(color: AppColors.onSurface, fontSize: 18),
style: GoogleFonts.karla(color: AppColors.onSurface, fontSize: 18),
),
const SizedBox(height: 24),
@@ -139,7 +139,7 @@ class _RecordingModalState extends State<RecordingModal> {
children: [
Text(
'Date :',
style: GoogleFonts.instrumentSans(color: AppColors.onSurfaceVariant, fontSize: 14),
style: GoogleFonts.karla(color: AppColors.onSurfaceVariant, fontSize: 14),
),
const SizedBox(height: 8),
TvFocusableCard(
@@ -163,7 +163,7 @@ class _RecordingModalState extends State<RecordingModal> {
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 12),
decoration: BoxDecoration(
color: Colors.white.withOpacity(0.1),
color: AppColors.onSurface.withOpacity(0.1),
borderRadius: BorderRadius.circular(8),
),
child: Row(
@@ -173,7 +173,7 @@ class _RecordingModalState extends State<RecordingModal> {
Expanded(
child: Text(
'${_startTime.day.toString().padLeft(2, '0')}/${_startTime.month.toString().padLeft(2, '0')}/${_startTime.year}',
style: GoogleFonts.instrumentSans(color: AppColors.onSurface),
style: GoogleFonts.karla(color: AppColors.onSurface),
overflow: TextOverflow.ellipsis,
),
),
@@ -193,7 +193,7 @@ class _RecordingModalState extends State<RecordingModal> {
children: [
Text(
'Heure :',
style: GoogleFonts.instrumentSans(color: AppColors.onSurfaceVariant, fontSize: 14),
style: GoogleFonts.karla(color: AppColors.onSurfaceVariant, fontSize: 14),
),
const SizedBox(height: 8),
TvFocusableCard(
@@ -226,7 +226,7 @@ class _RecordingModalState extends State<RecordingModal> {
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 12),
decoration: BoxDecoration(
color: Colors.white.withOpacity(0.1),
color: AppColors.onSurface.withOpacity(0.1),
borderRadius: BorderRadius.circular(8),
),
child: Row(
@@ -236,7 +236,7 @@ class _RecordingModalState extends State<RecordingModal> {
Expanded(
child: Text(
'${_startTime.hour.toString().padLeft(2, '0')}:${_startTime.minute.toString().padLeft(2, '0')}',
style: GoogleFonts.instrumentSans(color: AppColors.onSurface),
style: GoogleFonts.karla(color: AppColors.onSurface),
),
),
],
@@ -255,7 +255,7 @@ class _RecordingModalState extends State<RecordingModal> {
children: [
Text(
'Durée (min) :',
style: GoogleFonts.instrumentSans(color: AppColors.onSurfaceVariant, fontSize: 14),
style: GoogleFonts.karla(color: AppColors.onSurfaceVariant, fontSize: 14),
),
const SizedBox(height: 8),
GlassContainer.glass(
@@ -277,7 +277,7 @@ class _RecordingModalState extends State<RecordingModal> {
child: Text(
'$_durationMinutes',
textAlign: TextAlign.center,
style: GoogleFonts.instrumentSans(color: AppColors.onSurface),
style: GoogleFonts.karla(color: AppColors.onSurface),
),
),
IconButton(
@@ -308,7 +308,7 @@ class _RecordingModalState extends State<RecordingModal> {
onPressed: _isLoading ? null : () => Navigator.of(context).pop(),
child: Text(
'Annuler',
style: GoogleFonts.instrumentSans(color: AppColors.onSurfaceVariant),
style: GoogleFonts.karla(color: AppColors.onSurfaceVariant),
),
),
const SizedBox(width: 16),
@@ -328,7 +328,7 @@ class _RecordingModalState extends State<RecordingModal> {
)
: Text(
'Enregistrer de suite',
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
color: AppColors.onSurface,
fontWeight: FontWeight.bold,
),
@@ -352,7 +352,7 @@ class _RecordingModalState extends State<RecordingModal> {
)
: Text(
'Programmer',
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
color: AppColors.onSurface,
fontWeight: FontWeight.bold,
),
lib/features/iptv/widgets/recordings_tab.dart
+73 -72
View File
@@ -34,14 +34,14 @@ class _RecordingsTabState extends State<RecordingsTab> {
color: Colors.grey[900],
child: const Row(
children: [
Icon(Icons.videocam, color: Colors.white, size: 28),
Icon(Icons.videocam, color: AppColors.onSurface, size: 28),
SizedBox(width: 12),
Text(
'Enregistrements',
style: TextStyle(
fontSize: 26,
fontWeight: FontWeight.bold,
color: Colors.white,
color: AppColors.onSurface,
),
),
],
@@ -183,8 +183,8 @@ class _EpgGuideViewState extends ConsumerState<_EpgGuideView>
children: [
Text(
'GROUPES',
style: GoogleFonts.syne(
color: Colors.white38,
style: GoogleFonts.fraunces(
color: AppColors.onSurface38,
fontSize: 10,
fontWeight: FontWeight.bold,
letterSpacing: 1.2,
@@ -211,16 +211,16 @@ class _EpgGuideViewState extends ConsumerState<_EpgGuideView>
margin: const EdgeInsets.only(bottom: 4),
decoration: BoxDecoration(
color: isSelected
? Colors.white.withOpacity(0.1)
? AppColors.onSurface.withOpacity(0.1)
: Colors.transparent,
borderRadius: BorderRadius.circular(8),
),
child: Text(
cat,
style: GoogleFonts.syne(
style: GoogleFonts.fraunces(
color: isSelected
? Colors.white
: Colors.white60,
? AppColors.onSurface
: AppColors.onSurface54,
fontSize: 12,
fontWeight: isSelected
? FontWeight.bold
@@ -238,7 +238,7 @@ class _EpgGuideViewState extends ConsumerState<_EpgGuideView>
),
),
const VerticalDivider(width: 32, color: Colors.white10),
const VerticalDivider(width: 32, color: AppColors.onSurface06),
// ── Colonne 2 : CHAÎNES ──
SizedBox(
@@ -248,20 +248,20 @@ class _EpgGuideViewState extends ConsumerState<_EpgGuideView>
// Barre de recherche
TextField(
controller: _searchCtrl,
style: const TextStyle(color: Colors.white, fontSize: 13),
style: const TextStyle(color: AppColors.onSurface, fontSize: 13),
decoration: InputDecoration(
hintText: 'Rechercher...',
hintStyle: const TextStyle(
color: Colors.white38,
color: AppColors.onSurface38,
fontSize: 13,
),
prefixIcon: const Icon(
Icons.search,
color: Colors.white38,
color: AppColors.onSurface38,
size: 18,
),
filled: true,
fillColor: Colors.white.withOpacity(0.07),
fillColor: AppColors.onSurface.withOpacity(0.07),
contentPadding: const EdgeInsets.symmetric(vertical: 8),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(10),
@@ -276,7 +276,7 @@ class _EpgGuideViewState extends ConsumerState<_EpgGuideView>
child: Text(
'Aucune chaîne',
style: TextStyle(
color: Colors.white24,
color: AppColors.onSurface24,
fontSize: 12,
),
),
@@ -299,7 +299,7 @@ class _EpgGuideViewState extends ConsumerState<_EpgGuideView>
decoration: BoxDecoration(
color: isSelected
? Colors.redAccent.withOpacity(0.2)
: Colors.white.withOpacity(0.05),
: AppColors.onSurface.withOpacity(0.05),
borderRadius: BorderRadius.circular(8),
border: Border.all(
color: isSelected
@@ -314,27 +314,28 @@ class _EpgGuideViewState extends ConsumerState<_EpgGuideView>
ch.streamIcon,
width: 24,
height: 16,
cacheWidth: 64,
fit: BoxFit.contain,
errorBuilder: (_, __, ___) =>
const Icon(
Icons.tv,
color: Colors.white24,
color: AppColors.onSurface24,
size: 16,
),
)
: const Icon(
Icons.tv,
color: Colors.white24,
color: AppColors.onSurface24,
size: 16,
),
const SizedBox(width: 10),
Expanded(
child: Text(
ch.name,
style: GoogleFonts.syne(
style: GoogleFonts.fraunces(
color: isSelected
? Colors.white
: Colors.white70,
? AppColors.onSurface
: AppColors.onSurfaceVariant,
fontSize: 12,
),
maxLines: 1,
@@ -352,7 +353,7 @@ class _EpgGuideViewState extends ConsumerState<_EpgGuideView>
),
),
const VerticalDivider(width: 32, color: Colors.white10),
const VerticalDivider(width: 32, color: AppColors.onSurface06),
// ── Colonne droite : programmes EPG ──
Expanded(
@@ -370,8 +371,8 @@ class _EpgGuideViewState extends ConsumerState<_EpgGuideView>
Text(
'Sélectionnez une chaîne\npour voir son guide des programmes',
textAlign: TextAlign.center,
style: GoogleFonts.syne(
color: Colors.white38,
style: GoogleFonts.fraunces(
color: AppColors.onSurface38,
fontSize: 15,
),
),
@@ -385,8 +386,8 @@ class _EpgGuideViewState extends ConsumerState<_EpgGuideView>
children: [
Text(
_selectedChannel!.name,
style: GoogleFonts.syne(
color: Colors.white,
style: GoogleFonts.fraunces(
color: AppColors.onSurface,
fontWeight: FontWeight.bold,
fontSize: 16,
),
@@ -395,7 +396,7 @@ class _EpgGuideViewState extends ConsumerState<_EpgGuideView>
IconButton(
icon: const Icon(
Icons.refresh,
color: Colors.white54,
color: AppColors.onSurface54,
size: 18,
),
tooltip: 'Recharger l\'EPG',
@@ -403,7 +404,7 @@ class _EpgGuideViewState extends ConsumerState<_EpgGuideView>
),
],
),
const Divider(color: Colors.white12),
const Divider(color: AppColors.onSurface12),
Expanded(
child: _loadingEpg
? const Center(
@@ -425,8 +426,8 @@ class _EpgGuideViewState extends ConsumerState<_EpgGuideView>
child: Text(
'Aucun programme EPG disponible\npour cette chaîne',
textAlign: TextAlign.center,
style: GoogleFonts.syne(
color: Colors.white38,
style: GoogleFonts.fraunces(
color: AppColors.onSurface38,
),
),
)
@@ -525,7 +526,7 @@ class _ProgrammeCard extends StatelessWidget {
Expanded(
child: Text(
'Enregistrer',
style: GoogleFonts.syne(color: Colors.white),
style: GoogleFonts.fraunces(color: AppColors.onSurface),
),
),
],
@@ -536,8 +537,8 @@ class _ProgrammeCard extends StatelessWidget {
children: [
Text(
title.isEmpty ? channel.name : title,
style: GoogleFonts.syne(
color: Colors.white,
style: GoogleFonts.fraunces(
color: AppColors.onSurface,
fontWeight: FontWeight.bold,
fontSize: 16,
),
@@ -545,7 +546,7 @@ class _ProgrammeCard extends StatelessWidget {
const SizedBox(height: 8),
Text(
'${_fmt(_start)} → ${_fmt(_end)}',
style: const TextStyle(color: Colors.white70),
style: const TextStyle(color: AppColors.onSurfaceVariant),
),
if (_description.isNotEmpty) ...[
const SizedBox(height: 8),
@@ -553,7 +554,7 @@ class _ProgrammeCard extends StatelessWidget {
_description,
maxLines: 3,
overflow: TextOverflow.ellipsis,
style: const TextStyle(color: Colors.white38, fontSize: 12),
style: const TextStyle(color: AppColors.onSurface38, fontSize: 12),
),
],
],
@@ -632,13 +633,13 @@ class _ProgrammeCard extends StatelessWidget {
color: isNow
? Colors.red.withOpacity(0.15)
: isPast
? Colors.white.withOpacity(0.03)
: Colors.white.withOpacity(0.06),
? AppColors.onSurface.withOpacity(0.03)
: AppColors.onSurface.withOpacity(0.06),
borderRadius: BorderRadius.circular(10),
border: Border.all(
color: isNow
? Colors.redAccent.withOpacity(0.4)
: Colors.white.withOpacity(0.07),
: AppColors.onSurface.withOpacity(0.07),
),
),
child: ListTile(
@@ -658,8 +659,8 @@ class _ProgrammeCard extends StatelessWidget {
),
child: Text(
'LIVE',
style: GoogleFonts.syne(
color: Colors.white,
style: GoogleFonts.fraunces(
color: AppColors.onSurface,
fontSize: 8,
fontWeight: FontWeight.bold,
),
@@ -668,8 +669,8 @@ class _ProgrammeCard extends StatelessWidget {
else
Text(
_fmt(_start),
style: GoogleFonts.syne(
color: isPast ? Colors.white24 : Colors.white70,
style: GoogleFonts.fraunces(
color: isPast ? AppColors.onSurface24 : AppColors.onSurfaceVariant,
fontSize: 13,
fontWeight: FontWeight.w600,
),
@@ -678,15 +679,15 @@ class _ProgrammeCard extends StatelessWidget {
Text(
_fmt(_end),
style:
GoogleFonts.syne(color: Colors.white24, fontSize: 10),
GoogleFonts.fraunces(color: AppColors.onSurface24, fontSize: 10),
),
],
),
),
title: Text(
_title.isEmpty ? '—' : _title,
style: GoogleFonts.syne(
color: isPast ? Colors.white38 : Colors.white,
style: GoogleFonts.fraunces(
color: isPast ? AppColors.onSurface38 : AppColors.onSurface,
fontWeight: isNow ? FontWeight.bold : FontWeight.normal,
),
maxLines: 2,
@@ -697,7 +698,7 @@ class _ProgrammeCard extends StatelessWidget {
_description,
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: const TextStyle(color: Colors.white38, fontSize: 11),
style: const TextStyle(color: AppColors.onSurface38, fontSize: 11),
)
: null,
trailing: !isPast
@@ -827,7 +828,7 @@ class _RecordingsListViewState extends State<_RecordingsListView> {
backgroundColor: AppColors.surfaceContainer,
title: Text(
title,
style: GoogleFonts.syne(color: Colors.white, fontSize: 14),
style: GoogleFonts.fraunces(color: AppColors.onSurface, fontSize: 14),
),
content: SizedBox(
width: 500,
@@ -836,7 +837,7 @@ class _RecordingsListViewState extends State<_RecordingsListView> {
child: Text(
content,
style: const TextStyle(
color: Colors.white70,
color: AppColors.onSurfaceVariant,
fontSize: 11,
fontFamily: 'monospace',
),
@@ -895,7 +896,7 @@ class _RecordingsListViewState extends State<_RecordingsListView> {
mainAxisAlignment: MainAxisAlignment.end,
children: [
IconButton(
icon: const Icon(Icons.refresh, color: Colors.white70),
icon: const Icon(Icons.refresh, color: AppColors.onSurfaceVariant),
onPressed: _fetchRecordings,
tooltip: 'Rafraîchir',
),
@@ -924,8 +925,8 @@ class _RecordingsListViewState extends State<_RecordingsListView> {
const SizedBox(height: 16),
Text(
'Aucun enregistrement',
style: GoogleFonts.syne(
color: Colors.white38,
style: GoogleFonts.fraunces(
color: AppColors.onSurface38,
fontSize: 16,
),
),
@@ -942,10 +943,10 @@ class _RecordingsListViewState extends State<_RecordingsListView> {
return Container(
margin: const EdgeInsets.only(bottom: 8),
decoration: BoxDecoration(
color: Colors.white.withOpacity(0.05),
color: AppColors.onSurface.withOpacity(0.05),
borderRadius: BorderRadius.circular(12),
border: Border.all(
color: Colors.white.withOpacity(0.1),
color: AppColors.onSurface.withOpacity(0.1),
),
),
child: ListTile(
@@ -962,8 +963,8 @@ class _RecordingsListViewState extends State<_RecordingsListView> {
),
title: Text(
rec['title'] ?? '—',
style: GoogleFonts.syne(
color: Colors.white,
style: GoogleFonts.fraunces(
color: AppColors.onSurface,
fontWeight: FontWeight.w600,
),
),
@@ -974,7 +975,7 @@ class _RecordingsListViewState extends State<_RecordingsListView> {
Text(
'${_fmtDate(rec['start_time'])} → ${_fmtDate(rec['end_time'])}',
style: const TextStyle(
color: Colors.white54,
color: AppColors.onSurface54,
fontSize: 12,
),
),
@@ -1051,7 +1052,7 @@ class _RecordingsListViewState extends State<_RecordingsListView> {
IconButton(
icon: const Icon(
Icons.delete_outline,
color: Colors.white38,
color: AppColors.onSurface38,
size: 20,
),
tooltip: 'Supprimer',
@@ -1132,7 +1133,7 @@ class _SeasonPassesViewState extends State<_SeasonPassesView> {
const SizedBox(width: 8),
Text(
'Nouveau Season Pass',
style: GoogleFonts.syne(color: Colors.white),
style: GoogleFonts.fraunces(color: AppColors.onSurface),
),
],
),
@@ -1143,7 +1144,7 @@ class _SeasonPassesViewState extends State<_SeasonPassesView> {
children: [
Text(
'Enregistre automatiquement toutes les nouvelles diffusions d\'une émission.',
style: GoogleFonts.syne(color: Colors.white54, fontSize: 13),
style: GoogleFonts.fraunces(color: AppColors.onSurface54, fontSize: 13),
),
const SizedBox(height: 16),
_buildField(
@@ -1206,12 +1207,12 @@ class _SeasonPassesViewState extends State<_SeasonPassesView> {
Widget _buildField(TextEditingController c, String label) {
return TextField(
controller: c,
style: const TextStyle(color: Colors.white),
style: const TextStyle(color: AppColors.onSurface),
decoration: InputDecoration(
labelText: label,
labelStyle: const TextStyle(color: Colors.white54, fontSize: 12),
labelStyle: const TextStyle(color: AppColors.onSurface54, fontSize: 12),
enabledBorder: const UnderlineInputBorder(
borderSide: BorderSide(color: Colors.white24),
borderSide: BorderSide(color: AppColors.onSurface24),
),
focusedBorder: const UnderlineInputBorder(
borderSide: BorderSide(color: Colors.purpleAccent),
@@ -1231,7 +1232,7 @@ class _SeasonPassesViewState extends State<_SeasonPassesView> {
children: [
Text(
'Enregistrements automatiques',
style: GoogleFonts.syne(color: Colors.white54, fontSize: 13),
style: GoogleFonts.fraunces(color: AppColors.onSurface54, fontSize: 13),
),
ElevatedButton.icon(
style: ElevatedButton.styleFrom(
@@ -1262,7 +1263,7 @@ class _SeasonPassesViewState extends State<_SeasonPassesView> {
Expanded(
child: Text(
'Scanne l\'EPG toutes les 4h et programme automatiquement les nouvelles diffusions. Seuls les nouveaux épisodes sont enregistrés.',
style: GoogleFonts.syne(
style: GoogleFonts.fraunces(
color: Colors.purpleAccent.shade100,
fontSize: 12,
),
@@ -1288,16 +1289,16 @@ class _SeasonPassesViewState extends State<_SeasonPassesView> {
const SizedBox(height: 16),
Text(
'Aucun Season Pass actif',
style: GoogleFonts.syne(
color: Colors.white38,
style: GoogleFonts.fraunces(
color: AppColors.onSurface38,
fontSize: 16,
),
),
const SizedBox(height: 8),
Text(
'Créez-en un pour enregistrer automatiquement vos émissions préférées',
style: GoogleFonts.syne(
color: Colors.white24,
style: GoogleFonts.fraunces(
color: AppColors.onSurface24,
fontSize: 12,
),
textAlign: TextAlign.center,
@@ -1325,8 +1326,8 @@ class _SeasonPassesViewState extends State<_SeasonPassesView> {
),
title: Text(
p['show_title'] ?? '—',
style: GoogleFonts.syne(
color: Colors.white,
style: GoogleFonts.fraunces(
color: AppColors.onSurface,
fontWeight: FontWeight.w600,
),
),
@@ -1336,14 +1337,14 @@ class _SeasonPassesViewState extends State<_SeasonPassesView> {
Text(
'Chaîne : ${p['channel_id']}',
style: const TextStyle(
color: Colors.white54,
color: AppColors.onSurface54,
fontSize: 11,
),
),
Text(
'Flux : ${p['stream_url']}',
style: const TextStyle(
color: Colors.white38,
color: AppColors.onSurface38,
fontSize: 10,
),
),
@@ -1352,7 +1353,7 @@ class _SeasonPassesViewState extends State<_SeasonPassesView> {
trailing: IconButton(
icon: const Icon(
Icons.delete_outline,
color: Colors.white38,
color: AppColors.onSurface38,
),
tooltip: 'Supprimer',
onPressed: () =>
lib/features/iptv/widgets/series_tab.dart
+7 -5
View File
@@ -199,7 +199,7 @@ class _SeriesTabState extends ConsumerState<SeriesTab> {
children: [
Text(
'TV Series',
style: GoogleFonts.syne(
style: GoogleFonts.fraunces(
fontSize: 24,
fontWeight: FontWeight.w700,
color: AppColors.onSurface,
@@ -229,14 +229,14 @@ class _SeriesTabState extends ConsumerState<SeriesTab> {
Expanded(
child: TextField(
controller: _searchController,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 14,
color: AppColors.onSurface,
),
decoration: InputDecoration(
hintText: 'Search series...',
hintStyle:
GoogleFonts.instrumentSans(color: AppColors.outline),
GoogleFonts.karla(color: AppColors.outline),
border: InputBorder.none,
isDense: true,
contentPadding:
@@ -344,6 +344,8 @@ class _SeriesTabState extends ConsumerState<SeriesTab> {
? Image.network(
_getProxiedImageUrl(serie.cover),
fit: BoxFit.cover,
cacheWidth: 400,
filterQuality: FilterQuality.low,
errorBuilder: (ctx, err, stack) => Container(
color: AppColors.surfaceContainerLow,
child: Center(
@@ -397,7 +399,7 @@ class _SeriesTabState extends ConsumerState<SeriesTab> {
bottom: 12,
child: Text(
serie.name,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
color: AppColors.onSurface,
fontSize: 13,
fontWeight: FontWeight.w600,
@@ -440,7 +442,7 @@ class _SeriesTabState extends ConsumerState<SeriesTab> {
const SizedBox(width: 4),
Text(
_formatRating(serie.rating)!,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 10,
fontWeight: FontWeight.bold,
color: AppColors.onSurface,
lib/features/iptv/widgets/settings_tab.dart
+18 -18
View File
@@ -155,7 +155,7 @@ class _SettingsTabState extends ConsumerState<SettingsTab>
const SizedBox(width: 12),
Text(
'Thème',
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 18,
fontWeight: FontWeight.w600,
color: AppColors.onSurface,
@@ -212,7 +212,7 @@ class _SettingsTabState extends ConsumerState<SettingsTab>
),
title: Text(
'Mode actuel',
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontWeight: FontWeight.w500,
color: AppColors.onSurface,
),
@@ -279,7 +279,7 @@ class _SettingsTabState extends ConsumerState<SettingsTab>
children: [
Text(
title,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontWeight: FontWeight.w600,
color: isSelected
? colorScheme.primary
@@ -288,7 +288,7 @@ class _SettingsTabState extends ConsumerState<SettingsTab>
),
Text(
subtitle,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 12,
color: colorScheme.onSurfaceVariant,
),
@@ -327,11 +327,11 @@ class _SettingsTabState extends ConsumerState<SettingsTab>
leading: const Icon(Icons.person, color: AppColors.onSurface),
title: Text(
'Connecté en tant que',
style: GoogleFonts.instrumentSans(fontSize: 12, color: AppColors.onSurfaceVariant),
style: GoogleFonts.karla(fontSize: 12, color: AppColors.onSurfaceVariant),
),
subtitle: Text(
currentUser?.username ?? 'Unknown',
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontWeight: FontWeight.w600,
color: AppColors.onSurface,
),
@@ -340,7 +340,7 @@ class _SettingsTabState extends ConsumerState<SettingsTab>
? Chip(
label: Text(
'Admin',
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 11,
color: AppColors.onPrimaryContainer,
),
@@ -355,7 +355,7 @@ class _SettingsTabState extends ConsumerState<SettingsTab>
// Category filters section
Text(
'Filtres de Catégories',
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontWeight: FontWeight.bold,
fontSize: 16,
color: AppColors.onSurface,
@@ -364,7 +364,7 @@ class _SettingsTabState extends ConsumerState<SettingsTab>
const SizedBox(height: 4),
Text(
'Seules les catégories contenant un de ces mots-clés seront affichées. Séparez par des virgules.',
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 12,
color: AppColors.onSurfaceVariant,
),
@@ -430,7 +430,7 @@ class _SettingsTabState extends ConsumerState<SettingsTab>
leading: const Icon(Icons.playlist_play, color: AppColors.onSurface),
title: Text(
'Changer de Playlist',
style: GoogleFonts.instrumentSans(color: AppColors.onSurface),
style: GoogleFonts.karla(color: AppColors.onSurface),
),
trailing: const Icon(Icons.chevron_right, color: AppColors.onSurfaceVariant),
onTap: () => context.go('/playlists'),
@@ -449,11 +449,11 @@ class _SettingsTabState extends ConsumerState<SettingsTab>
leading: const Icon(Icons.info_outline, color: AppColors.onSurface),
title: Text(
'À propos',
style: GoogleFonts.instrumentSans(color: AppColors.onSurface),
style: GoogleFonts.karla(color: AppColors.onSurface),
),
subtitle: Text(
'XtremFlow IPTV v1.0.0',
style: GoogleFonts.instrumentSans(fontSize: 12, color: AppColors.onSurfaceVariant),
style: GoogleFonts.karla(fontSize: 12, color: AppColors.onSurfaceVariant),
),
),
),
@@ -470,11 +470,11 @@ class _SettingsTabState extends ConsumerState<SettingsTab>
leading: const Icon(Icons.cleaning_services, color: AppColors.warning),
title: Text(
'Maintenance',
style: GoogleFonts.instrumentSans(color: AppColors.onSurface),
style: GoogleFonts.karla(color: AppColors.onSurface),
),
subtitle: Text(
'En cas de problèmes d\'affichage ou de mise à jour',
style: GoogleFonts.instrumentSans(fontSize: 12, color: AppColors.onSurfaceVariant),
style: GoogleFonts.karla(fontSize: 12, color: AppColors.onSurfaceVariant),
),
trailing: FilledButton.icon(
onPressed: () {
@@ -573,7 +573,7 @@ class _SettingsTabState extends ConsumerState<SettingsTab>
const SizedBox(width: 8),
Text(
title,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontWeight: FontWeight.w600,
fontSize: 13,
color: AppColors.onSurface,
@@ -587,7 +587,7 @@ class _SettingsTabState extends ConsumerState<SettingsTab>
decoration: InputDecoration(
hintText: 'Ex: FR,FRANCE,HD,SPORT',
hintStyle:
GoogleFonts.instrumentSans(fontSize: 12, color: AppColors.outline),
GoogleFonts.karla(fontSize: 12, color: AppColors.outline),
filled: true,
fillColor: AppColors.surfaceContainerHigh,
border: OutlineInputBorder(
@@ -612,7 +612,7 @@ class _SettingsTabState extends ConsumerState<SettingsTab>
)
: null,
),
style: GoogleFonts.instrumentSans(fontSize: 12, color: AppColors.onSurface),
style: GoogleFonts.karla(fontSize: 12, color: AppColors.onSurface),
onChanged: onChanged,
),
if (keywords.isNotEmpty) ...[
@@ -633,7 +633,7 @@ class _SettingsTabState extends ConsumerState<SettingsTab>
child: Text(
keyword,
style:
GoogleFonts.instrumentSans(fontSize: 11, color: AppColors.onSurface),
GoogleFonts.karla(fontSize: 11, color: AppColors.onSurface),
),
);
}).toList(),
lib/features/iptv/widgets/simple_recording_widget.dart
+9 -9
View File
@@ -132,10 +132,10 @@ class _SimpleRecordingWidgetState extends State<SimpleRecordingWidget> {
// Title
Text(
'🎬 Record "${widget.channel.name}"',
style: GoogleFonts.poppins(
style: GoogleFonts.fraunces(
fontSize: 24,
fontWeight: FontWeight.bold,
color: Colors.white,
color: AppColors.onSurface,
),
),
const SizedBox(height: 24),
@@ -150,9 +150,9 @@ class _SimpleRecordingWidgetState extends State<SimpleRecordingWidget> {
),
child: Text(
_status,
style: GoogleFonts.poppins(
style: GoogleFonts.fraunces(
fontSize: 14,
color: Colors.white70,
color: AppColors.onSurfaceVariant,
),
),
),
@@ -162,10 +162,10 @@ class _SimpleRecordingWidgetState extends State<SimpleRecordingWidget> {
if (!_isRecording) ...[
Text(
'⚡ Quick Record',
style: GoogleFonts.poppins(
style: GoogleFonts.fraunces(
fontSize: 16,
fontWeight: FontWeight.w600,
color: Colors.white,
color: AppColors.onSurface,
),
),
const SizedBox(height: 12),
@@ -202,7 +202,7 @@ class _SimpleRecordingWidgetState extends State<SimpleRecordingWidget> {
label: const Text('STOP RECORDING'),
style: ElevatedButton.styleFrom(
backgroundColor: Colors.red,
foregroundColor: Colors.white,
foregroundColor: AppColors.onSurface,
padding: const EdgeInsets.symmetric(vertical: 16),
),
),
@@ -212,10 +212,10 @@ class _SimpleRecordingWidgetState extends State<SimpleRecordingWidget> {
ExpansionTile(
title: Text(
'🔵 Schedule for Later',
style: GoogleFonts.poppins(
style: GoogleFonts.fraunces(
fontSize: 14,
fontWeight: FontWeight.w600,
color: Colors.white,
color: AppColors.onSurface,
),
),
children: [
lib/features/iptv/widgets/streaming_settings_tab.dart
+19 -19
View File
@@ -19,7 +19,7 @@ class StreamingSettingsTab extends ConsumerWidget {
// Header
Text(
'Paramètres Streaming Live TV',
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 18,
fontWeight: FontWeight.bold,
color: AppColors.onSurface,
@@ -28,7 +28,7 @@ class StreamingSettingsTab extends ConsumerWidget {
const SizedBox(height: 8),
Text(
'Ces paramètres s\'appliquent uniquement aux flux TV en direct.',
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 12,
color: AppColors.onSurfaceVariant,
),
@@ -101,15 +101,15 @@ class StreamingSettingsTab extends ConsumerWidget {
ConnectionTimeout.long => 'Long (60s)',
},
),
Divider(height: 1, color: Colors.white.withOpacity(0.1)),
Divider(height: 1, color: AppColors.onSurface.withOpacity(0.1)),
SwitchListTile(
title: Text(
'Reconnexion automatique',
style: GoogleFonts.instrumentSans(fontSize: 14, color: AppColors.onSurface),
style: GoogleFonts.karla(fontSize: 14, color: AppColors.onSurface),
),
subtitle: Text(
'Se reconnecter en cas de coupure',
style: GoogleFonts.instrumentSans(fontSize: 12, color: AppColors.onSurfaceVariant),
style: GoogleFonts.karla(fontSize: 12, color: AppColors.onSurfaceVariant),
),
value: settings.autoReconnect,
activeThumbColor: AppColors.primaryContainer,
@@ -137,15 +137,15 @@ class StreamingSettingsTab extends ConsumerWidget {
TranscodingMode.disabled => 'Désactivé (direct)',
},
),
Divider(height: 1, color: Colors.white.withOpacity(0.1)),
Divider(height: 1, color: AppColors.onSurface.withOpacity(0.1)),
SwitchListTile(
title: Text(
'Préférer lecture directe',
style: GoogleFonts.instrumentSans(fontSize: 14, color: AppColors.onSurface),
style: GoogleFonts.karla(fontSize: 14, color: AppColors.onSurface),
),
subtitle: Text(
'Utiliser le flux original si compatible',
style: GoogleFonts.instrumentSans(fontSize: 12, color: AppColors.onSurfaceVariant),
style: GoogleFonts.karla(fontSize: 12, color: AppColors.onSurfaceVariant),
),
value: settings.preferDirectPlay,
activeThumbColor: AppColors.primaryContainer,
@@ -186,11 +186,11 @@ class StreamingSettingsTab extends ConsumerWidget {
SwitchListTile(
title: Text(
'Accélération NVIDIA GPU',
style: GoogleFonts.instrumentSans(fontSize: 14, color: AppColors.onSurface),
style: GoogleFonts.karla(fontSize: 14, color: AppColors.onSurface),
),
subtitle: Text(
'Utiliser NVENC/NVDEC pour le transcodage (requiert GPU NVIDIA)',
style: GoogleFonts.instrumentSans(fontSize: 12, color: AppColors.onSurfaceVariant),
style: GoogleFonts.karla(fontSize: 12, color: AppColors.onSurfaceVariant),
),
value: settings.enableNvidiaGpu,
activeThumbColor: Colors.green,
@@ -215,7 +215,7 @@ class StreamingSettingsTab extends ConsumerWidget {
Expanded(
child: Text(
'Les changements prennent effet immédiatement pour les nouveaux flux.',
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 12,
color: AppColors.primary,
),
@@ -236,9 +236,9 @@ class StreamingSettingsTab extends ConsumerWidget {
}) {
return Container(
decoration: BoxDecoration(
color: Colors.white.withOpacity(0.05),
color: AppColors.onSurface.withOpacity(0.05),
borderRadius: BorderRadius.circular(16),
border: Border.all(color: Colors.white.withOpacity(0.1)),
border: Border.all(color: AppColors.onSurface.withOpacity(0.1)),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
@@ -251,7 +251,7 @@ class StreamingSettingsTab extends ConsumerWidget {
const SizedBox(width: 8),
Text(
title,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 16,
fontWeight: FontWeight.w600,
color: AppColors.onSurface,
@@ -260,7 +260,7 @@ class StreamingSettingsTab extends ConsumerWidget {
],
),
),
Divider(height: 1, color: Colors.white.withOpacity(0.1)),
Divider(height: 1, color: AppColors.onSurface.withOpacity(0.1)),
...children,
],
),
@@ -278,11 +278,11 @@ class StreamingSettingsTab extends ConsumerWidget {
return ListTile(
title: Text(
title,
style: GoogleFonts.instrumentSans(fontSize: 14, color: AppColors.onSurface),
style: GoogleFonts.karla(fontSize: 14, color: AppColors.onSurface),
),
subtitle: Text(
subtitle,
style: GoogleFonts.instrumentSans(fontSize: 12, color: AppColors.onSurfaceVariant),
style: GoogleFonts.karla(fontSize: 12, color: AppColors.onSurfaceVariant),
),
trailing: DropdownButton<T>(
value: value,
@@ -293,12 +293,12 @@ class StreamingSettingsTab extends ConsumerWidget {
value: item,
child: Text(
labelBuilder(item),
style: GoogleFonts.instrumentSans(fontSize: 13, color: AppColors.onSurface),
style: GoogleFonts.karla(fontSize: 13, color: AppColors.onSurface),
),
);
}).toList(),
onChanged: onChanged,
style: GoogleFonts.instrumentSans(color: AppColors.onSurface),
style: GoogleFonts.karla(color: AppColors.onSurface),
iconEnabledColor: AppColors.onSurfaceVariant,
),
);
lib/mobile/features/auth/screens/mobile_login_screen.dart
+8 -8
View File
@@ -124,7 +124,7 @@ class _MobileLoginScreenState extends ConsumerState<MobileLoginScreen> {
const SizedBox(height: 24),
Text(
'XtremFlow',
style: GoogleFonts.syne(
style: GoogleFonts.fraunces(
fontSize: 32,
fontWeight: FontWeight.w700,
color: AppColors.onSurface,
@@ -133,7 +133,7 @@ class _MobileLoginScreenState extends ConsumerState<MobileLoginScreen> {
),
Text(
'Mobile Edition',
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 14,
color: AppColors.onSurfaceVariant,
letterSpacing: 0.5,
@@ -173,7 +173,7 @@ class _MobileLoginScreenState extends ConsumerState<MobileLoginScreen> {
),
child: Text(
authState.errorMessage!,
style: GoogleFonts.instrumentSans(color: AppColors.error, fontSize: 13),
style: GoogleFonts.karla(color: AppColors.error, fontSize: 13),
textAlign: TextAlign.center,
),
),
@@ -199,7 +199,7 @@ class _MobileLoginScreenState extends ConsumerState<MobileLoginScreen> {
onPressed: authState.isLoading ? null : _handleLogin,
style: FilledButton.styleFrom(
backgroundColor: Colors.transparent,
foregroundColor: Colors.white,
foregroundColor: AppColors.onSurface,
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
elevation: 0,
).copyWith(
@@ -209,11 +209,11 @@ class _MobileLoginScreenState extends ConsumerState<MobileLoginScreen> {
? const SizedBox(
width: 24,
height: 24,
child: CircularProgressIndicator(strokeWidth: 2, color: Colors.white),
child: CircularProgressIndicator(strokeWidth: 2, color: AppColors.onSurface),
)
: Text(
'Sign In',
style: GoogleFonts.instrumentSans(fontWeight: FontWeight.w600, fontSize: 16, color: Colors.white),
style: GoogleFonts.karla(fontWeight: FontWeight.w600, fontSize: 16, color: AppColors.onSurface),
),
),
),
@@ -243,10 +243,10 @@ class _MobileLoginScreenState extends ConsumerState<MobileLoginScreen> {
return TextFormField(
controller: controller,
obscureText: obscureText,
style: GoogleFonts.instrumentSans(color: AppColors.onSurface),
style: GoogleFonts.karla(color: AppColors.onSurface),
decoration: InputDecoration(
labelText: label,
labelStyle: GoogleFonts.instrumentSans(color: AppColors.onSurfaceVariant),
labelStyle: GoogleFonts.karla(color: AppColors.onSurfaceVariant),
prefixIcon: Icon(icon, color: AppColors.onSurfaceVariant),
suffixIcon: isPassword
? IconButton(
lib/mobile/features/iptv/screens/mobile_playlist_selection_screen.dart
+4 -4
View File
@@ -70,7 +70,7 @@ class MobilePlaylistSelectionScreen extends ConsumerWidget {
color: AppColors.error,
),
const SizedBox(height: 16),
Text('Error loading playlists', style: GoogleFonts.instrumentSans()),
Text('Error loading playlists', style: GoogleFonts.karla()),
TextButton(
onPressed: () => ref.refresh(playlistsProvider),
child: const Text('Retry'),
@@ -92,7 +92,7 @@ class MobilePlaylistSelectionScreen extends ConsumerWidget {
const SizedBox(height: 16),
Text(
'No playlists available',
style: GoogleFonts.instrumentSans(color: AppColors.textSecondary),
style: GoogleFonts.karla(color: AppColors.textSecondary),
),
],
),
@@ -177,7 +177,7 @@ class _MobilePlaylistCard extends StatelessWidget {
children: [
Text(
playlist.name,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 16,
fontWeight: FontWeight.w600,
color: AppColors.textPrimary,
@@ -188,7 +188,7 @@ class _MobilePlaylistCard extends StatelessWidget {
const SizedBox(height: 4),
Text(
Uri.tryParse(playlist.dns)?.host ?? playlist.dns,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 13,
color: AppColors.textSecondary,
),
lib/mobile/features/iptv/screens/mobile_series_detail_screen.dart
+9 -8
View File
@@ -110,7 +110,7 @@ class _MobileSeriesDetailScreenState
const SizedBox(height: 16),
Text(
'Error: $_error',
style: GoogleFonts.instrumentSans(color: AppColors.onSurfaceVariant),
style: GoogleFonts.karla(color: AppColors.onSurfaceVariant),
),
TextButton(
onPressed: _loadSeriesInfo,
@@ -157,6 +157,7 @@ class _MobileSeriesDetailScreenState
CachedNetworkImage(
imageUrl: _seriesInfo!.cover!,
fit: BoxFit.cover,
memCacheWidth: 800,
errorWidget: (_, __, ___) =>
Container(color: AppColors.surfaceContainerLow),
),
@@ -186,7 +187,7 @@ class _MobileSeriesDetailScreenState
children: [
Text(
_seriesInfo!.name,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 24,
fontWeight: FontWeight.bold,
color: AppColors.onSurface,
@@ -204,7 +205,7 @@ class _MobileSeriesDetailScreenState
const SizedBox(width: 4),
Text(
_formatRating(_seriesInfo!.rating!)!,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
color: AppColors.onSurfaceVariant,
fontSize: 13,
),
@@ -213,7 +214,7 @@ class _MobileSeriesDetailScreenState
],
Text(
'${_seriesInfo!.episodes.keys.length} Seasons',
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
color: AppColors.onSurfaceVariant,
fontSize: 13,
),
@@ -235,7 +236,7 @@ class _MobileSeriesDetailScreenState
padding: const EdgeInsets.all(16.0),
child: Text(
_seriesInfo!.plot!,
style: GoogleFonts.instrumentSans(color: AppColors.onSurfaceVariant, height: 1.4),
style: GoogleFonts.karla(color: AppColors.onSurfaceVariant, height: 1.4),
maxLines: 4,
overflow: TextOverflow.ellipsis,
),
@@ -262,7 +263,7 @@ class _MobileSeriesDetailScreenState
},
backgroundColor: AppColors.surfaceContainer,
selectedColor: AppColors.primary,
labelStyle: GoogleFonts.instrumentSans(
labelStyle: GoogleFonts.karla(
color: isSelected ? AppColors.onPrimary : AppColors.onSurfaceVariant,
fontWeight: isSelected ? FontWeight.w600 : FontWeight.w400,
),
@@ -357,7 +358,7 @@ class _MobileSeriesDetailScreenState
children: [
Text(
'E${episode.episodeNum} - ${episode.title}',
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
color: AppColors.onSurface,
fontWeight: FontWeight.w600,
fontSize: 14,
@@ -369,7 +370,7 @@ class _MobileSeriesDetailScreenState
episode.durationSecs! > 0)
Text(
_formatDuration(episode.durationSecs!),
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
color: AppColors.onSurfaceVariant,
fontSize: 12,
),
lib/mobile/features/iptv/widgets/mobile_live_tv_tab.dart
+26 -24
View File
@@ -50,7 +50,7 @@ class _MobileLiveTVTabState extends ConsumerState<MobileLiveTVTab> {
const SizedBox(height: 16),
const Text(
'Loading channels...',
style: TextStyle(color: Colors.white70),
style: TextStyle(color: AppColors.onSurfaceVariant),
),
const SizedBox(height: 24),
FutureBuilder(
@@ -80,8 +80,8 @@ class _MobileLiveTVTabState extends ConsumerState<MobileLiveTVTab> {
const SizedBox(height: 16),
Text(
'Failed to load channels',
style: GoogleFonts.instrumentSans(
color: Colors.white,
style: GoogleFonts.karla(
color: AppColors.onSurface,
fontSize: 18,
fontWeight: FontWeight.bold,
),
@@ -89,7 +89,7 @@ class _MobileLiveTVTabState extends ConsumerState<MobileLiveTVTab> {
const SizedBox(height: 8),
Text(
'$e',
style: const TextStyle(color: Colors.white54),
style: const TextStyle(color: AppColors.onSurface54),
textAlign: TextAlign.center,
),
const SizedBox(height: 24),
@@ -153,15 +153,15 @@ class _MobileLiveTVTabState extends ConsumerState<MobileLiveTVTab> {
Expanded(
child: TextField(
controller: _searchController,
style: GoogleFonts.instrumentSans(color: Colors.white),
style: GoogleFonts.karla(color: AppColors.onSurface),
decoration: InputDecoration(
hintText: 'Search channels...',
hintStyle:
GoogleFonts.instrumentSans(color: Colors.white54),
GoogleFonts.karla(color: AppColors.onSurface54),
border: InputBorder.none,
prefixIcon: const Icon(
Icons.search,
color: Colors.white54,
color: AppColors.onSurface54,
),
isDense: true,
),
@@ -171,7 +171,7 @@ class _MobileLiveTVTabState extends ConsumerState<MobileLiveTVTab> {
GestureDetector(
onTap: () => _searchController.clear(),
child:
const Icon(Icons.close, color: Colors.white54),
const Icon(Icons.close, color: AppColors.onSurface54),
),
],
),
@@ -201,15 +201,15 @@ class _MobileLiveTVTabState extends ConsumerState<MobileLiveTVTab> {
),
decoration: BoxDecoration(
color: isSelected
? Colors.white
? AppColors.onSurface
: Colors.black.withOpacity(0.4),
borderRadius: BorderRadius.circular(20),
),
child: Text(
category,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
color:
isSelected ? Colors.black : Colors.white70,
isSelected ? Colors.black : AppColors.onSurfaceVariant,
fontWeight: isSelected
? FontWeight.w600
: FontWeight.w500,
@@ -233,8 +233,8 @@ class _MobileLiveTVTabState extends ConsumerState<MobileLiveTVTab> {
: _showFavoritesOnly
? 'Favorites'
: _selectedCategory ?? 'Channels',
style: GoogleFonts.instrumentSans(
color: Colors.white,
style: GoogleFonts.karla(
color: AppColors.onSurface,
fontWeight: FontWeight.bold,
fontSize: 18,
),
@@ -249,7 +249,7 @@ class _MobileLiveTVTabState extends ConsumerState<MobileLiveTVTab> {
decoration: BoxDecoration(
color: _showFavoritesOnly
? AppColors.live.withOpacity(0.2)
: Colors.white.withOpacity(0.1),
: AppColors.onSurface.withOpacity(0.1),
borderRadius: BorderRadius.circular(8),
border: _showFavoritesOnly
? Border.all(color: AppColors.live)
@@ -261,7 +261,7 @@ class _MobileLiveTVTabState extends ConsumerState<MobileLiveTVTab> {
: Icons.favorite_border,
color: _showFavoritesOnly
? AppColors.live
: Colors.white,
: AppColors.onSurface,
size: 20,
),
),
@@ -279,13 +279,13 @@ class _MobileLiveTVTabState extends ConsumerState<MobileLiveTVTab> {
children: [
const Icon(
Icons.tv_off,
color: Colors.white24,
color: AppColors.onSurface24,
size: 48,
),
const SizedBox(height: 16),
Text(
'No channels found',
style: GoogleFonts.instrumentSans(color: Colors.white38),
style: GoogleFonts.karla(color: AppColors.onSurface38),
),
],
),
@@ -365,7 +365,7 @@ class _MobileChannelTile extends StatelessWidget {
width: 48,
height: 48,
decoration: BoxDecoration(
color: Colors.white.withOpacity(0.1),
color: AppColors.onSurface.withOpacity(0.1),
borderRadius: BorderRadius.circular(8),
),
padding: const EdgeInsets.all(4),
@@ -373,17 +373,19 @@ class _MobileChannelTile extends StatelessWidget {
? Image.network(
iconUrl,
fit: BoxFit.contain,
cacheWidth: 120,
filterQuality: FilterQuality.low,
errorBuilder: (_, __, ___) =>
const Icon(Icons.tv, color: Colors.white24),
const Icon(Icons.tv, color: AppColors.onSurface24),
)
: const Icon(Icons.tv, color: Colors.white24),
: const Icon(Icons.tv, color: AppColors.onSurface24),
),
const SizedBox(width: 16),
Expanded(
child: Text(
channel.name,
style: GoogleFonts.instrumentSans(
color: Colors.white,
style: GoogleFonts.karla(
color: AppColors.onSurface,
fontWeight: FontWeight.w500,
fontSize: 14,
),
@@ -394,12 +396,12 @@ class _MobileChannelTile extends StatelessWidget {
Container(
padding: const EdgeInsets.all(8),
decoration: BoxDecoration(
color: Colors.white.withOpacity(0.1),
color: AppColors.onSurface.withOpacity(0.1),
shape: BoxShape.circle,
),
child: const Icon(
Icons.play_arrow_rounded,
color: Colors.white,
color: AppColors.onSurface,
size: 16,
),
),
lib/mobile/features/iptv/widgets/mobile_movies_tab.dart
+7 -5
View File
@@ -206,13 +206,13 @@ class _MobileMoviesTabState extends ConsumerState<MobileMoviesTab> {
Expanded(
child: TextField(
controller: _searchController,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 14,
color: AppColors.onSurface,
),
decoration: InputDecoration(
hintText: 'Search Movies...',
hintStyle: GoogleFonts.instrumentSans(color: AppColors.onSurfaceVariant),
hintStyle: GoogleFonts.karla(color: AppColors.onSurfaceVariant),
border: InputBorder.none,
isDense: true,
contentPadding: const EdgeInsets.only(bottom: 11),
@@ -300,6 +300,8 @@ class _MobileMoviesTabState extends ConsumerState<MobileMoviesTab> {
? Image.network(
_getProxiedImageUrl(movie.streamIcon, ref),
fit: BoxFit.cover,
cacheWidth: 360,
filterQuality: FilterQuality.low,
errorBuilder: (_, __, ___) =>
Container(color: AppColors.surfaceContainerLow),
)
@@ -346,7 +348,7 @@ class _MobileMoviesTabState extends ConsumerState<MobileMoviesTab> {
children: [
Text(
movie.name,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
color: AppColors.onSurface,
fontSize: 13,
fontWeight: FontWeight.w600,
@@ -357,7 +359,7 @@ class _MobileMoviesTabState extends ConsumerState<MobileMoviesTab> {
if (isWatched)
Text(
'WATCHED',
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
color: AppColors.primary,
fontSize: 10,
fontWeight: FontWeight.bold,
@@ -389,7 +391,7 @@ class _MobileMoviesTabState extends ConsumerState<MobileMoviesTab> {
const SizedBox(width: 4),
Text(
_formatRating(movie.rating)!,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 10,
fontWeight: FontWeight.bold,
color: AppColors.onSurface,
lib/mobile/features/iptv/widgets/mobile_series_tab.dart
+6 -4
View File
@@ -197,13 +197,13 @@ class _MobileSeriesTabState extends ConsumerState<MobileSeriesTab> {
Expanded(
child: TextField(
controller: _searchController,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 14,
color: AppColors.onSurface,
),
decoration: InputDecoration(
hintText: 'Search Series...',
hintStyle: GoogleFonts.instrumentSans(color: AppColors.onSurfaceVariant),
hintStyle: GoogleFonts.karla(color: AppColors.onSurfaceVariant),
border: InputBorder.none,
isDense: true,
contentPadding: const EdgeInsets.only(bottom: 11),
@@ -290,6 +290,8 @@ class _MobileSeriesTabState extends ConsumerState<MobileSeriesTab> {
? Image.network(
_getProxiedImageUrl(series.cover, ref),
fit: BoxFit.cover,
cacheWidth: 360,
filterQuality: FilterQuality.low,
errorBuilder: (_, __, ___) =>
Container(color: AppColors.surfaceContainerLow),
)
@@ -332,7 +334,7 @@ class _MobileSeriesTabState extends ConsumerState<MobileSeriesTab> {
right: 12,
child: Text(
series.name,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
color: AppColors.onSurface,
fontSize: 13,
fontWeight: FontWeight.w600,
@@ -364,7 +366,7 @@ class _MobileSeriesTabState extends ConsumerState<MobileSeriesTab> {
const SizedBox(width: 4),
Text(
_formatRating(series.rating)!,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 10,
fontWeight: FontWeight.bold,
color: AppColors.onSurface,
lib/mobile/features/iptv/widgets/mobile_settings_tab.dart
+1 -1
View File
@@ -398,7 +398,7 @@ class _SectionHeader extends StatelessWidget {
padding: const EdgeInsets.only(left: 8, bottom: 8),
child: Text(
title,
style: GoogleFonts.instrumentSans(
style: GoogleFonts.karla(
fontSize: 14,
fontWeight: FontWeight.w600,
color: AppColors.onSurfaceVariant,
lib/mobile/theme/mobile_theme.dart
+36 -31
View File
@@ -1,25 +1,25 @@
import 'package:flutter/material.dart';
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
import '../../core/theme/app_colors.dart';
/// XtremFlow Mobile Theme
/// Thème mobile XtremFlow — déclinaison tactile de « Warm Cinema ».
///
/// Adapted from AppTheme for touch-first screens.
/// Uses the same Cyber-Cinematic Glass design system.
/// Mêmes tokens que [AppTheme] (charbon chaud / crème / braise), échelles
/// typographiques réduites et cibles tactiles élargies.
class MobileTheme {
MobileTheme._();
// ============ SPACING (8px rhythmic system) ============
// ============ ESPACEMENT ============
static const double spacingXs = 4.0;
static const double spacingSm = 8.0;
static const double spacingMd = 16.0;
static const double spacingLg = 24.0;
static const double spacingXl = 32.0;
// ============ RADIUS ============
static const double radiusSm = 8.0;
static const double radiusMd = 12.0;
static const double radiusLg = 16.0;
// ============ RAYONS (alignés sur AppTheme) ============
static const double radiusSm = 6.0;
static const double radiusMd = 10.0;
static const double radiusLg = 14.0;
static const double radiusXl = 20.0;
// ============ DARK THEME (Mobile Main) ============
@@ -32,69 +32,69 @@ class MobileTheme {
// Typography: Scaled down for mobile
textTheme: TextTheme(
displayLarge: GoogleFonts.syne(
displayLarge: GoogleFonts.fraunces(
fontSize: 32,
fontWeight: FontWeight.w700,
letterSpacing: -0.02,
height: 1.1,
color: AppColors.onSurface,
),
displayMedium: GoogleFonts.syne(
displayMedium: GoogleFonts.fraunces(
fontSize: 28,
fontWeight: FontWeight.w600,
letterSpacing: -0.01,
height: 1.2,
color: AppColors.onSurface,
),
displaySmall: GoogleFonts.syne(
displaySmall: GoogleFonts.fraunces(
fontSize: 22,
fontWeight: FontWeight.w500,
height: 1.3,
color: AppColors.onSurface,
),
headlineMedium: GoogleFonts.syne(
headlineMedium: GoogleFonts.fraunces(
fontSize: 20,
fontWeight: FontWeight.w500,
height: 1.3,
color: AppColors.onSurface,
),
titleLarge: GoogleFonts.syne(
titleLarge: GoogleFonts.fraunces(
fontSize: 18,
fontWeight: FontWeight.w600,
color: AppColors.onSurface,
),
titleMedium: GoogleFonts.instrumentSans(
titleMedium: GoogleFonts.karla(
fontSize: 16,
fontWeight: FontWeight.w600,
color: AppColors.onSurface,
),
bodyLarge: GoogleFonts.instrumentSans(
bodyLarge: GoogleFonts.karla(
fontSize: 16,
fontWeight: FontWeight.w400,
height: 1.5,
color: AppColors.onSurfaceVariant,
),
bodyMedium: GoogleFonts.instrumentSans(
bodyMedium: GoogleFonts.karla(
fontSize: 14,
fontWeight: FontWeight.w400,
height: 1.5,
color: AppColors.onSurfaceVariant,
),
labelLarge: GoogleFonts.instrumentSans(
labelLarge: GoogleFonts.karla(
fontSize: 14,
fontWeight: FontWeight.w600,
letterSpacing: 0.05,
height: 1.2,
color: AppColors.onSurface,
),
labelMedium: GoogleFonts.instrumentSans(
labelMedium: GoogleFonts.karla(
fontSize: 12,
fontWeight: FontWeight.w500,
letterSpacing: 0.02,
height: 1.2,
color: AppColors.onSurface,
),
labelSmall: GoogleFonts.instrumentSans(
labelSmall: GoogleFonts.karla(
fontSize: 11,
fontWeight: FontWeight.w500,
letterSpacing: 0.02,
@@ -110,7 +110,7 @@ class MobileTheme {
elevation: 0,
centerTitle: true,
scrolledUnderElevation: 0,
titleTextStyle: GoogleFonts.syne(
titleTextStyle: GoogleFonts.fraunces(
fontSize: 18,
fontWeight: FontWeight.w600,
color: AppColors.onSurface,
@@ -119,14 +119,16 @@ class MobileTheme {
// Bottom Navigation Bar
bottomNavigationBarTheme: BottomNavigationBarThemeData(
backgroundColor: AppColors.surfaceContainerLow.withOpacity(0.9),
selectedItemColor: AppColors.onSurface,
// Opaque : une barre translucide impose une couche de composition
// supplementaire sur toute la largeur, a chaque frame.
backgroundColor: AppColors.surfaceContainerLowest,
selectedItemColor: AppColors.primary,
unselectedItemColor: AppColors.outline,
selectedLabelStyle: GoogleFonts.instrumentSans(
selectedLabelStyle: GoogleFonts.karla(
fontSize: 11,
fontWeight: FontWeight.w600,
),
unselectedLabelStyle: GoogleFonts.instrumentSans(
unselectedLabelStyle: GoogleFonts.karla(
fontSize: 11,
fontWeight: FontWeight.w500,
),
@@ -157,7 +159,7 @@ class MobileTheme {
width: 2,
),
),
hintStyle: GoogleFonts.instrumentSans(
hintStyle: GoogleFonts.karla(
color: AppColors.outline,
fontSize: 14,
),
@@ -166,14 +168,16 @@ class MobileTheme {
// Buttons
filledButtonTheme: FilledButtonThemeData(
style: FilledButton.styleFrom(
backgroundColor: AppColors.primaryContainer,
foregroundColor: AppColors.onPrimaryContainer,
// Braise profonde : seule variante qui tient le contraste AA
// (4,5:1) avec du texte blanc.
backgroundColor: AppColors.primaryFill,
foregroundColor: AppColors.onSurface,
elevation: 0,
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 15),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(radiusMd),
),
textStyle: GoogleFonts.instrumentSans(
textStyle: GoogleFonts.karla(
fontWeight: FontWeight.w600,
fontSize: 14,
),
@@ -182,7 +186,8 @@ class MobileTheme {
// Cards
cardTheme: CardThemeData(
color: AppColors.glassLevel1Bg,
color: AppColors.surfaceContainerLow,
surfaceTintColor: Colors.transparent,
elevation: 0,
margin: EdgeInsets.zero,
shape: RoundedRectangleBorder(
lib/mobile/widgets/mobile_scaffold.dart
+2 -2
View File
@@ -60,9 +60,9 @@ class MobileScaffold extends ConsumerWidget {
selectedItemColor: AppColors.primary,
unselectedItemColor: AppColors.textSecondary,
selectedLabelStyle:
GoogleFonts.instrumentSans(fontWeight: FontWeight.w600, fontSize: 11),
GoogleFonts.karla(fontWeight: FontWeight.w600, fontSize: 11),
unselectedLabelStyle:
GoogleFonts.instrumentSans(fontWeight: FontWeight.w500, fontSize: 11),
GoogleFonts.karla(fontWeight: FontWeight.w500, fontSize: 11),
items: const [
BottomNavigationBarItem(
icon: Icon(Icons.live_tv_rounded),