simar007 commited on
Commit
91d6f3c
·
verified ·
1 Parent(s): 4e5d2ea

Update style.css

Browse files
Files changed (1) hide show
  1. style.css +58 -24
style.css CHANGED
@@ -1,54 +1,88 @@
 
 
 
 
 
1
  body {
2
- font-family: Arial, sans-serif;
3
- background: #f5f5f5;
 
 
4
  display: flex;
5
  justify-content: center;
6
  align-items: center;
7
- height: 100vh;
8
- margin: 0;
9
  }
10
 
11
- .login-container {
12
- background: white;
13
  padding: 30px 40px;
14
- border-radius: 8px;
15
- box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
16
  width: 100%;
17
  max-width: 400px;
18
- box-sizing: border-box;
 
 
 
 
19
  }
20
 
21
- .login-container h2 {
22
- margin-bottom: 20px;
23
- text-align: center;
 
24
  }
25
 
26
  input {
27
  width: 100%;
28
- padding: 12px;
29
  margin: 10px 0;
30
- border-radius: 4px;
31
- border: 1px solid #ccc;
32
- box-sizing: border-box;
 
 
 
 
 
 
33
  }
34
 
35
  button {
36
  width: 100%;
37
- padding: 12px;
38
- background-color: #007bff;
 
39
  border: none;
 
40
  color: white;
41
- font-size: 16px;
42
- border-radius: 4px;
43
  cursor: pointer;
 
44
  }
45
 
46
  button:hover {
47
- background-color: #0056b3;
48
  }
49
 
50
- #message {
51
  margin-top: 15px;
52
- font-weight: bold;
53
- text-align: center;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
54
  }
 
1
+ /* Basic reset */
2
+ * {
3
+ box-sizing: border-box;
4
+ }
5
+
6
  body {
7
+ font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
8
+ background: linear-gradient(135deg, #6b73ff, #000dff);
9
+ height: 100vh;
10
+ margin: 0;
11
  display: flex;
12
  justify-content: center;
13
  align-items: center;
14
+ color: #fff;
 
15
  }
16
 
17
+ .container {
18
+ background: rgba(255, 255, 255, 0.1);
19
  padding: 30px 40px;
20
+ border-radius: 15px;
 
21
  width: 100%;
22
  max-width: 400px;
23
+ box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
24
+ backdrop-filter: blur(8px);
25
+ -webkit-backdrop-filter: blur(8px);
26
+ border: 1px solid rgba(255, 255, 255, 0.18);
27
+ text-align: center;
28
  }
29
 
30
+ h2 {
31
+ margin-bottom: 25px;
32
+ font-weight: 700;
33
+ letter-spacing: 1px;
34
  }
35
 
36
  input {
37
  width: 100%;
38
+ padding: 12px 15px;
39
  margin: 10px 0;
40
+ border-radius: 8px;
41
+ border: none;
42
+ outline: none;
43
+ font-size: 16px;
44
+ transition: background-color 0.3s ease;
45
+ }
46
+
47
+ input:focus {
48
+ background-color: rgba(255, 255, 255, 0.2);
49
  }
50
 
51
  button {
52
  width: 100%;
53
+ padding: 12px 15px;
54
+ margin-top: 15px;
55
+ background-color: #3a3cff;
56
  border: none;
57
+ border-radius: 8px;
58
  color: white;
59
+ font-weight: 600;
60
+ font-size: 18px;
61
  cursor: pointer;
62
+ transition: background-color 0.3s ease;
63
  }
64
 
65
  button:hover {
66
+ background-color: #2222ff;
67
  }
68
 
69
+ #signupMessage, #loginMessage {
70
  margin-top: 15px;
71
+ font-weight: 600;
72
+ }
73
+
74
+ .switch-page {
75
+ margin-top: 20px;
76
+ font-size: 14px;
77
+ color: #ddd;
78
+ }
79
+
80
+ .switch-page a {
81
+ color: #a6c1ff;
82
+ text-decoration: none;
83
+ font-weight: 600;
84
+ }
85
+
86
+ .switch-page a:hover {
87
+ text-decoration: underline;
88
  }