File size: 1,899 Bytes
aff722f
7761e86
 
 
 
aff722f
 
7761e86
 
aff722f
7761e86
aff722f
7761e86
 
 
aff722f
 
7761e86
 
aff722f
7761e86
aff722f
 
7761e86
 
c2dab81
502b5d6
aff722f
502b5d6
aff722f
c2dab81
 
a077f4c
 
c2dab81
aff722f
a077f4c
 
c2dab81
 
aff722f
41130ec
 
c2dab81
502b5d6
aff722f
41130ec
 
aff722f
 
 
 
 
7761e86
 
aff722f
 
7761e86
 
aff722f
7761e86
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
502b5d6
41130ec
a077f4c
7761e86
 
 
502b5d6
aff722f
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
/* Basic layout */
body {
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 0;
    background-color: #121212;
    color: white;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    height: 100vh;
    overflow-y: auto;  /* Allow scrolling */
}

.container {
    width: 100%;
    max-width: 800px;
    background-color: #1e1e1e;
    border-radius: 10px;
    padding: 20px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    margin-top: 20px;
    overflow: hidden;  /* Ensure content does not overflow container */
}

header {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-bottom: 20px;
    text-align: center;
    border-bottom: 1px solid #ddd;
}

header .logo img {
    width: 50px;
}

header h1 {
    font-size: 24px;
    color: white;
}

header p {
    color: #a1a1a1;
    font-size: 14px;
}

/* Content section */
.content {
    overflow-y: auto;  /* Allow scroll if content overflows */
    max-height: 500px;
    padding: 20px;
}

.converter input,
.converter select {
    padding: 10px;
    width: 100%;
    margin-bottom: 10px;
    border-radius: 5px;
    border: 1px solid #ddd;
}

button {
    background-color: #4CAF50;
    color: white;
    padding: 10px 20px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    margin-top: 10px;
}

button:hover {
    background-color: #45a049;
}

button#swap-btn {
    background-color: transparent;
    border: 1px solid #4CAF50;
    padding: 8px;
    color: #4CAF50;
    cursor: pointer;
}

button#swap-btn:hover {
    background-color: #4CAF50;
    color: white;
}

/* Footer styling */
footer {
    text-align: center;
    margin-top: 20px;
    font-size: 0.9em;
    color: #a1a1a1;
}

footer a {
    color: #4CAF50;
    text-decoration: none;
}

footer a:hover {
    text-decoration: underline;
}

#result {
    margin-top: 20px;
    font-size: 1.2em;
}