Update static/style.css
Browse files- static/style.css +40 -0
static/style.css
CHANGED
@@ -113,3 +113,43 @@ form#chatForm {
|
|
113 |
.options div {
|
114 |
padding: 0.5rem 0.75rem;
|
115 |
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
113 |
.options div {
|
114 |
padding: 0.5rem 0.75rem;
|
115 |
}
|
116 |
+
|
117 |
+
/* Add Aqua Variable */
|
118 |
+
:root {
|
119 |
+
--aqua: #689d6a;
|
120 |
+
}
|
121 |
+
.dark {
|
122 |
+
--aqua: #8ec07c;
|
123 |
+
}
|
124 |
+
|
125 |
+
/* === Loader Dots Animation === */
|
126 |
+
@keyframes bounce {
|
127 |
+
0%, 80%, 100% {
|
128 |
+
transform: scale(0);
|
129 |
+
}
|
130 |
+
40% {
|
131 |
+
transform: scale(1);
|
132 |
+
}
|
133 |
+
}
|
134 |
+
|
135 |
+
.dot {
|
136 |
+
width: 8px;
|
137 |
+
height: 8px;
|
138 |
+
margin: 0 4px;
|
139 |
+
background-color: var(--aqua);
|
140 |
+
border-radius: 50%;
|
141 |
+
animation: bounce 1.4s infinite ease-in-out both;
|
142 |
+
}
|
143 |
+
|
144 |
+
.animation-delay-150 {
|
145 |
+
animation-delay: 0.15s;
|
146 |
+
}
|
147 |
+
|
148 |
+
.animation-delay-300 {
|
149 |
+
animation-delay: 0.3s;
|
150 |
+
}
|
151 |
+
|
152 |
+
/* Gruvbox Aqua background */
|
153 |
+
.bg-aqua {
|
154 |
+
background-color: var(--aqua);
|
155 |
+
}
|