Skip to content

Commit 300ab22

Browse files
EmiloartEmiloart
committed
Polish lite mode UI across feed, inbox, chat, and dialogs
1 parent 2e429ac commit 300ab22

17 files changed

Lines changed: 527 additions & 210 deletions

File tree

‎apps/mobile/lib/core/theme/app_theme.dart‎

Lines changed: 40 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -4,9 +4,9 @@ class AppTheme {
44
static const Color _bg = Color(0xFF000000);
55
static const Color _panel = Color(0xFF111111);
66
static const Color _accent = Color(0xFFFF2D55);
7-
static const Color _liteBg = Color(0xFFF7F1E8);
8-
static const Color _litePanel = Color(0xFFFFFAF3);
9-
static const Color _litePanelElevated = Color(0xFFF2E6D8);
7+
static const Color _liteBg = Color(0xFFF6F1E8);
8+
static const Color _litePanel = Color(0xFFFFFBF5);
9+
static const Color _litePanelElevated = Color(0xFFFFFFFF);
1010
static const Color _liteAccent = Color(0xFFE11D48);
1111
static const Color _liteNeutral = Color(0xFF3D2B24);
1212
static const Color _liteSupporting = Color(0xFF8B1E3F);
@@ -51,22 +51,38 @@ class AppTheme {
5151
secondary: _liteSupporting,
5252
tertiary: _liteNeutral,
5353
onSurface: _liteNeutral,
54+
onSurfaceVariant: _liteNeutral.withValues(alpha: 0.76),
5455
onPrimary: Colors.white,
56+
primaryContainer: const Color(0xFFFFE3E9),
57+
onPrimaryContainer: const Color(0xFF7A102A),
58+
surfaceContainerLowest: const Color(0xFFFFFFFF),
59+
surfaceContainerLow: const Color(0xFFFFFCF8),
60+
surfaceContainer: const Color(0xFFFAF4EB),
61+
surfaceContainerHigh: const Color(0xFFF5EDE3),
62+
surfaceContainerHighest: const Color(0xFFEDE2D4),
5563
outline: _liteNeutral.withValues(alpha: 0.24),
5664
);
5765

5866
return base.copyWith(
5967
scaffoldBackgroundColor: _liteBg,
6068
canvasColor: _liteBg,
6169
colorScheme: scheme,
62-
appBarTheme: const AppBarTheme(
63-
backgroundColor: _liteBg,
70+
appBarTheme: AppBarTheme(
71+
backgroundColor: _litePanelElevated,
6472
foregroundColor: _liteNeutral,
73+
elevation: 0.5,
74+
shadowColor: Colors.black.withValues(alpha: 0.08),
75+
surfaceTintColor: Colors.transparent,
6576
centerTitle: false,
6677
),
6778
cardTheme: CardThemeData(
68-
color: _litePanel,
69-
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(16)),
79+
color: _litePanelElevated,
80+
elevation: 0.6,
81+
shadowColor: Colors.black.withValues(alpha: 0.08),
82+
shape: RoundedRectangleBorder(
83+
borderRadius: BorderRadius.circular(16),
84+
side: BorderSide(color: _liteNeutral.withValues(alpha: 0.14)),
85+
),
7086
),
7187
elevatedButtonTheme: ElevatedButtonThemeData(
7288
style: ElevatedButton.styleFrom(
@@ -79,11 +95,26 @@ class AppTheme {
7995
),
8096
),
8197
bottomAppBarTheme: const BottomAppBarThemeData(
82-
color: _litePanel,
98+
color: _litePanelElevated,
8399
),
84100
dialogTheme: const DialogThemeData(
85101
backgroundColor: _litePanelElevated,
86102
),
103+
popupMenuTheme: PopupMenuThemeData(
104+
color: _litePanelElevated,
105+
textStyle: const TextStyle(color: _liteNeutral),
106+
),
107+
snackBarTheme: SnackBarThemeData(
108+
backgroundColor: _litePanelElevated,
109+
contentTextStyle: const TextStyle(color: _liteNeutral),
110+
actionTextColor: _liteAccent,
111+
behavior: SnackBarBehavior.floating,
112+
insetPadding: const EdgeInsets.fromLTRB(14, 0, 14, 14),
113+
shape: RoundedRectangleBorder(
114+
borderRadius: BorderRadius.circular(14),
115+
side: BorderSide(color: _liteNeutral.withValues(alpha: 0.14)),
116+
),
117+
),
87118
inputDecorationTheme: InputDecorationTheme(
88119
filled: true,
89120
fillColor: _litePanelElevated,
@@ -118,6 +149,7 @@ class AppTheme {
118149
side: BorderSide(color: _liteNeutral.withValues(alpha: 0.16)),
119150
labelStyle: const TextStyle(color: _liteNeutral),
120151
),
152+
dividerColor: _liteNeutral.withValues(alpha: 0.18),
121153
textTheme: base.textTheme.apply(
122154
bodyColor: _liteNeutral,
123155
displayColor: _liteNeutral,

‎apps/mobile/lib/features/communities/presentation/communities_hub_screen.dart‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -879,7 +879,9 @@ class _CommunityAvatarSquare extends StatelessWidget {
879879
width: 18,
880880
height: 18,
881881
decoration: BoxDecoration(
882-
color: Colors.black.withValues(alpha: 0.3),
882+
color: _isLightTheme(context)
883+
? const Color(0x33FFFFFF)
884+
: Colors.black.withValues(alpha: 0.3),
883885
borderRadius: BorderRadius.circular(8),
884886
),
885887
child: Icon(
@@ -1954,16 +1956,15 @@ String _friendlyCommunitiesLoadError(
19541956

19551957
if (lowered.contains('42p17') ||
19561958
lowered.contains('infinite recursion detected in policy')) {
1957-
return 'A backend policy loop blocked $scope (code 42P17). '
1958-
'Pull to refresh after applying the latest DB migration.';
1959+
return 'A temporary backend issue blocked $scope. Pull to refresh and try again.';
19591960
}
19601961

19611962
if (lowered.contains('failed host lookup') ||
19621963
lowered.contains('socketexception')) {
19631964
return 'Network issue while loading $scope. Check connection and pull to refresh.';
19641965
}
19651966

1966-
return 'Pull to refresh and try again. Error: $raw';
1967+
return 'Pull to refresh and try again. If this keeps happening, restart the app.';
19671968
}
19681969

19691970
List<CommunityMembershipSummary> _filterMemberships(

‎apps/mobile/lib/features/communities/presentation/join_link_screen.dart‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,9 @@ class JoinLinkScreen extends ConsumerWidget {
3636
children: <Widget>[
3737
Text(
3838
'Could not join: $error',
39-
style: const TextStyle(color: Colors.white),
39+
style: TextStyle(
40+
color: Theme.of(context).colorScheme.onSurface,
41+
),
4042
textAlign: TextAlign.center,
4143
),
4244
const SizedBox(height: 16),

‎apps/mobile/lib/features/engagement/presentation/challenges_screen.dart‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -298,7 +298,7 @@ class _ChallengesScreenState extends ConsumerState<ChallengesScreen> {
298298

299299
final selectedPostId = await showModalBottomSheet<String>(
300300
context: context,
301-
backgroundColor: const Color(0xFF0B0B0B),
301+
backgroundColor: Theme.of(context).colorScheme.surface,
302302
isScrollControlled: true,
303303
builder: (_) => _ChallengePostPicker(posts: eligiblePosts),
304304
);

‎apps/mobile/lib/features/engagement/presentation/create_challenge_dialog.dart‎

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -34,9 +34,13 @@ class _CreateChallengeDialogState extends State<CreateChallengeDialog> {
3434

3535
@override
3636
Widget build(BuildContext context) {
37+
final scheme = Theme.of(context).colorScheme;
3738
return AlertDialog(
38-
backgroundColor: const Color(0xFF111111),
39-
title: const Text('Create Challenge'),
39+
backgroundColor: scheme.surface,
40+
title: Text(
41+
'Create Challenge',
42+
style: TextStyle(color: scheme.onSurface),
43+
),
4044
content: Form(
4145
key: _formKey,
4246
child: SingleChildScrollView(

‎apps/mobile/lib/features/engagement/presentation/create_poll_dialog.dart‎

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -40,9 +40,13 @@ class _CreatePollDialogState extends State<CreatePollDialog> {
4040

4141
@override
4242
Widget build(BuildContext context) {
43+
final scheme = Theme.of(context).colorScheme;
4344
return AlertDialog(
44-
backgroundColor: const Color(0xFF111111),
45-
title: const Text('Create Poll'),
45+
backgroundColor: scheme.surface,
46+
title: Text(
47+
'Create Poll',
48+
style: TextStyle(color: scheme.onSurface),
49+
),
4650
content: Form(
4751
key: _formKey,
4852
child: SingleChildScrollView(

‎apps/mobile/lib/features/feed/presentation/community_feed_screen.dart‎

Lines changed: 43 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -470,10 +470,11 @@ Future<void> _showCreateCommunityPostDialog(
470470
}
471471

472472
Future<void> _showRepliesSheet(BuildContext context, String postId) async {
473+
final scheme = Theme.of(context).colorScheme;
473474
await showModalBottomSheet<void>(
474475
context: context,
475476
isScrollControlled: true,
476-
backgroundColor: const Color(0xFF0B0B0B),
477+
backgroundColor: scheme.surface,
477478
builder: (_) => PostRepliesSheet(postId: postId),
478479
);
479480
}
@@ -503,6 +504,7 @@ class _FeedPostCard extends StatelessWidget {
503504

504505
@override
505506
Widget build(BuildContext context) {
507+
final scheme = Theme.of(context).colorScheme;
506508
return Card(
507509
child: Padding(
508510
padding: const EdgeInsets.all(14),
@@ -527,8 +529,9 @@ class _FeedPostCard extends StatelessWidget {
527529
),
528530
),
529531
PopupMenuButton<_PostAction>(
530-
icon: const Icon(Icons.more_horiz, color: Colors.white70),
531-
color: const Color(0xFF111111),
532+
icon: Icon(Icons.more_horiz,
533+
color: scheme.onSurface.withValues(alpha: 0.72)),
534+
color: scheme.surface,
532535
onSelected: (_PostAction action) {
533536
switch (action) {
534537
case _PostAction.report:
@@ -576,15 +579,15 @@ class _FeedPostCard extends StatelessWidget {
576579
size: 16,
577580
color: isLiked
578581
? const Color(0xFFFF2D55)
579-
: Colors.white70,
582+
: scheme.onSurface.withValues(alpha: 0.72),
580583
),
581584
const SizedBox(width: 6),
582585
Text(
583586
'${post.likeCount}',
584587
style: TextStyle(
585588
color: isLiked
586589
? const Color(0xFFFF2D55)
587-
: Colors.white70,
590+
: scheme.onSurface.withValues(alpha: 0.72),
588591
),
589592
),
590593
],
@@ -605,12 +608,14 @@ class _FeedPostCard extends StatelessWidget {
605608
Icon(
606609
Icons.chat_bubble_outline_rounded,
607610
size: 16,
608-
color: Colors.white70,
611+
color: scheme.onSurface.withValues(alpha: 0.72),
609612
),
610613
SizedBox(width: 6),
611614
Text(
612615
'${post.replyCount} replies',
613-
style: TextStyle(color: Colors.white70),
616+
style: TextStyle(
617+
color: scheme.onSurface.withValues(alpha: 0.72),
618+
),
614619
),
615620
],
616621
),
@@ -632,20 +637,24 @@ class _FeedPostCard extends StatelessWidget {
632637
),
633638
),
634639
const SizedBox(width: 14),
635-
const Icon(
640+
Icon(
636641
Icons.visibility_outlined,
637642
size: 16,
638-
color: Colors.white70,
643+
color: scheme.onSurface.withValues(alpha: 0.72),
639644
),
640645
const SizedBox(width: 6),
641646
Text(
642647
'${post.viewCount}',
643-
style: const TextStyle(color: Colors.white70),
648+
style: TextStyle(
649+
color: scheme.onSurface.withValues(alpha: 0.72)),
644650
),
645651
const Spacer(),
646652
Text(
647653
_compactTime(post.createdAt),
648-
style: const TextStyle(color: Colors.white70, fontSize: 12),
654+
style: TextStyle(
655+
color: scheme.onSurface.withValues(alpha: 0.72),
656+
fontSize: 12,
657+
),
649658
),
650659
],
651660
),
@@ -689,7 +698,11 @@ class _FeedFooter extends StatelessWidget {
689698
child: Text(
690699
message,
691700
textAlign: TextAlign.center,
692-
style: const TextStyle(color: Colors.white70),
701+
style: TextStyle(
702+
color: Theme.of(context)
703+
.colorScheme
704+
.onSurface
705+
.withValues(alpha: 0.72)),
693706
),
694707
);
695708
}
@@ -718,7 +731,7 @@ class _FeedErrorState extends StatelessWidget {
718731
Text(
719732
message,
720733
textAlign: TextAlign.center,
721-
style: const TextStyle(color: Colors.white),
734+
style: TextStyle(color: Theme.of(context).colorScheme.onSurface),
722735
),
723736
const SizedBox(height: 12),
724737
ElevatedButton(
@@ -741,17 +754,21 @@ Future<void> _showCommunityInviteDialog(
741754
await showDialog<void>(
742755
context: context,
743756
builder: (BuildContext dialogContext) {
757+
final scheme = Theme.of(dialogContext).colorScheme;
744758
return AlertDialog(
745-
backgroundColor: const Color(0xFF111111),
746-
title: const Text('Invite to Community'),
759+
backgroundColor: scheme.surface,
760+
title: Text(
761+
'Invite to Community',
762+
style: TextStyle(color: scheme.onSurface),
763+
),
747764
content: Column(
748765
mainAxisSize: MainAxisSize.min,
749766
crossAxisAlignment: CrossAxisAlignment.start,
750767
children: <Widget>[
751768
Text(
752769
community.name,
753-
style: const TextStyle(
754-
color: Colors.white,
770+
style: TextStyle(
771+
color: scheme.onSurface,
755772
fontWeight: FontWeight.w700,
756773
),
757774
),
@@ -767,14 +784,20 @@ Future<void> _showCommunityInviteDialog(
767784
const SizedBox(height: 8),
768785
SelectableText(
769786
inviteLink,
770-
style: const TextStyle(color: Colors.white70, fontSize: 12),
787+
style: TextStyle(
788+
color: scheme.onSurface.withValues(alpha: 0.72),
789+
fontSize: 12,
790+
),
771791
),
772792
if (community.isPrivate)
773-
const Padding(
793+
Padding(
774794
padding: EdgeInsets.only(top: 8),
775795
child: Text(
776796
'Private communities require this invite code or link.',
777-
style: TextStyle(color: Colors.white54, fontSize: 12),
797+
style: TextStyle(
798+
color: scheme.onSurface.withValues(alpha: 0.6),
799+
fontSize: 12,
800+
),
778801
),
779802
),
780803
],

0 commit comments

Comments
 (0)