Skip to content

Commit d3fc954

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

File tree

4 files changed

+116
-65
lines changed

4 files changed

+116
-65
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: 68 additions & 44 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: () {
@@ -91,7 +102,11 @@ class _DashboardPageState extends State<DashboardPage> {
91102
color: Colors.white,
92103
icon: Icon(isHidden
93104
? Icons.visibility_outlined
94-
: Icons.visibility_off_outlined),
105+
: Icons.visibility_off_outlined,
106+
color: Theme.of(context)
107+
.colorScheme
108+
.onSurface,
109+
),
95110
),
96111
],
97112
),
@@ -124,7 +139,7 @@ class _DashboardPageState extends State<DashboardPage> {
124139
decoration: BoxDecoration(
125140
color: Colors.grey[300],
126141
borderRadius:
127-
BorderRadius.circular(2),
142+
BorderRadius.circular(2),
128143
),
129144
),
130145
const SizedBox(
@@ -164,7 +179,8 @@ class _DashboardPageState extends State<DashboardPage> {
164179
Navigator.push(
165180
context,
166181
MaterialPageRoute(
167-
builder: (context) => const AnalyticsPage()));
182+
builder: (context) =>
183+
const AnalyticsPage()));
168184
},
169185
),
170186
DashboardButton(
@@ -174,7 +190,8 @@ class _DashboardPageState extends State<DashboardPage> {
174190
Navigator.push(
175191
context,
176192
MaterialPageRoute(
177-
builder: (context) => const BudgetPage()));
193+
builder: (context) =>
194+
const BudgetPage()));
178195
},
179196
),
180197
],
@@ -198,9 +215,9 @@ class _DashboardPageState extends State<DashboardPage> {
198215
children: [
199216
Expanded(
200217
child: Text(
201-
"Recent Transactions",
202-
style: TextStyle(fontSize: 15),
203-
)),
218+
"Recent Transactions",
219+
style: TextStyle(fontSize: 15),
220+
)),
204221
Icon(Icons.arrow_forward_ios)
205222
],
206223
),
@@ -215,11 +232,13 @@ class _DashboardPageState extends State<DashboardPage> {
215232
return const Center(
216233
child: CircularProgressIndicator(),
217234
);
218-
} else if (transactionsState is TransactionsStateError) {
235+
} else if (transactionsState
236+
is TransactionsStateError) {
219237
return Center(
220238
child: Text(transactionsState.message),
221239
);
222-
} else if (transactionsState is TransactionsStateLoaded) {
240+
} else if (transactionsState
241+
is TransactionsStateLoaded) {
223242
if (transactionsState.transactions.isEmpty) {
224243
return Center(
225244
child: Column(
@@ -248,9 +267,10 @@ class _DashboardPageState extends State<DashboardPage> {
248267
}
249268
return ListView.separated(
250269
padding: EdgeInsets.zero,
251-
itemCount: transactionsState.transactions.length <= 30
252-
? transactionsState.transactions.length
253-
: 30,
270+
itemCount:
271+
transactionsState.transactions.length <= 30
272+
? transactionsState.transactions.length
273+
: 30,
254274
itemBuilder: (context, index) {
255275
var item = transactionsState.transactions[index];
256276
return Row(
@@ -259,25 +279,26 @@ class _DashboardPageState extends State<DashboardPage> {
259279
Container(
260280
padding: const EdgeInsets.all(10),
261281
decoration: BoxDecoration(
262-
color: Theme.of(context).colorScheme.surfaceBright,
282+
color: Theme.of(context)
283+
.colorScheme
284+
.surfaceBright,
263285
borderRadius:
264-
BorderRadius.circular(10)),
286+
BorderRadius.circular(10)),
265287
child: Icon(
266288
getCategoryIcon(
267289
item.category,
268290
defaultIcon:
269-
item.type ==
270-
TransactionType.expense
271-
? Icons.payments_rounded
272-
: Icons.file_download_rounded,
291+
item.type == TransactionType.expense
292+
? Icons.payments_rounded
293+
: Icons.file_download_rounded,
273294
),
274295
size: 25,
275296
),
276297
),
277298
Expanded(
278299
child: Column(
279300
crossAxisAlignment:
280-
CrossAxisAlignment.start,
301+
CrossAxisAlignment.start,
281302
children: [
282303
Text(item.name),
283304
Text(
@@ -289,17 +310,17 @@ class _DashboardPageState extends State<DashboardPage> {
289310
],
290311
),
291312
),
292-
if (item.type ==
293-
TransactionType.expense)
313+
if (item.type == TransactionType.expense)
294314
Text(
295315
"-${formatMoneyWithContext(context, item.amount)}",
296316
style: TextStyle(
297-
color: Theme.of(context).colorScheme.primary,
317+
color: Theme.of(context)
318+
.colorScheme
319+
.primary,
298320
fontSize: 17,
299321
fontWeight: FontWeight.bold),
300322
)
301-
else if (item.type ==
302-
TransactionType.income)
323+
else if (item.type == TransactionType.income)
303324
Text(
304325
"+${formatMoneyWithContext(context, item.amount)}",
305326
style: const TextStyle(
@@ -313,7 +334,10 @@ class _DashboardPageState extends State<DashboardPage> {
313334
separatorBuilder:
314335
(BuildContext context, int index) {
315336
return Divider(
316-
color: Theme.of(context).colorScheme.surfaceBright, height: 20);
337+
color: Theme.of(context)
338+
.colorScheme
339+
.surfaceBright,
340+
height: 20);
317341
},
318342
);
319343
}
@@ -327,7 +351,7 @@ class _DashboardPageState extends State<DashboardPage> {
327351
)
328352
],
329353
);
330-
}
331-
);
354+
});
355+
});
332356
}
333357
}

‎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)