refactor(theme): replace hardcoded colors with AppColors system

- Unify color palette across login, dashboard, admin, and player screens
- Replace Colors.white/black with AppColors semantic colors
- Use AppColors.backgroundGradient instead of hardcoded gradients
- Apply primary teal accent (#00A0D2) consistently
- Fix text hierarchy with textPrimary/Secondary/Tertiary
- Improve visual consistency with Apple TV theme

Changes:
- login_screen.dart: gradient, icon, text colors
- dashboard_screen.dart: border, text, background colors
- admin_panel.dart: all Colors.white/white70 → AppColors
- player_screen.dart: background, overlay, text colors

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
This commit is contained in:
GitHub CopilotandClaude Haiku 4.5 committed 2026-03-26 11:49:46 +01:00
1 parent 0c9d0e50ec
commit a3a4b6f0f2
4 files changed
+23 -23

No files matched your search

+6 -6
View File
@@ -80,13 +80,13 @@ class _AdminContentState extends ConsumerState<AdminContent>
padding: const EdgeInsets.all(8), padding: const EdgeInsets.all(8),
showBorder: false, showBorder: false,
onTap: () => context.go('/playlists'), onTap: () => context.go('/playlists'),
child: const Icon(Icons.arrow_back, color: Colors.white70), child: const Icon(Icons.arrow_back, color: AppColors.textSecondary),
), ),
const SizedBox(width: 16), const SizedBox(width: 16),
Text( Text(
'Administration', 'Administration',
style: Theme.of(context).textTheme.headlineMedium?.copyWith( style: Theme.of(context).textTheme.headlineMedium?.copyWith(
color: Colors.white, color: AppColors.textPrimary,
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
), ),
), ),
@@ -147,7 +147,7 @@ class _AdminContentState extends ConsumerState<AdminContent>
Icon( Icon(
icon, icon,
size: 18, size: 18,
color: isSelected ? Colors.black : Colors.white70, color: isSelected ? AppColors.textPrimary : AppColors.textSecondary,
), ),
const SizedBox(width: 8), const SizedBox(width: 8),
Text( Text(
@@ -155,7 +155,7 @@ class _AdminContentState extends ConsumerState<AdminContent>
style: GoogleFonts.inter( style: GoogleFonts.inter(
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
fontSize: 14, fontSize: 14,
color: isSelected ? Colors.black : Colors.white70, color: isSelected ? AppColors.textPrimary : AppColors.textSecondary,
), ),
), ),
], ],
@@ -187,7 +187,7 @@ class _PlaylistsTab extends ConsumerWidget {
style: Theme.of(context) style: Theme.of(context)
.textTheme .textTheme
.bodyLarge .bodyLarge
?.copyWith(color: Colors.white70), ?.copyWith(color: AppColors.textSecondary),
), ),
GradientButton( GradientButton(
label: 'Add Playlist', label: 'Add Playlist',
@@ -462,7 +462,7 @@ class _UsersTab extends ConsumerWidget {
style: Theme.of(context) style: Theme.of(context)
.textTheme .textTheme
.bodyLarge .bodyLarge
?.copyWith(color: Colors.white70), ?.copyWith(color: AppColors.textSecondary),
), ),
GradientButton( GradientButton(
label: 'Create User', label: 'Create User',
+6 -6
View File
@@ -69,7 +69,7 @@ class _LoginScreenState extends ConsumerState<LoginScreen> {
shape: BoxShape.circle, shape: BoxShape.circle,
gradient: RadialGradient( gradient: RadialGradient(
colors: [ colors: [
Colors.white.withOpacity(0.05), AppColors.textPrimary.withOpacity(0.05),
Colors.transparent, Colors.transparent,
], ],
radius: 0.5, radius: 0.5,
@@ -118,7 +118,7 @@ class _LoginScreenState extends ConsumerState<LoginScreen> {
borderRadius: BorderRadius.circular(32), borderRadius: BorderRadius.circular(32),
boxShadow: [ boxShadow: [
BoxShadow( BoxShadow(
color: Colors.black.withOpacity(0.5), color: AppColors.background.withOpacity(0.5),
blurRadius: 30, blurRadius: 30,
offset: const Offset(0, 15), offset: const Offset(0, 15),
), ),
@@ -239,13 +239,13 @@ class _LoginScreenState extends ConsumerState<LoginScreen> {
TvFocusableCard( TvFocusableCard(
onTap: _handleLogin, onTap: _handleLogin,
scaleFactor: 1.03, scaleFactor: 1.03,
focusColor: Colors.white, focusColor: AppColors.primary,
borderRadius: 16, borderRadius: 16,
child: Container( child: Container(
height: 60, height: 60,
alignment: Alignment.center, alignment: Alignment.center,
decoration: BoxDecoration( decoration: BoxDecoration(
color: Colors.white, color: AppColors.textPrimary,
borderRadius: BorderRadius.circular(16), borderRadius: BorderRadius.circular(16),
), ),
child: authState.isLoading child: authState.isLoading
@@ -254,13 +254,13 @@ class _LoginScreenState extends ConsumerState<LoginScreen> {
height: 24, height: 24,
child: CircularProgressIndicator( child: CircularProgressIndicator(
strokeWidth: 2.5, strokeWidth: 2.5,
color: Colors.black, color: AppColors.primary,
), ),
) )
: Text( : Text(
'Sign In', 'Sign In',
style: GoogleFonts.inter( style: GoogleFonts.inter(
color: Colors.black, color: AppColors.primary,
fontSize: 18, fontSize: 18,
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
), ),
@@ -96,7 +96,7 @@ class _DashboardScreenState extends ConsumerState<DashboardScreen> {
// blur is hardcoded in GlassContainer (15), so we don't pass it // blur is hardcoded in GlassContainer (15), so we don't pass it
// border is bool, borderColor allows customization // border is bool, borderColor allows customization
hasBorder: true, hasBorder: true,
borderColor: Colors.white.withOpacity(0.1), borderColor: AppColors.border,
child: Column( child: Column(
mainAxisAlignment: MainAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.center,
children: [ children: [
@@ -119,7 +119,7 @@ class _DashboardScreenState extends ConsumerState<DashboardScreen> {
), ),
child: const Icon( child: const Icon(
Icons.play_arrow_rounded, Icons.play_arrow_rounded,
color: Colors.white, color: AppColors.textPrimary,
size: 28, size: 28,
), ),
), ),
@@ -155,7 +155,7 @@ class _DashboardScreenState extends ConsumerState<DashboardScreen> {
child: Icon( child: Icon(
_icons[index], _icons[index],
color: isSelected color: isSelected
? Colors.white ? AppColors.textPrimary
: AppColors.textSecondary, : AppColors.textSecondary,
size: 24, size: 24,
), ),
@@ -175,10 +175,10 @@ class _DashboardScreenState extends ConsumerState<DashboardScreen> {
scaleFactor: 1.1, scaleFactor: 1.1,
child: CircleAvatar( child: CircleAvatar(
radius: 20, radius: 20,
backgroundColor: Colors.white.withOpacity(0.1), backgroundColor: AppColors.primary.withOpacity(0.1),
child: const Icon( child: const Icon(
Icons.person, Icons.person,
color: Colors.white70, color: AppColors.textSecondary,
size: 20, size: 20,
), ),
), ),
+6 -6
View File
@@ -379,7 +379,7 @@ class _PlayerScreenState extends ConsumerState<PlayerScreen> {
// LITE PLAYER MODE for Live TV - Simplified UI (no BackdropFilter) // LITE PLAYER MODE for Live TV - Simplified UI (no BackdropFilter)
if (isLiveTV) { if (isLiveTV) {
return Scaffold( return Scaffold(
backgroundColor: Colors.black, backgroundColor: AppColors.background,
body: Stack( body: Stack(
fit: StackFit.expand, fit: StackFit.expand,
children: [ children: [
@@ -420,7 +420,7 @@ class _PlayerScreenState extends ConsumerState<PlayerScreen> {
begin: Alignment.topCenter, begin: Alignment.topCenter,
end: Alignment.bottomCenter, end: Alignment.bottomCenter,
colors: [ colors: [
Colors.black.withOpacity(0.8), AppColors.background.withOpacity(0.8),
Colors.transparent, Colors.transparent,
], ],
), ),
@@ -451,7 +451,7 @@ class _PlayerScreenState extends ConsumerState<PlayerScreen> {
.toString() .toString()
: widget.title, : widget.title,
style: GoogleFonts.outfit( style: GoogleFonts.outfit(
color: Colors.white, color: AppColors.textPrimary,
fontSize: 18, fontSize: 18,
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
), ),
@@ -490,17 +490,17 @@ class _PlayerScreenState extends ConsumerState<PlayerScreen> {
vertical: isSmallScreen ? 12 : 16, vertical: isSmallScreen ? 12 : 16,
), ),
decoration: BoxDecoration( decoration: BoxDecoration(
color: const Color(0xFF1A1A2E).withOpacity(0.95), color: AppColors.surface.withOpacity(0.95),
borderRadius: BorderRadius.circular(24), borderRadius: BorderRadius.circular(24),
boxShadow: [ boxShadow: [
BoxShadow( BoxShadow(
color: Colors.black.withOpacity(0.3), color: AppColors.background.withOpacity(0.3),
blurRadius: 10, blurRadius: 10,
spreadRadius: 2, spreadRadius: 2,
), ),
], ],
border: Border.all( border: Border.all(
color: Colors.white.withOpacity(0.15), color: AppColors.textPrimary.withOpacity(0.15),
), ),
), ),
child: isSmallScreen child: isSmallScreen