Skip to content

Commit 40e7c4a

Browse files
hoanghaozhoanghaoz
committed
fix conflict
2 parents f17dd00 + 7a77888 commit 40e7c4a

37 files changed

Lines changed: 3233 additions & 507 deletions

‎README.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,4 +22,4 @@ The application is built with a focus on performance, security, and clean code p
2222
For a deeper dive into our system design and development workflows, please explore the attached documentation:
2323
* [Flutter App Architecture](documentation/architecture/flutter-architecture.md)
2424
* [Database Schema & ERD](documentation/architecture/database-schema.md)
25-
* [Git & Conventional Commits Guidelines](documentation/guidelines/conventional-commit.md)
25+
* [Git & Conventional Commits Guidelines](documentation/guidelines/conventional-commit.md)

‎src/lib/core/theme/app_theme.dart‎

Lines changed: 87 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,87 @@
1+
import 'package:flutter/material.dart';
2+
3+
class AppTheme {
4+
// =========================================================
5+
// ☀️ LIGHT THEME DICTIONARY
6+
// Inherited from the legacy AppColors class
7+
// =========================================================
8+
static final ThemeData lightTheme = ThemeData(
9+
brightness: Brightness.light,
10+
scaffoldBackgroundColor: const Color(0xFFF4F6F9), // Legacy: AppColors.background
11+
12+
colorScheme: const ColorScheme.light(
13+
// Brand Colors
14+
primary: Color(0xFF5A8DF3), // Legacy: AppColors.primary
15+
secondary: Color(0xFF4A90E2), // Legacy: AppColors.primaryBlue
16+
17+
// Background & Surface Colors
18+
// Note: 'background' is deprecated, scaffoldBackgroundColor handles the main background.
19+
surface: Colors.white, // Legacy: AppColors.taskCardBg / white
20+
surfaceContainerHighest: Color(0xFFE0F7FA), // Legacy: AppColors.backgroundBlue (Tinted background)
21+
22+
// Text Colors
23+
onSurface: Color(0xFF2D3440), // Legacy: AppColors.textDark
24+
onSurfaceVariant: Color(0xFF757575), // Legacy: AppColors.grayText / textSecondary
25+
26+
// Border & Status Colors
27+
outline: Color(0xFFE2E8F0), // Legacy: AppColors.border
28+
error: Colors.redAccent, // Legacy: AppColors.error
29+
tertiary: Colors.green, // Using Tertiary for Success (Green)
30+
),
31+
32+
appBarTheme: const AppBarTheme(
33+
backgroundColor: Colors.transparent,
34+
elevation: 0,
35+
iconTheme: IconThemeData(color: Color(0xFF5A8DF3)),
36+
titleTextStyle: TextStyle(
37+
color: Color(0xFF5A8DF3),
38+
fontWeight: FontWeight.w800,
39+
fontSize: 20,
40+
),
41+
),
42+
43+
dividerTheme: const DividerThemeData(color: Color(0xFFE2E8F0)),
44+
);
45+
46+
// =========================================================
47+
// 🌙 DARK THEME DICTIONARY
48+
// Extracted from the provided Stitch Design System
49+
// =========================================================
50+
static final ThemeData darkTheme = ThemeData(
51+
brightness: Brightness.dark,
52+
scaffoldBackgroundColor: const Color(0xFF0F172A), // Neutral Slate Dark
53+
54+
colorScheme: const ColorScheme.dark(
55+
// Brand Colors (Slightly brighter to stand out on dark background)
56+
primary: Color(0xFF60A5FA), // Bright Blue
57+
secondary: Color(0xFF61789A), // Slate Blue
58+
59+
// Background & Surface Colors
60+
// Note: 'background' is deprecated, scaffoldBackgroundColor handles the main background.
61+
surface: Color(0xFF1E293B), // Slightly lighter than background, used for Cards
62+
surfaceContainerHighest: Color(0xFF162032), // Dark mode counterpart for backgroundBlue
63+
64+
// Text Colors
65+
onSurface: Colors.white, // Primary text (White)
66+
onSurfaceVariant: Color(0xFF94A3B8), // Secondary text (Light Slate)
67+
68+
// Border, Status & Highlight Colors
69+
outline: Color(0xFF334155), // Faint Card Border
70+
error: Color(0xFFF87171), // Pinkish Red (Similar to Trash Icon)
71+
tertiary: Color(0xFFD19900), // Mustard Yellow (Similar to Edit Pencil Icon)
72+
),
73+
74+
appBarTheme: const AppBarTheme(
75+
backgroundColor: Colors.transparent,
76+
elevation: 0,
77+
iconTheme: IconThemeData(color: Color(0xFF60A5FA)),
78+
titleTextStyle: TextStyle(
79+
color: Color(0xFF60A5FA),
80+
fontWeight: FontWeight.w800,
81+
fontSize: 20,
82+
),
83+
),
84+
85+
dividerTheme: const DividerThemeData(color: Color(0xFF334155)),
86+
);
87+
}

‎src/lib/core/theme/auth_layout_template.dart‎

Lines changed: 111 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import 'package:flutter/material.dart';
2-
import 'app_colors.dart';
32

43
/// The master layout template for all authentication screens.
54
/// Handles the UI skeleton, loading states, backgrounds, and responsive scrolling.
@@ -35,105 +34,145 @@ class AuthLayoutTemplate extends StatelessWidget {
3534

3635
@override
3736
Widget build(BuildContext context) {
37+
final isDark = Theme.of(context).brightness == Brightness.dark;
38+
3839
return Scaffold(
39-
backgroundColor: AppColors.background,
40+
backgroundColor: Theme.of(context).scaffoldBackgroundColor,
4041
appBar: AppBar(
4142
backgroundColor: Colors.transparent,
4243
elevation: 0,
4344
leading: Navigator.canPop(context)
4445
? IconButton(
45-
icon: const Icon(Icons.arrow_back, color: AppColors.primary),
46+
icon: Container(
47+
width: 40,
48+
height: 40,
49+
decoration: BoxDecoration(
50+
shape: BoxShape.circle,
51+
color: isDark
52+
? const Color(0xFF172744)
53+
: Theme.of(context).colorScheme.surface,
54+
),
55+
child: Icon(
56+
Icons.arrow_back,
57+
color: Theme.of(context).colorScheme.primary,
58+
),
59+
),
4660
onPressed: () => Navigator.pop(context),
4761
)
4862
: null,
4963
),
50-
body: SafeArea(
51-
child: Center(
52-
child: SingleChildScrollView(
53-
padding: const EdgeInsets.fromLTRB(24.0, 16.0, 24.0, 48.0),
54-
child: Column(
55-
mainAxisAlignment: MainAxisAlignment.center,
56-
children: [
57-
_buildHeader(),
58-
const SizedBox(height: 32),
59-
useCard ? _buildCardContainer() : _buildTransparentContainer(),
60-
const SizedBox(height: 32),
61-
if (footerContent != null) footerContent!,
62-
],
64+
body: Container(
65+
decoration: BoxDecoration(
66+
gradient: isDark
67+
? const LinearGradient(
68+
begin: Alignment.topCenter,
69+
end: Alignment.bottomCenter,
70+
colors: [Color(0xFF08142D), Color(0xFF0B1A38), Color(0xFF0A1834)],
71+
)
72+
: null,
73+
),
74+
child: SafeArea(
75+
child: Center(
76+
child: SingleChildScrollView(
77+
padding: const EdgeInsets.fromLTRB(24.0, 16.0, 24.0, 48.0),
78+
child: Column(
79+
mainAxisAlignment: MainAxisAlignment.center,
80+
children: [
81+
_buildHeader(context),
82+
const SizedBox(height: 32),
83+
useCard
84+
? _buildCardContainer(context)
85+
: _buildTransparentContainer(context),
86+
const SizedBox(height: 32),
87+
if (footerContent != null) footerContent!,
88+
],
89+
),
6390
),
6491
),
6592
),
6693
),
6794
);
6895
}
6996

70-
Widget _buildHeader() {
97+
Widget _buildHeader(BuildContext context) {
98+
final isDark = Theme.of(context).brightness == Brightness.dark;
99+
71100
return Column(
72101
children: [
73102
customHeaderIcon ??
74103
Container(
75104
width: 80,
76105
height: 80,
77106
decoration: BoxDecoration(
78-
color: AppColors.white,
107+
color: isDark ? const Color(0xFF1E2B47) : Theme.of(context).colorScheme.surface,
79108
borderRadius: BorderRadius.circular(24),
80109
boxShadow: [
81110
BoxShadow(
82-
color: AppColors.primary.withOpacity(0.1),
111+
color: Theme.of(context).colorScheme.primary.withValues(alpha: 0.14),
83112
blurRadius: 20,
84113
offset: const Offset(0, 10),
85114
),
86115
],
87116
),
88-
child: const Center(
89-
child: Icon(Icons.task_alt, size: 48, color: AppColors.primary),
117+
child: Center(
118+
child: Icon(
119+
Icons.task_alt,
120+
size: 48,
121+
color: Theme.of(context).colorScheme.primary,
122+
),
90123
),
91124
),
92125
const SizedBox(height: 24),
93126
Text(
94127
title,
95-
style: const TextStyle(
128+
style: TextStyle(
96129
fontSize: 28,
97130
fontWeight: FontWeight.w800,
98-
color: AppColors.textDark,
131+
color: Theme.of(context).colorScheme.onSurface,
99132
letterSpacing: -0.5,
100133
),
101134
),
102135
const SizedBox(height: 8),
103136
Text(
104137
subtitle,
105-
style: const TextStyle(
138+
style: TextStyle(
106139
fontSize: 14,
107140
fontWeight: FontWeight.w500,
108-
color: AppColors.textSecondary,
141+
color: Theme.of(context).colorScheme.onSurfaceVariant,
109142
),
110143
textAlign: TextAlign.center,
111144
),
112145
],
113146
);
114147
}
115148

116-
Widget _buildCardContainer() {
149+
Widget _buildCardContainer(BuildContext context) {
150+
final isDark = Theme.of(context).brightness == Brightness.dark;
151+
117152
return Container(
118153
padding: const EdgeInsets.all(32),
119154
decoration: BoxDecoration(
120-
color: AppColors.white,
155+
color: isDark ? const Color(0xFF1A2945) : Theme.of(context).colorScheme.surface,
121156
borderRadius: BorderRadius.circular(32),
157+
border: isDark ? Border.all(color: const Color(0xFF2A3E62), width: 1) : null,
122158
boxShadow: [
123159
BoxShadow(
124-
color: AppColors.primary.withOpacity(0.08),
160+
color: Theme.of(context).colorScheme.primary.withValues(alpha: 0.12),
125161
blurRadius: 30,
126162
offset: const Offset(0, 10),
127163
),
128164
],
129165
),
130-
child: _buildFormElements(),
166+
child: _buildFormElements(context),
131167
);
132168
}
133169

134-
Widget _buildTransparentContainer() => _buildFormElements();
170+
Widget _buildTransparentContainer(BuildContext context) =>
171+
_buildFormElements(context);
172+
173+
Widget _buildFormElements(BuildContext context) {
174+
final isDark = Theme.of(context).brightness == Brightness.dark;
135175

136-
Widget _buildFormElements() {
137176
return Column(
138177
crossAxisAlignment: CrossAxisAlignment.stretch,
139178
children: [
@@ -143,20 +182,24 @@ class AuthLayoutTemplate extends StatelessWidget {
143182
// Disable button if loading
144183
onPressed: isLoading ? null : onSubmit,
145184
style: ElevatedButton.styleFrom(
146-
backgroundColor: AppColors.primary,
147-
disabledBackgroundColor: AppColors.primary.withOpacity(0.6),
185+
backgroundColor: Theme.of(context).colorScheme.primary,
186+
disabledBackgroundColor:
187+
Theme.of(context).colorScheme.primary.withValues(alpha: 0.6),
148188
padding: const EdgeInsets.symmetric(vertical: 20),
149189
shape: RoundedRectangleBorder(
150190
borderRadius: BorderRadius.circular(16),
151191
),
152-
elevation: isLoading ? 0 : 4,
192+
elevation: isLoading ? 0 : (isDark ? 8 : 4),
193+
shadowColor: isDark
194+
? Theme.of(context).colorScheme.primary.withValues(alpha: 0.35)
195+
: null,
153196
),
154197
child: isLoading
155-
? const SizedBox(
198+
? SizedBox(
156199
height: 20,
157200
width: 20,
158201
child: CircularProgressIndicator(
159-
color: AppColors.white,
202+
color: Theme.of(context).colorScheme.surface,
160203
strokeWidth: 2,
161204
),
162205
)
@@ -165,45 +208,59 @@ class AuthLayoutTemplate extends StatelessWidget {
165208
children: [
166209
Text(
167210
submitText,
168-
style: const TextStyle(
211+
style: TextStyle(
169212
fontSize: 16,
170213
fontWeight: FontWeight.bold,
171-
color: AppColors.white,
214+
color: Theme.of(context).colorScheme.surface,
172215
),
173216
),
174217
const SizedBox(width: 8),
175-
const Icon(
218+
Icon(
176219
Icons.arrow_forward,
177-
color: AppColors.white,
220+
color: Theme.of(context).colorScheme.surface,
178221
size: 20,
179222
),
180223
],
181224
),
182225
),
183226
if (showSocial) ...[
184227
const SizedBox(height: 32),
185-
const Row(
228+
Row(
186229
children: [
187-
Expanded(child: Divider(color: AppColors.border)),
230+
Expanded(
231+
child: Divider(color: Theme.of(context).colorScheme.outline),
232+
),
188233
Padding(
189234
padding: EdgeInsets.symmetric(horizontal: 16),
190235
child: Text(
191236
'OR',
192237
style: TextStyle(
193238
fontSize: 10,
194239
fontWeight: FontWeight.bold,
195-
color: AppColors.textSecondary,
240+
color: Theme.of(context).colorScheme.onSurfaceVariant,
196241
),
197242
),
198243
),
199-
Expanded(child: Divider(color: AppColors.border)),
244+
Expanded(
245+
child: Divider(color: Theme.of(context).colorScheme.outline),
246+
),
200247
],
201248
),
202249
const SizedBox(height: 24),
203250
Row(
204251
children: [
205252
Expanded(
206253
child: OutlinedButton.icon(
254+
style: OutlinedButton.styleFrom(
255+
foregroundColor: Theme.of(context).colorScheme.onSurface,
256+
side: BorderSide(color: Theme.of(context).colorScheme.outline),
257+
backgroundColor:
258+
isDark ? const Color(0xFF1A2945) : Theme.of(context).colorScheme.surface,
259+
shape: RoundedRectangleBorder(
260+
borderRadius: BorderRadius.circular(16),
261+
),
262+
padding: const EdgeInsets.symmetric(vertical: 14),
263+
),
207264
onPressed: onGoogleTap,
208265
icon: const Icon(
209266
Icons.g_mobiledata,
@@ -216,6 +273,16 @@ class AuthLayoutTemplate extends StatelessWidget {
216273
const SizedBox(width: 16),
217274
Expanded(
218275
child: OutlinedButton.icon(
276+
style: OutlinedButton.styleFrom(
277+
foregroundColor: Theme.of(context).colorScheme.onSurface,
278+
side: BorderSide(color: Theme.of(context).colorScheme.outline),
279+
backgroundColor:
280+
isDark ? const Color(0xFF1A2945) : Theme.of(context).colorScheme.surface,
281+
shape: RoundedRectangleBorder(
282+
borderRadius: BorderRadius.circular(16),
283+
),
284+
padding: const EdgeInsets.symmetric(vertical: 14),
285+
),
219286
onPressed: onFacebookTap,
220287
icon: const Icon(Icons.facebook, color: Color(0xFF1877F2)),
221288
label: const Text('Facebook'),

0 commit comments

Comments
 (0)