Update templates/login.html

templates/login.html

@@ -8,7 +8,7 @@
     <style>
         body {
             font-family: 'Arial', sans-serif;
-            background: linear-gradient(135deg, #ff7043, #ffca28); /* Gradient background */
+            background: linear-gradient(135deg, #66bb6a, #388e3c); /* Green gradient */
             display: flex;
             justify-content: center;
             align-items: center;
@@ -18,16 +18,15 @@
         .login-container {
             background-color: #ffffff;
             padding: 40px;
-            border-radius: 15px;
+            border-radius: 20px;
             box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
             width: 100%;
             max-width: 400px;
             text-align: center;
-            background-color: rgba(255, 255, 255, 0.9);
         }
         .login-container h1 {
             font-size: 30px;
-            color: #8d6e63; /* Warm brown */
+            color: #388e3c; /* Dark green */
             margin-bottom: 20px;
             font-family: 'Courier New', Courier, monospace;
         }
@@ -41,30 +40,30 @@
             font-size: 16px;
             border-radius: 25px;
             border: 1px solid #ccc;
-            background-color: #f8e0c2;
+            background-color: #f1f8e9; /* Light green background */
             outline: none;
             text-align: center;
         }
         .input-group input:focus {
-            border-color: #ff7043;
+            border-color: #388e3c; /* Dark green on focus */
         }
         button {
             width: 100%;
             padding: 14px;
             font-size: 16px;
             border-radius: 30px;
-            background: #ff7043;
+            background: linear-gradient(135deg, #66bb6a, #388e3c); /* Green gradient button */
             color: white;
             border: none;
             cursor: pointer;
             transition: background-color 0.3s ease;
         }
         button:hover {
-            background: #f4511e;
+            background: linear-gradient(135deg, #388e3c, #66bb6a); /* Darker green on hover */
         }
         .forgot-link {
             font-size: 12px;
-            color: #ff7043;
+            color: #388e3c;
             text-decoration: none;
             margin-top: 10px;
         }
@@ -74,10 +73,10 @@
         .register-link {
             margin-top: 15px;
             font-size: 12px;
-            color: #8d6e63;
+            color: #388e3c;
         }
         .register-link a {
-            color: #ff7043;
+            color: #388e3c;
             text-decoration: none;
         }
         .register-link a:hover {