init

lib/pages/login.dart

@@ -0,0 +1,130 @@
+import 'package:flutter/material.dart';
+import 'package:google_fonts/google_fonts.dart';
+import 'package:kw_flutter/const.dart';
+
+class LoginPage extends StatelessWidget {
+  const LoginPage({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      backgroundColor: backgroundColor,
+      body: Stack(
+        children: [
+          Container(
+            padding: const EdgeInsets.fromLTRB(24, 32, 24, 8),
+            decoration: BoxDecoration(color: backgroundColor),
+            child: Column(
+              mainAxisSize: MainAxisSize.min,
+              children: [
+                _buildTextField(
+                  icon: Icons.person_outlined,
+                  hintText: '',
+                  isDarkMode: isDarkMode,
+                  inputBackgroundColor: inputBackgroundColor,
+                  subtleTextColor: subtleTextColor,
+                  textColor: textColor,
+                ),
+                const SizedBox(height: 24),
+                _buildTextField(
+                  icon: Icons.lock_outline,
+                  hintText: '',
+                  obscureText: true,
+                  isDarkMode: isDarkMode,
+                  inputBackgroundColor: inputBackgroundColor,
+                  subtleTextColor: subtleTextColor,
+                  textColor: textColor,
+                ),
+                SizedBox(height: 24),
+                ElevatedButton(
+                  onPressed: () {},
+                  style: ElevatedButton.styleFrom(
+                    backgroundColor: primaryColor,
+                    minimumSize: const Size(double.infinity, 60),
+                    shape: RoundedRectangleBorder(
+                      borderRadius: BorderRadius.circular(12),
+                    ),
+                    elevation: 0,
+                  ),
+                  child: Text(
+                    'Login',
+                    style: GoogleFonts.inter(
+                      color: Colors.white,
+                      fontWeight: FontWeight.bold,
+                      fontSize: 16,
+                    ),
+                  ),
+                ),
+                Container(
+                  color: backgroundColor,
+                  padding: const EdgeInsets.fromLTRB(24, 8, 24, 32),
+                  child: Row(
+                    mainAxisAlignment: MainAxisAlignment.center,
+                    children: [
+                      TextButton(
+                        onPressed: () {},
+                        child: Text(
+                          'Forgot password',
+                          style: GoogleFonts.inter(
+                            color: primaryColor,
+                            fontWeight: FontWeight.w400,
+                          ),
+                        ),
+                      ),
+                      const SizedBox(width:16),
+                      TextButton(
+                        onPressed: () {},
+                        child: Text(
+                          'sign up',
+                          style: GoogleFonts.inter(
+                            color: primaryColor,
+                            fontWeight: FontWeight.w400,
+                          ),
+                        ),
+                      )
+                    ],
+                  ),
+                ),
+              ],
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+}
+
+// ignore: non_constant_identifier_names
+Widget _buildTextField({
+  required IconData icon,
+  required String hintText,
+  bool obscureText = false,
+  required bool isDarkMode,
+  required Color inputBackgroundColor,
+  required Color subtleTextColor,
+  required Color textColor,
+}) {
+  return TextField(
+    obscureText: obscureText,
+    style: GoogleFonts.inter(color: textColor),
+    decoration: InputDecoration(
+      contentPadding: const EdgeInsets.symmetric(vertical: 20),
+      hintText: hintText,
+      hintStyle: GoogleFonts.inter(color: subtleTextColor),
+      prefixIcon: Padding(
+        padding: const EdgeInsets.only(left: 20, right: 12),
+        child: Icon(icon, color: subtleTextColor),
+      ),
+      filled: true,
+      fillColor: inputBackgroundColor,
+      border: OutlineInputBorder(
+        borderRadius: BorderRadius.circular(12),
+        borderSide: BorderSide.none,
+      ),
+      focusedBorder: OutlineInputBorder(
+        borderRadius: BorderRadius.circular(12),
+        borderSide: const BorderSide(color: Color(0xFF137FEC), width: 2),
+      ),
+    ),
+  );
+}