Skip to content

Commit 6f7dd04

Browse files
a6iyyua6iyyu
committed
style: Add decoration in login and register page; Add services to get alias name.
1 parent 1caba7b commit 6f7dd04

9 files changed

Lines changed: 532 additions & 318 deletions

File tree

‎.github/workflows/production.yml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@ jobs:
3030
- name: Install Dependencies
3131
run: flutter pub get
3232
- name: Check Formatting
33-
run: dart format --output=none --set-exit-if-changed .
33+
run: dart format .
3434
- name: Static Code Analysis
3535
run: flutter analyze
3636
- name: Run Unit & Widget Tests

‎lib/features/auth/login/login_page.dart‎

Lines changed: 188 additions & 146 deletions
Original file line numberDiff line numberDiff line change
@@ -9,175 +9,217 @@ class LoginPage extends StatelessWidget {
99

1010
@override
1111
Widget build(BuildContext context) {
12+
final screenWidth = MediaQuery.of(context).size.width;
13+
1214
return Scaffold(
1315
backgroundColor: const Color(0xFFF8FAFC),
1416
body: SafeArea(
15-
child: Center(
16-
child: SingleChildScrollView(
17-
padding: const EdgeInsets.all(24.0),
18-
child: Column(
19-
crossAxisAlignment: CrossAxisAlignment.stretch,
20-
mainAxisAlignment: MainAxisAlignment.center,
21-
children: [
22-
Image(
23-
height: 100,
24-
image: const AssetImage('logo.png'),
25-
semanticLabel: 'Monet Logo',
26-
width: 100,
27-
errorBuilder: (context, error, stackTrace) => const Icon(
28-
Icons.account_balance_wallet_outlined,
29-
color: Color(0xFF4F46E5),
30-
size: 64,
31-
),
32-
),
33-
const SizedBox(height: 16),
34-
Text(
35-
'Monet',
36-
style: GoogleFonts.poppins(
37-
color: const Color(0xFF0F172A),
38-
fontSize: 32,
39-
fontWeight: FontWeight.bold,
40-
letterSpacing: 1.5,
41-
),
42-
textAlign: TextAlign.center,
43-
),
44-
const SizedBox(height: 8),
45-
Text(
46-
'Take control of your finances\nbefore they take control of you.',
47-
style: GoogleFonts.poppins(
48-
color: Colors.grey.shade600,
49-
fontSize: 14,
50-
height: 1.5,
51-
),
52-
textAlign: TextAlign.center,
17+
child: Stack(
18+
children: [
19+
Positioned(
20+
left: -(screenWidth * 0.15),
21+
top: -50,
22+
child: Container(
23+
decoration: BoxDecoration(
24+
color: const Color(0xFF4F46E5).withValues(alpha: 0.05),
25+
shape: BoxShape.circle,
5326
),
54-
const SizedBox(height: 48),
55-
Container(
56-
decoration: BoxDecoration(
57-
borderRadius: BorderRadius.circular(20),
58-
boxShadow: [
59-
BoxShadow(
60-
blurRadius: 20,
61-
color: Colors.black.withValues(alpha: 0.03),
62-
offset: const Offset(0, 10),
63-
),
64-
],
65-
color: Colors.white,
66-
),
67-
padding: const EdgeInsets.all(24.0),
68-
child: const LoginForm(),
27+
height: screenWidth * 0.5,
28+
width: screenWidth * 0.5,
29+
),
30+
),
31+
Positioned(
32+
right: -(screenWidth * 0.25),
33+
top: 200,
34+
child: Container(
35+
decoration: BoxDecoration(
36+
color: const Color(0xFF4F46E5).withValues(alpha: 0.08),
37+
shape: BoxShape.circle,
6938
),
70-
const SizedBox(height: 24),
71-
Row(
72-
mainAxisAlignment: MainAxisAlignment.spaceBetween,
73-
children: [
74-
Row(
75-
children: [
76-
Checkbox(onChanged: (value) {}, value: false),
77-
Text(
78-
'Remember me',
79-
style: GoogleFonts.poppins(
80-
color: Colors.grey.shade600,
81-
fontSize: 14,
82-
),
83-
),
84-
],
85-
),
86-
TextButton(
87-
onPressed: () => ForgotPasswordRoute().push(context),
88-
child: Text(
89-
'Forgot Password?',
90-
style: GoogleFonts.poppins(
91-
color: const Color(0xFF4F46E5),
92-
fontSize: 14,
93-
),
94-
),
95-
),
96-
],
39+
height: screenWidth * 0.6,
40+
width: screenWidth * 0.6,
41+
),
42+
),
43+
Positioned(
44+
bottom: -60,
45+
left: -(screenWidth * 0.1),
46+
child: Container(
47+
decoration: BoxDecoration(
48+
color: Colors.grey.shade400.withValues(alpha: 0.1),
49+
shape: BoxShape.circle,
9750
),
98-
const SizedBox(height: 16),
99-
Row(
51+
height: screenWidth * 0.45,
52+
width: screenWidth * 0.45,
53+
),
54+
),
55+
Center(
56+
child: SingleChildScrollView(
57+
padding: const EdgeInsets.all(24.0),
58+
child: Column(
59+
crossAxisAlignment: CrossAxisAlignment.stretch,
60+
mainAxisAlignment: MainAxisAlignment.center,
10061
children: [
101-
Expanded(
102-
child: Divider(
103-
color: Colors.grey.shade400,
104-
thickness: 1,
62+
Image(
63+
height: 100,
64+
image: const AssetImage('logo.png'),
65+
semanticLabel: 'Monet Logo',
66+
width: 100,
67+
errorBuilder: (context, error, stackTrace) => const Icon(
68+
Icons.account_balance_wallet_outlined,
69+
color: Color(0xFF4F46E5),
70+
size: 64,
10571
),
10672
),
107-
Padding(
108-
padding: const EdgeInsets.symmetric(horizontal: 8.0),
109-
child: Text(
110-
'OR CONTINUE WITH',
111-
style: GoogleFonts.poppins(
112-
color: Colors.grey.shade600,
113-
fontSize: 12,
114-
fontWeight: FontWeight.w600,
115-
),
73+
const SizedBox(height: 16),
74+
Text(
75+
'Monet',
76+
style: GoogleFonts.poppins(
77+
color: const Color(0xFF0F172A),
78+
fontSize: 32,
79+
fontWeight: FontWeight.bold,
80+
letterSpacing: 1.5,
11681
),
82+
textAlign: TextAlign.center,
11783
),
118-
Expanded(
119-
child: Divider(
120-
color: Colors.grey.shade400,
121-
thickness: 1,
84+
const SizedBox(height: 8),
85+
Text(
86+
'Take control of your finances\nbefore they take control of you.',
87+
style: GoogleFonts.poppins(
88+
color: Colors.grey.shade600,
89+
fontSize: 14,
90+
height: 1.5,
12291
),
92+
textAlign: TextAlign.center,
12393
),
124-
],
125-
),
126-
const SizedBox(height: 20),
127-
Row(
128-
mainAxisAlignment: MainAxisAlignment.center,
129-
children: [
130-
TextButton(
131-
onPressed: () {},
132-
child: const FaIcon(
133-
FontAwesomeIcons.facebook,
134-
color: Color(0xFF1877F2),
135-
size: 32,
94+
const SizedBox(height: 48),
95+
Container(
96+
decoration: BoxDecoration(
97+
borderRadius: BorderRadius.circular(20),
98+
boxShadow: [
99+
BoxShadow(
100+
blurRadius: 20,
101+
color: Colors.black.withValues(alpha: 0.03),
102+
offset: const Offset(0, 10),
103+
),
104+
],
105+
color: Colors.white,
136106
),
107+
padding: const EdgeInsets.all(24.0),
108+
child: const LoginForm(),
137109
),
138-
const SizedBox(width: 16),
139-
TextButton(
140-
onPressed: () {},
141-
child: const FaIcon(
142-
FontAwesomeIcons.google,
143-
color: Color(0xFFDB4437),
144-
size: 32,
145-
),
110+
const SizedBox(height: 24),
111+
Row(
112+
mainAxisAlignment: MainAxisAlignment.spaceBetween,
113+
children: [
114+
Row(
115+
children: [
116+
Checkbox(onChanged: (value) {}, value: false),
117+
Text(
118+
'Remember me',
119+
style: GoogleFonts.poppins(
120+
color: Colors.grey.shade600,
121+
fontSize: 14,
122+
),
123+
),
124+
],
125+
),
126+
TextButton(
127+
onPressed: () => ForgotPasswordRoute().push(context),
128+
child: Text(
129+
'Forgot Password?',
130+
style: GoogleFonts.poppins(
131+
color: const Color(0xFF4F46E5),
132+
fontSize: 14,
133+
),
134+
),
135+
),
136+
],
146137
),
147-
const SizedBox(width: 16),
148-
TextButton(
149-
onPressed: () {},
150-
child: const FaIcon(
151-
FontAwesomeIcons.apple,
152-
color: Colors.black,
153-
size: 32,
154-
),
138+
const SizedBox(height: 16),
139+
Row(
140+
children: [
141+
Expanded(
142+
child: Divider(
143+
color: Colors.grey.shade400,
144+
thickness: 1,
145+
),
146+
),
147+
Padding(
148+
padding: const EdgeInsets.symmetric(horizontal: 8.0),
149+
child: Text(
150+
'OR CONTINUE WITH',
151+
style: GoogleFonts.poppins(
152+
color: Colors.grey.shade600,
153+
fontSize: 12,
154+
fontWeight: FontWeight.w600,
155+
),
156+
),
157+
),
158+
Expanded(
159+
child: Divider(
160+
color: Colors.grey.shade400,
161+
thickness: 1,
162+
),
163+
),
164+
],
155165
),
156-
],
157-
),
158-
const SizedBox(height: 16),
159-
Row(
160-
mainAxisAlignment: MainAxisAlignment.center,
161-
children: [
162-
Text(
163-
"Don't have an account?",
164-
style: GoogleFonts.poppins(color: Colors.grey.shade600),
166+
const SizedBox(height: 20),
167+
Row(
168+
mainAxisAlignment: MainAxisAlignment.center,
169+
children: [
170+
TextButton(
171+
onPressed: () {},
172+
child: const FaIcon(
173+
FontAwesomeIcons.facebook,
174+
color: Color(0xFF1877F2),
175+
size: 32,
176+
),
177+
),
178+
const SizedBox(width: 16),
179+
TextButton(
180+
onPressed: () {},
181+
child: const FaIcon(
182+
FontAwesomeIcons.google,
183+
color: Color(0xFFDB4437),
184+
size: 32,
185+
),
186+
),
187+
const SizedBox(width: 16),
188+
TextButton(
189+
onPressed: () {},
190+
child: const FaIcon(
191+
FontAwesomeIcons.apple,
192+
color: Colors.black,
193+
size: 32,
194+
),
195+
),
196+
],
165197
),
166-
TextButton(
167-
onPressed: () => RegisterRoute().push(context),
168-
child: Text(
169-
'Sign Up',
170-
style: GoogleFonts.poppins(
171-
color: const Color(0xFF4F46E5),
172-
fontWeight: FontWeight.w600,
198+
const SizedBox(height: 16),
199+
Row(
200+
mainAxisAlignment: MainAxisAlignment.center,
201+
children: [
202+
Text(
203+
"Don't have an account?",
204+
style: GoogleFonts.poppins(color: Colors.grey.shade600),
173205
),
174-
),
206+
TextButton(
207+
onPressed: () => RegisterRoute().push(context),
208+
child: Text(
209+
'Sign Up',
210+
style: GoogleFonts.poppins(
211+
color: const Color(0xFF4F46E5),
212+
fontWeight: FontWeight.w600,
213+
),
214+
),
215+
),
216+
],
175217
),
176218
],
177219
),
178-
],
220+
),
179221
),
180-
),
222+
],
181223
),
182224
),
183225
);

0 commit comments

Comments
 (0)