Hugging Face's logo

Spaces:
GarGerry
/
Testinghh
Running

App Files Community
GarGerry commited on
Commit
13c110b
·
verified ·
1 Parent(s): a9d9312

Update style.css

Browse files
Files changed (1) hide show
  1. style.css +27 -30
style.css CHANGED
@@ -7,7 +7,7 @@
7
 
8
  body {
9
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
10
- background: linear-gradient(135deg, #1E90FF, #87CEFA); /* Mirip dengan warna contoh */
11
  display: flex;
12
  justify-content: center;
13
  align-items: center;
@@ -21,83 +21,80 @@ body {
21
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
22
  padding: 40px;
23
  width: 100%;
24
- max-width: 500px;
25
  text-align: center;
26
  }
27
 
28
- header {
29
- margin-bottom: 20px;
30
- }
31
-
32
  header h1 {
33
  font-size: 24px;
34
  color: #333;
 
 
 
 
 
35
  font-weight: bold;
 
 
36
  }
37
 
38
  input {
39
  padding: 12px;
40
- margin: 10px 0;
41
  width: 100%;
42
  font-size: 16px;
43
  border-radius: 8px;
44
  border: 1px solid #ccc;
45
- box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05);
46
- transition: border-color 0.3s;
47
- }
48
-
49
- input:focus {
50
- border-color: #1E90FF;
51
- outline: none;
52
  }
53
 
54
  .currency-selectors {
55
  display: flex;
56
  align-items: center;
 
57
  gap: 10px;
58
- margin: 15px 0;
 
 
 
 
59
  }
60
 
61
  #swapButton {
62
- background-color: #1E90FF;
63
- color: white;
64
- border: none;
65
  border-radius: 50%;
66
  padding: 10px;
67
- font-size: 16px;
68
  cursor: pointer;
 
69
  }
70
 
71
  #swapButton:hover {
72
- background-color: #104E8B;
73
  }
74
 
75
  select {
76
  padding: 12px;
77
- font-size: 16px;
78
  border-radius: 8px;
79
  border: 1px solid #ccc;
80
- box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05);
81
- }
82
-
83
- select:focus {
84
- border-color: #1E90FF;
85
- outline: none;
86
  }
87
 
88
  button[type="submit"] {
89
  padding: 12px;
90
- background-color: #1E90FF;
91
  color: white;
92
  border: none;
93
  border-radius: 8px;
94
  font-size: 16px;
95
  cursor: pointer;
96
- transition: background-color 0.3s ease;
97
  }
98
 
99
  button[type="submit"]:hover {
100
- background-color: #104E8B;
101
  }
102
 
103
  #result {
 
7
 
8
  body {
9
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
10
+ background: linear-gradient(135deg, #f7f8fa, #e7ebf0);
11
  display: flex;
12
  justify-content: center;
13
  align-items: center;
 
21
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
22
  padding: 40px;
23
  width: 100%;
24
+ max-width: 400px;
25
  text-align: center;
26
  }
27
 
 
 
 
 
28
  header h1 {
29
  font-size: 24px;
30
  color: #333;
31
+ margin-bottom: 20px;
32
+ }
33
+
34
+ label {
35
+ display: block;
36
  font-weight: bold;
37
+ margin-bottom: 5px;
38
+ color: #555;
39
  }
40
 
41
  input {
42
  padding: 12px;
43
+ margin-bottom: 15px;
44
  width: 100%;
45
  font-size: 16px;
46
  border-radius: 8px;
47
  border: 1px solid #ccc;
48
+ text-align: center;
49
+ font-weight: bold;
 
 
 
 
 
50
  }
51
 
52
  .currency-selectors {
53
  display: flex;
54
  align-items: center;
55
+ justify-content: space-between;
56
  gap: 10px;
57
+ margin-bottom: 15px;
58
+ }
59
+
60
+ .currency-group {
61
+ width: 45%;
62
  }
63
 
64
  #swapButton {
65
+ background-color: #ffffff;
66
+ color: #333;
67
+ border: 1px solid #ccc;
68
  border-radius: 50%;
69
  padding: 10px;
 
70
  cursor: pointer;
71
+ font-size: 16px;
72
  }
73
 
74
  #swapButton:hover {
75
+ background-color: #f1f1f1;
76
  }
77
 
78
  select {
79
  padding: 12px;
80
+ font-size: 14px;
81
  border-radius: 8px;
82
  border: 1px solid #ccc;
83
+ width: 100%;
 
 
 
 
 
84
  }
85
 
86
  button[type="submit"] {
87
  padding: 12px;
88
+ background-color: #007BFF;
89
  color: white;
90
  border: none;
91
  border-radius: 8px;
92
  font-size: 16px;
93
  cursor: pointer;
 
94
  }
95
 
96
  button[type="submit"]:hover {
97
+ background-color: #0056b3;
98
  }
99
 
100
  #result {