Skip to content

Commit c543a53

Browse files
committed
fix: ui issues across the app
1 parent 5574fe0 commit c543a53

File tree

4 files changed

+111
-64
lines changed

4 files changed

+111
-64
lines changed

mobile/lib/features/account/presentation/pages/account.dart

Lines changed: 44 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -36,9 +36,13 @@ class AccountPage extends StatelessWidget {
3636
decoration: BoxDecoration(
3737
color: Theme.of(context).colorScheme.surfaceContainer,
3838
gradient: LinearGradient(
39-
colors: [Theme.of(context).colorScheme.primary, Theme.of(context).colorScheme.secondary],
39+
colors: [
40+
Theme.of(context).colorScheme.primary,
41+
Theme.of(context).colorScheme.secondary
42+
],
4043
),
41-
borderRadius: const BorderRadius.all(Radius.circular(10))),
44+
borderRadius:
45+
const BorderRadius.all(Radius.circular(10))),
4246
child: Row(
4347
spacing: 10,
4448
children: [
@@ -68,32 +72,51 @@ class AccountPage extends StatelessWidget {
6872
},
6973
errorBuilder: (BuildContext context, Object error,
7074
StackTrace? stackTrace) {
71-
return const Icon(Icons.person, size: 60);
75+
return Icon(
76+
Icons.person,
77+
size: 60,
78+
color: Theme.of(context).colorScheme.onPrimary,
79+
);
7280
},
7381
),
7482
)
7583
else
76-
const Icon(Icons.person, size: 60),
84+
Icon(
85+
Icons.person,
86+
size: 60,
87+
color: Theme.of(context).colorScheme.onPrimary,
88+
),
7789
Flexible(
7890
child: Column(
7991
crossAxisAlignment: CrossAxisAlignment.start,
8092
children: [
8193
if (user.name.isNotEmpty)
8294
Text(
8395
user.name,
84-
style: const TextStyle(
85-
fontWeight: FontWeight.bold,
86-
fontSize: 24),
96+
style: TextStyle(
97+
fontWeight: FontWeight.bold,
98+
fontSize: 24,
99+
color:
100+
Theme.of(context).colorScheme.onPrimary,
101+
),
87102
)
88103
else
89-
const Text(
104+
Text(
90105
"No display name",
91106
style: TextStyle(
92-
fontWeight: FontWeight.normal,
93-
fontSize: 24,
94-
fontStyle: FontStyle.italic),
107+
fontWeight: FontWeight.normal,
108+
fontSize: 24,
109+
fontStyle: FontStyle.italic,
110+
color:
111+
Theme.of(context).colorScheme.onPrimary,
112+
),
95113
),
96-
Text(user.email)
114+
Text(
115+
user.email,
116+
style: TextStyle(
117+
color: Theme.of(context).colorScheme.onPrimary,
118+
),
119+
)
97120
],
98121
),
99122
)
@@ -105,7 +128,7 @@ class AccountPage extends StatelessWidget {
105128
),
106129
Container(
107130
decoration: BoxDecoration(
108-
color: Theme.of(context).colorScheme.surfaceBright,
131+
color: Theme.of(context).colorScheme.surfaceContainer,
109132
borderRadius: const BorderRadius.all(Radius.circular(10)),
110133
),
111134
child: Column(
@@ -172,13 +195,15 @@ class AccountPage extends StatelessWidget {
172195
),
173196
Container(
174197
width: double.infinity,
175-
padding: const EdgeInsets.symmetric(horizontal: 15, vertical: 5),
198+
padding: const EdgeInsets.symmetric(
199+
horizontal: 15, vertical: 5),
176200
child: Row(
177201
mainAxisAlignment: MainAxisAlignment.spaceBetween,
178202
children: [
179203
const Text("Dark Mode"),
180204
Switch(
181-
value: context.read<ThemeCubit>().state == ThemeMode.dark,
205+
value: context.read<ThemeCubit>().state ==
206+
ThemeMode.dark,
182207
onChanged: (val) {
183208
context.read<ThemeCubit>().toggleTheme(val);
184209
},
@@ -200,7 +225,7 @@ class AccountPage extends StatelessWidget {
200225
width: double.infinity,
201226
padding: const EdgeInsets.all(15),
202227
decoration: BoxDecoration(
203-
color: Theme.of(context).colorScheme.surfaceBright,
228+
color: Theme.of(context).colorScheme.surfaceContainer,
204229
borderRadius: const BorderRadius.all(Radius.circular(10)),
205230
),
206231
child: const Text(
@@ -218,7 +243,9 @@ class AccountPage extends StatelessWidget {
218243
Text(
219244
"(c) ${DateTime.now().year} TwoAxis. All Rights Reserved.",
220245
textAlign: TextAlign.center,
221-
style: TextStyle(color: Theme.of(context).colorScheme.onSurfaceVariant),
246+
style: TextStyle(
247+
color:
248+
Theme.of(context).colorScheme.onSurfaceVariant),
222249
),
223250
],
224251
),

mobile/lib/features/app_shell/presentation/widgets/navbar.dart

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ class Navbar extends StatelessWidget {
2727
showUnselectedLabels: true,
2828
selectedItemColor: Theme.of(context).colorScheme.primary,
2929
type: BottomNavigationBarType.fixed,
30-
unselectedItemColor: Color(0x44FFFFFF),
30+
unselectedItemColor: Theme.of(context).colorScheme.onSurfaceVariant,
3131
onTap: onTap,
3232
items: [
3333
BottomNavigationBarItem(

mobile/lib/features/dashboard/presentation/pages/dashboard.dart

Lines changed: 63 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import 'package:twoaxis_finance/app/theme_cubit.dart';
12
import 'package:twoaxis_finance/features/dashboard/presentation/widgets/dashboard_button.dart';
23
import 'package:twoaxis_finance/features/transactions/domain/transaction_type.dart';
34
import 'package:twoaxis_finance/features/transactions/presentation/bloc/transactions_bloc.dart';
@@ -26,23 +27,26 @@ class _DashboardPageState extends State<DashboardPage> {
2627

2728
@override
2829
Widget build(BuildContext context) {
29-
return BlocBuilder<UserCubit, UserState>(
30-
builder: (context, userState) {
31-
32-
if(userState is !UserStateAuthenticated) return const SizedBox();
30+
return BlocBuilder<UserCubit, UserState>(builder: (context, userState) {
31+
var user = (userState as UserStateAuthenticated).user;
3332

33+
return BlocBuilder<ThemeCubit, ThemeMode>(builder: (context, mode) {
3434
return Stack(
3535
children: [
36-
Container(
37-
height: 500,
38-
decoration: BoxDecoration(
39-
gradient: RadialGradient(
40-
colors: [Theme.of(context).colorScheme.primary, Colors.transparent],
41-
radius: 1,
42-
center: Alignment.topCenter,
36+
if (mode == ThemeMode.dark)
37+
Container(
38+
height: 500,
39+
decoration: BoxDecoration(
40+
gradient: RadialGradient(
41+
colors: [
42+
Theme.of(context).colorScheme.primary,
43+
Colors.transparent
44+
],
45+
radius: 1,
46+
center: Alignment.topCenter,
47+
),
4348
),
4449
),
45-
),
4650
Container(
4751
padding: const EdgeInsets.all(20),
4852
child: Column(
@@ -68,7 +72,9 @@ class _DashboardPageState extends State<DashboardPage> {
6872
width: 120,
6973
height: 40,
7074
decoration: BoxDecoration(
71-
color: Theme.of(context).colorScheme.surfaceContainer,
75+
color: Theme.of(context)
76+
.colorScheme
77+
.surfaceContainer,
7278
borderRadius: BorderRadius.circular(5),
7379
),
7480
),
@@ -77,10 +83,15 @@ class _DashboardPageState extends State<DashboardPage> {
7783
Text(
7884
formatMoneyWithContext(
7985
context,
80-
userState.user.balances.fold<double>(
81-
0, (sum, balance) => sum + balance.value)),
82-
style: const TextStyle(
83-
fontWeight: FontWeight.bold, fontSize: 40),
86+
user.balances.fold<double>(0,
87+
(sum, balance) => sum + balance.value)),
88+
style: TextStyle(
89+
fontWeight: FontWeight.bold,
90+
fontSize: 40,
91+
color: mode == ThemeMode.dark
92+
? Theme.of(context).colorScheme.onSurface
93+
: Theme.of(context).colorScheme.primary,
94+
),
8495
),
8596
IconButton(
8697
onPressed: () {
@@ -124,7 +135,7 @@ class _DashboardPageState extends State<DashboardPage> {
124135
decoration: BoxDecoration(
125136
color: Colors.grey[300],
126137
borderRadius:
127-
BorderRadius.circular(2),
138+
BorderRadius.circular(2),
128139
),
129140
),
130141
const SizedBox(
@@ -164,7 +175,8 @@ class _DashboardPageState extends State<DashboardPage> {
164175
Navigator.push(
165176
context,
166177
MaterialPageRoute(
167-
builder: (context) => const AnalyticsPage()));
178+
builder: (context) =>
179+
const AnalyticsPage()));
168180
},
169181
),
170182
DashboardButton(
@@ -174,7 +186,8 @@ class _DashboardPageState extends State<DashboardPage> {
174186
Navigator.push(
175187
context,
176188
MaterialPageRoute(
177-
builder: (context) => const BudgetPage()));
189+
builder: (context) =>
190+
const BudgetPage()));
178191
},
179192
),
180193
],
@@ -198,9 +211,9 @@ class _DashboardPageState extends State<DashboardPage> {
198211
children: [
199212
Expanded(
200213
child: Text(
201-
"Recent Transactions",
202-
style: TextStyle(fontSize: 15),
203-
)),
214+
"Recent Transactions",
215+
style: TextStyle(fontSize: 15),
216+
)),
204217
Icon(Icons.arrow_forward_ios)
205218
],
206219
),
@@ -215,11 +228,13 @@ class _DashboardPageState extends State<DashboardPage> {
215228
return const Center(
216229
child: CircularProgressIndicator(),
217230
);
218-
} else if (transactionsState is TransactionsStateError) {
231+
} else if (transactionsState
232+
is TransactionsStateError) {
219233
return Center(
220234
child: Text(transactionsState.message),
221235
);
222-
} else if (transactionsState is TransactionsStateLoaded) {
236+
} else if (transactionsState
237+
is TransactionsStateLoaded) {
223238
if (transactionsState.transactions.isEmpty) {
224239
return Center(
225240
child: Column(
@@ -248,9 +263,10 @@ class _DashboardPageState extends State<DashboardPage> {
248263
}
249264
return ListView.separated(
250265
padding: EdgeInsets.zero,
251-
itemCount: transactionsState.transactions.length <= 30
252-
? transactionsState.transactions.length
253-
: 30,
266+
itemCount:
267+
transactionsState.transactions.length <= 30
268+
? transactionsState.transactions.length
269+
: 30,
254270
itemBuilder: (context, index) {
255271
var item = transactionsState.transactions[index];
256272
return Row(
@@ -259,25 +275,26 @@ class _DashboardPageState extends State<DashboardPage> {
259275
Container(
260276
padding: const EdgeInsets.all(10),
261277
decoration: BoxDecoration(
262-
color: Theme.of(context).colorScheme.surfaceBright,
278+
color: Theme.of(context)
279+
.colorScheme
280+
.surfaceBright,
263281
borderRadius:
264-
BorderRadius.circular(10)),
282+
BorderRadius.circular(10)),
265283
child: Icon(
266284
getCategoryIcon(
267285
item.category,
268286
defaultIcon:
269-
item.type ==
270-
TransactionType.expense
271-
? Icons.payments_rounded
272-
: Icons.file_download_rounded,
287+
item.type == TransactionType.expense
288+
? Icons.payments_rounded
289+
: Icons.file_download_rounded,
273290
),
274291
size: 25,
275292
),
276293
),
277294
Expanded(
278295
child: Column(
279296
crossAxisAlignment:
280-
CrossAxisAlignment.start,
297+
CrossAxisAlignment.start,
281298
children: [
282299
Text(item.name),
283300
Text(
@@ -289,17 +306,17 @@ class _DashboardPageState extends State<DashboardPage> {
289306
],
290307
),
291308
),
292-
if (item.type ==
293-
TransactionType.expense)
309+
if (item.type == TransactionType.expense)
294310
Text(
295311
"-${formatMoneyWithContext(context, item.amount)}",
296312
style: TextStyle(
297-
color: Theme.of(context).colorScheme.primary,
313+
color: Theme.of(context)
314+
.colorScheme
315+
.primary,
298316
fontSize: 17,
299317
fontWeight: FontWeight.bold),
300318
)
301-
else if (item.type ==
302-
TransactionType.income)
319+
else if (item.type == TransactionType.income)
303320
Text(
304321
"+${formatMoneyWithContext(context, item.amount)}",
305322
style: const TextStyle(
@@ -313,7 +330,10 @@ class _DashboardPageState extends State<DashboardPage> {
313330
separatorBuilder:
314331
(BuildContext context, int index) {
315332
return Divider(
316-
color: Theme.of(context).colorScheme.surfaceBright, height: 20);
333+
color: Theme.of(context)
334+
.colorScheme
335+
.surfaceBright,
336+
height: 20);
317337
},
318338
);
319339
}
@@ -327,7 +347,7 @@ class _DashboardPageState extends State<DashboardPage> {
327347
)
328348
],
329349
);
330-
}
331-
);
350+
});
351+
});
332352
}
333353
}

mobile/lib/features/dashboard/presentation/widgets/dashboard_button.dart

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -18,8 +18,8 @@ class DashboardButton extends StatelessWidget {
1818
style: ElevatedButton.styleFrom(
1919
backgroundColor: Theme.of(context).colorScheme.surfaceContainer,
2020
shape: const CircleBorder(),
21-
elevation: 6, // Adjust for shadow depth
22-
padding: const EdgeInsets.all(16), // Ensures circular shape
21+
elevation: 6,
22+
padding: const EdgeInsets.all(16),
2323
),
2424
child: Icon(
2525
icon,
@@ -31,7 +31,7 @@ class DashboardButton extends StatelessWidget {
3131
textAlign: TextAlign.center,
3232
softWrap: true,
3333
style: TextStyle(
34-
color: Theme.of(context).colorScheme.onPrimary
34+
color: Theme.of(context).colorScheme.onSurface
3535
),
3636
),
3737
],

0 commit comments

Comments
 (0)