@limpiolux/ui-styles 1.0.28 → 1.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/base.css +5 -1
- package/components.css +121 -79
- package/package.json +1 -1
package/base.css
CHANGED
|
@@ -22,6 +22,10 @@
|
|
|
22
22
|
--color-brand: 0 117 169;
|
|
23
23
|
--color-brand-strong: 0 96 138;
|
|
24
24
|
--color-brand-soft: 110 205 241;
|
|
25
|
+
|
|
26
|
+
--spring-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);
|
|
27
|
+
--spring-snappy: cubic-bezier(0.175, 0.885, 0.32, 1.275);
|
|
28
|
+
--spring-smooth: cubic-bezier(0.4, 0, 0.2, 1);
|
|
25
29
|
}
|
|
26
30
|
|
|
27
31
|
.light {
|
|
@@ -41,7 +45,7 @@
|
|
|
41
45
|
|
|
42
46
|
body {
|
|
43
47
|
@apply bg-zinc-950 text-zinc-50 antialiased;
|
|
44
|
-
font-family: 'Inter', system-ui,
|
|
48
|
+
font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', system-ui, sans-serif;
|
|
45
49
|
margin: 0;
|
|
46
50
|
min-height: 100vh;
|
|
47
51
|
-webkit-font-smoothing: antialiased;
|
package/components.css
CHANGED
|
@@ -8,15 +8,20 @@
|
|
|
8
8
|
/* ── Forms ── */
|
|
9
9
|
|
|
10
10
|
.form-input {
|
|
11
|
-
@apply w-full
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
11
|
+
@apply w-full rounded-xl px-3.5 py-2.5 text-sm text-zinc-100 outline-none placeholder:text-zinc-500;
|
|
12
|
+
background: rgba(255, 255, 255, 0.06);
|
|
13
|
+
border: 1px solid rgba(255, 255, 255, 0.12);
|
|
14
|
+
backdrop-filter: blur(20px) saturate(1.6);
|
|
15
|
+
-webkit-backdrop-filter: blur(20px) saturate(1.6);
|
|
16
|
+
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), inset 0 -1px 0 rgba(0, 0, 0, 0.1);
|
|
15
17
|
}
|
|
16
18
|
|
|
17
19
|
.form-input:focus {
|
|
18
|
-
border-color: rgba(var(--color-brand) / 0.
|
|
19
|
-
box-shadow:
|
|
20
|
+
border-color: rgba(var(--color-brand) / 0.6);
|
|
21
|
+
box-shadow:
|
|
22
|
+
inset 0 1px 0 rgba(255, 255, 255, 0.08),
|
|
23
|
+
inset 0 -1px 0 rgba(0, 0, 0, 0.1),
|
|
24
|
+
0 0 0 3px rgba(var(--color-brand) / 0.15);
|
|
20
25
|
}
|
|
21
26
|
|
|
22
27
|
.date-filter-input {
|
|
@@ -26,11 +31,15 @@
|
|
|
26
31
|
/* ── Buttons ── */
|
|
27
32
|
|
|
28
33
|
.btn-primary {
|
|
29
|
-
@apply text-white font-
|
|
30
|
-
active:scale-[0.
|
|
31
|
-
disabled:opacity-
|
|
32
|
-
transition: transform 150ms ease, opacity 150ms ease;
|
|
34
|
+
@apply text-white font-semibold py-2.5 px-5 rounded-[14px]
|
|
35
|
+
active:scale-[0.94] flex items-center justify-center gap-2
|
|
36
|
+
disabled:opacity-40 disabled:cursor-not-allowed;
|
|
33
37
|
background: rgb(var(--color-brand));
|
|
38
|
+
box-shadow:
|
|
39
|
+
inset 0 1px 0 rgba(255, 255, 255, 0.2),
|
|
40
|
+
inset 0 -1px 0 rgba(0, 0, 0, 0.15),
|
|
41
|
+
0 4px 16px -2px rgba(var(--color-brand) / 0.5);
|
|
42
|
+
transition: transform 400ms var(--spring-bounce), opacity 150ms ease;
|
|
34
43
|
}
|
|
35
44
|
|
|
36
45
|
.btn-primary:hover {
|
|
@@ -38,26 +47,35 @@
|
|
|
38
47
|
}
|
|
39
48
|
|
|
40
49
|
.btn-secondary {
|
|
41
|
-
@apply
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
50
|
+
@apply text-zinc-100 font-semibold py-2.5 px-5 rounded-[14px]
|
|
51
|
+
active:scale-[0.94] flex items-center justify-center gap-2;
|
|
52
|
+
background: rgba(255, 255, 255, 0.08);
|
|
53
|
+
border: 1px solid rgba(255, 255, 255, 0.14);
|
|
54
|
+
backdrop-filter: blur(20px) saturate(1.5);
|
|
55
|
+
-webkit-backdrop-filter: blur(20px) saturate(1.5);
|
|
56
|
+
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18), inset 0 -1px 0 rgba(0, 0, 0, 0.1);
|
|
57
|
+
transition: transform 400ms var(--spring-bounce), opacity 150ms ease;
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
.btn-secondary:hover {
|
|
61
|
+
background: rgba(255, 255, 255, 0.12);
|
|
62
|
+
border-color: rgba(255, 255, 255, 0.2);
|
|
45
63
|
}
|
|
46
64
|
|
|
47
65
|
.theme-icon-button {
|
|
48
|
-
@apply inline-flex h-9 w-9 shrink-0 items-center justify-center rounded-xl border border-white/10 bg-white/5 text-zinc-200;
|
|
49
|
-
transition: transform
|
|
66
|
+
@apply inline-flex h-9 w-9 shrink-0 self-center aspect-square items-center justify-center rounded-xl border border-white/10 bg-white/5 text-zinc-200;
|
|
67
|
+
transition: transform 400ms var(--spring-bounce), opacity 220ms ease;
|
|
50
68
|
}
|
|
51
69
|
|
|
52
70
|
.theme-icon-button:hover {
|
|
53
|
-
transform: translateY(-1px);
|
|
54
|
-
background: rgba(255, 255, 255, 0.
|
|
55
|
-
border-color: rgba(255, 255, 255, 0.
|
|
71
|
+
transform: translateY(-1px) scale(1.05);
|
|
72
|
+
background: rgba(255, 255, 255, 0.12);
|
|
73
|
+
border-color: rgba(255, 255, 255, 0.18);
|
|
56
74
|
}
|
|
57
75
|
|
|
58
76
|
.theme-icon-glyph {
|
|
59
77
|
display: inline-flex;
|
|
60
|
-
transition: transform
|
|
78
|
+
transition: transform 500ms var(--spring-bounce);
|
|
61
79
|
}
|
|
62
80
|
|
|
63
81
|
.theme-icon-glyph-rotated {
|
|
@@ -73,9 +91,9 @@
|
|
|
73
91
|
grid-template-rows: 0fr;
|
|
74
92
|
opacity: 0;
|
|
75
93
|
transition:
|
|
76
|
-
grid-template-rows
|
|
94
|
+
grid-template-rows 350ms var(--spring-smooth),
|
|
77
95
|
opacity 280ms ease,
|
|
78
|
-
margin-top
|
|
96
|
+
margin-top 350ms var(--spring-smooth);
|
|
79
97
|
}
|
|
80
98
|
|
|
81
99
|
.collapse-panel-open {
|
|
@@ -92,8 +110,14 @@
|
|
|
92
110
|
.portal-panel,
|
|
93
111
|
.portal-header-panel,
|
|
94
112
|
.portal-card {
|
|
95
|
-
@apply rounded-[28px] border border-white/
|
|
96
|
-
|
|
113
|
+
@apply rounded-[28px] border border-white/[0.08] bg-white/[0.04] backdrop-blur-xl;
|
|
114
|
+
backdrop-filter: blur(48px) saturate(1.85) brightness(1.02);
|
|
115
|
+
-webkit-backdrop-filter: blur(48px) saturate(1.85) brightness(1.02);
|
|
116
|
+
box-shadow:
|
|
117
|
+
inset 0 1.5px 0 rgba(255, 255, 255, 0.45),
|
|
118
|
+
inset 0 -1px 0 rgba(0, 0, 0, 0.15),
|
|
119
|
+
0 8px 32px -8px rgba(0, 0, 0, 0.35),
|
|
120
|
+
0 24px 64px -20px rgba(0, 0, 0, 0.22);
|
|
97
121
|
transition: transform 420ms ease;
|
|
98
122
|
}
|
|
99
123
|
|
|
@@ -119,7 +143,7 @@
|
|
|
119
143
|
|
|
120
144
|
.portal-app-card {
|
|
121
145
|
@apply rounded-[28px] border border-white/10 bg-white/[0.045] backdrop-blur-xl relative overflow-hidden p-5 transition-[opacity,transform] duration-300;
|
|
122
|
-
box-shadow: inset 0
|
|
146
|
+
box-shadow: inset 0 1.5px 0 rgba(255, 255, 255, 0.4), inset 0 -1px 0 rgba(0, 0, 0, 0.12), 0 8px 32px -8px rgba(0, 0, 0, 0.3), 0 20px 56px -16px rgba(0, 0, 0, 0.2);
|
|
123
147
|
}
|
|
124
148
|
|
|
125
149
|
.portal-widget-grid {
|
|
@@ -128,11 +152,11 @@
|
|
|
128
152
|
|
|
129
153
|
.portal-widget-card {
|
|
130
154
|
@apply rounded-[24px] border border-white/10 bg-white/[0.045] p-4 backdrop-blur-xl transition-[opacity,transform] duration-300;
|
|
131
|
-
box-shadow: inset 0
|
|
155
|
+
box-shadow: inset 0 1.5px 0 rgba(255, 255, 255, 0.4), inset 0 -1px 0 rgba(0, 0, 0, 0.12), 0 8px 32px -8px rgba(0, 0, 0, 0.3), 0 20px 56px -16px rgba(0, 0, 0, 0.2);
|
|
132
156
|
}
|
|
133
157
|
|
|
134
158
|
.portal-widget-card:hover {
|
|
135
|
-
transform: translateY(-
|
|
159
|
+
transform: translateY(-4px) scale(1.01);
|
|
136
160
|
border-color: rgba(255, 255, 255, 0.16);
|
|
137
161
|
background: rgba(255, 255, 255, 0.065);
|
|
138
162
|
}
|
|
@@ -177,7 +201,7 @@
|
|
|
177
201
|
}
|
|
178
202
|
|
|
179
203
|
.portal-launchpad-card:hover {
|
|
180
|
-
transform: translateY(-
|
|
204
|
+
transform: translateY(-5px) scale(1.02);
|
|
181
205
|
}
|
|
182
206
|
|
|
183
207
|
.portal-launchpad-icon-wrap {
|
|
@@ -185,12 +209,13 @@
|
|
|
185
209
|
}
|
|
186
210
|
|
|
187
211
|
.portal-launchpad-icon {
|
|
188
|
-
@apply inline-flex h-[62px] w-[62px] items-center justify-center rounded-[
|
|
212
|
+
@apply inline-flex h-[62px] w-[62px] items-center justify-center rounded-[22px] sm:h-[70px] sm:w-[70px];
|
|
189
213
|
background: linear-gradient(160deg, rgb(var(--color-brand)) 0%, rgb(var(--color-brand-strong)) 100%);
|
|
190
214
|
color: #ffffff;
|
|
191
215
|
box-shadow:
|
|
192
|
-
0
|
|
193
|
-
0
|
|
216
|
+
0 6px 20px -4px rgba(var(--color-brand) / 0.6),
|
|
217
|
+
0 2px 8px rgba(0, 0, 0, 0.25),
|
|
218
|
+
inset 0 1px 0 rgba(255, 255, 255, 0.2);
|
|
194
219
|
transition: box-shadow 220ms ease;
|
|
195
220
|
}
|
|
196
221
|
|
|
@@ -216,8 +241,8 @@
|
|
|
216
241
|
opacity: 0;
|
|
217
242
|
transform: translateY(6px);
|
|
218
243
|
transition:
|
|
219
|
-
opacity
|
|
220
|
-
transform
|
|
244
|
+
opacity 280ms var(--spring-smooth),
|
|
245
|
+
transform 280ms var(--spring-smooth);
|
|
221
246
|
}
|
|
222
247
|
|
|
223
248
|
.portal-launchpad-role {
|
|
@@ -239,7 +264,13 @@
|
|
|
239
264
|
|
|
240
265
|
.portal-home-card {
|
|
241
266
|
@apply rounded-[28px] border border-white/10 bg-white/[0.045] p-5 backdrop-blur-xl;
|
|
242
|
-
|
|
267
|
+
backdrop-filter: blur(48px) saturate(1.85) brightness(1.02);
|
|
268
|
+
-webkit-backdrop-filter: blur(48px) saturate(1.85) brightness(1.02);
|
|
269
|
+
box-shadow:
|
|
270
|
+
inset 0 1.5px 0 rgba(255, 255, 255, 0.45),
|
|
271
|
+
inset 0 -1px 0 rgba(0, 0, 0, 0.15),
|
|
272
|
+
0 8px 32px -8px rgba(0, 0, 0, 0.35),
|
|
273
|
+
0 24px 64px -20px rgba(0, 0, 0, 0.22);
|
|
243
274
|
}
|
|
244
275
|
|
|
245
276
|
.portal-dashboard-grid {
|
|
@@ -248,7 +279,13 @@
|
|
|
248
279
|
|
|
249
280
|
.portal-dashboard-main {
|
|
250
281
|
@apply rounded-[30px] border border-white/10 bg-white/[0.045] p-5 backdrop-blur-xl md:p-6;
|
|
251
|
-
|
|
282
|
+
backdrop-filter: blur(48px) saturate(1.85) brightness(1.02);
|
|
283
|
+
-webkit-backdrop-filter: blur(48px) saturate(1.85) brightness(1.02);
|
|
284
|
+
box-shadow:
|
|
285
|
+
inset 0 1.5px 0 rgba(255, 255, 255, 0.4),
|
|
286
|
+
inset 0 -1px 0 rgba(0, 0, 0, 0.15),
|
|
287
|
+
0 8px 32px -8px rgba(0, 0, 0, 0.35),
|
|
288
|
+
0 24px 64px -20px rgba(0, 0, 0, 0.22);
|
|
252
289
|
}
|
|
253
290
|
|
|
254
291
|
.portal-dashboard-side {
|
|
@@ -257,7 +294,13 @@
|
|
|
257
294
|
|
|
258
295
|
.portal-side-card {
|
|
259
296
|
@apply rounded-[28px] border border-white/10 bg-white/[0.045] p-5 backdrop-blur-xl;
|
|
260
|
-
|
|
297
|
+
backdrop-filter: blur(48px) saturate(1.85) brightness(1.02);
|
|
298
|
+
-webkit-backdrop-filter: blur(48px) saturate(1.85) brightness(1.02);
|
|
299
|
+
box-shadow:
|
|
300
|
+
inset 0 1.5px 0 rgba(255, 255, 255, 0.4),
|
|
301
|
+
inset 0 -1px 0 rgba(0, 0, 0, 0.15),
|
|
302
|
+
0 8px 32px -8px rgba(0, 0, 0, 0.35),
|
|
303
|
+
0 24px 64px -20px rgba(0, 0, 0, 0.22);
|
|
261
304
|
}
|
|
262
305
|
|
|
263
306
|
.portal-side-hero {
|
|
@@ -273,15 +316,16 @@
|
|
|
273
316
|
}
|
|
274
317
|
|
|
275
318
|
.portal-side-item {
|
|
276
|
-
@apply flex items-start gap-3 rounded-2xl border p-4
|
|
319
|
+
@apply flex items-start gap-3 rounded-2xl border p-4;
|
|
277
320
|
border-color: rgba(255, 255, 255, 0.08);
|
|
278
321
|
background: rgba(255, 255, 255, 0.03);
|
|
322
|
+
transition: transform 350ms var(--spring-smooth), opacity 200ms ease;
|
|
279
323
|
}
|
|
280
324
|
|
|
281
325
|
.portal-side-item:hover {
|
|
282
326
|
border-color: rgba(var(--color-brand) / 0.18);
|
|
283
327
|
background: rgba(255, 255, 255, 0.05);
|
|
284
|
-
transform: translateY(-
|
|
328
|
+
transform: translateY(-2px) scale(1.01);
|
|
285
329
|
}
|
|
286
330
|
|
|
287
331
|
.portal-side-icon {
|
|
@@ -430,8 +474,15 @@
|
|
|
430
474
|
}
|
|
431
475
|
|
|
432
476
|
.auth-card {
|
|
433
|
-
@apply rounded-[
|
|
434
|
-
|
|
477
|
+
@apply rounded-[32px] border border-white/[0.1] p-6 md:p-8;
|
|
478
|
+
background: rgba(255, 255, 255, 0.06);
|
|
479
|
+
backdrop-filter: blur(60px) saturate(1.9) brightness(1.02);
|
|
480
|
+
-webkit-backdrop-filter: blur(60px) saturate(1.9) brightness(1.02);
|
|
481
|
+
box-shadow:
|
|
482
|
+
inset 0 1.5px 0 rgba(255, 255, 255, 0.5),
|
|
483
|
+
inset 0 -1px 0 rgba(0, 0, 0, 0.18),
|
|
484
|
+
0 16px 48px -12px rgba(0, 0, 0, 0.45),
|
|
485
|
+
0 4px 16px -4px rgba(0, 0, 0, 0.25);
|
|
435
486
|
}
|
|
436
487
|
|
|
437
488
|
.auth-title {
|
|
@@ -455,11 +506,15 @@
|
|
|
455
506
|
}
|
|
456
507
|
|
|
457
508
|
.auth-support-panel {
|
|
458
|
-
@apply rounded-[24px] border border-white/
|
|
459
|
-
|
|
509
|
+
@apply rounded-[24px] border border-white/[0.08] p-4;
|
|
510
|
+
background: rgba(255, 255, 255, 0.04);
|
|
511
|
+
backdrop-filter: blur(40px) saturate(1.7);
|
|
512
|
+
-webkit-backdrop-filter: blur(40px) saturate(1.7);
|
|
513
|
+
transition: transform 320ms var(--spring-smooth);
|
|
460
514
|
box-shadow:
|
|
461
|
-
inset 0 1px 0 rgba(255, 255, 255, 0.
|
|
462
|
-
0
|
|
515
|
+
inset 0 1px 0 rgba(255, 255, 255, 0.18),
|
|
516
|
+
inset 0 -1px 0 rgba(0, 0, 0, 0.1),
|
|
517
|
+
0 8px 24px -8px rgba(0, 0, 0, 0.25);
|
|
463
518
|
}
|
|
464
519
|
|
|
465
520
|
.auth-support-icon {
|
|
@@ -798,12 +853,12 @@
|
|
|
798
853
|
}
|
|
799
854
|
|
|
800
855
|
.portal-toolbar-icon {
|
|
801
|
-
@apply inline-flex h-9 w-9 shrink-0 items-center justify-center rounded-xl border border-white/10 bg-white/5 text-zinc-200;
|
|
856
|
+
@apply inline-flex h-9 w-9 shrink-0 self-center aspect-square items-center justify-center rounded-xl border border-white/10 bg-white/5 text-zinc-200;
|
|
802
857
|
transition: transform 220ms ease, opacity 220ms ease;
|
|
803
858
|
}
|
|
804
859
|
|
|
805
860
|
.portal-toolbar-icon:hover {
|
|
806
|
-
transform: translateY(-1px);
|
|
861
|
+
transform: translateY(-1px) scale(1.06);
|
|
807
862
|
background: rgba(255, 255, 255, 0.1);
|
|
808
863
|
border-color: rgba(255, 255, 255, 0.14);
|
|
809
864
|
}
|
|
@@ -813,7 +868,7 @@
|
|
|
813
868
|
}
|
|
814
869
|
|
|
815
870
|
.portal-card:hover {
|
|
816
|
-
transform: translateY(-
|
|
871
|
+
transform: translateY(-5px) scale(1.01);
|
|
817
872
|
border-color: rgba(255, 255, 255, 0.2);
|
|
818
873
|
background: rgba(255, 255, 255, 0.07);
|
|
819
874
|
}
|
|
@@ -1019,11 +1074,11 @@
|
|
|
1019
1074
|
inset 0 -1px 0 rgba(0, 0, 0, 0.1);
|
|
1020
1075
|
backdrop-filter: blur(20px) saturate(1.4);
|
|
1021
1076
|
-webkit-backdrop-filter: blur(20px) saturate(1.4);
|
|
1022
|
-
transition: transform
|
|
1077
|
+
transition: transform 400ms var(--spring-bounce);
|
|
1023
1078
|
}
|
|
1024
1079
|
|
|
1025
1080
|
.kpi-card:hover {
|
|
1026
|
-
transform: translateY(-
|
|
1081
|
+
transform: translateY(-3px) scale(1.01);
|
|
1027
1082
|
border-color: rgba(255, 255, 255, 0.14);
|
|
1028
1083
|
box-shadow:
|
|
1029
1084
|
0 12px 40px -8px rgba(0, 0, 0, 0.35),
|
|
@@ -1045,45 +1100,32 @@
|
|
|
1045
1100
|
|
|
1046
1101
|
.liquid-glass {
|
|
1047
1102
|
border: 1px solid rgba(255, 255, 255, 0.1);
|
|
1048
|
-
background:
|
|
1049
|
-
135deg,
|
|
1050
|
-
rgba(255, 255, 255, 0.07) 0%,
|
|
1051
|
-
rgba(255, 255, 255, 0.02) 40%,
|
|
1052
|
-
rgba(255, 255, 255, 0.05) 100%
|
|
1053
|
-
);
|
|
1103
|
+
background: rgba(255, 255, 255, 0.06);
|
|
1054
1104
|
box-shadow:
|
|
1055
|
-
0
|
|
1056
|
-
inset 0 1px 0 rgba(
|
|
1057
|
-
|
|
1058
|
-
|
|
1059
|
-
|
|
1060
|
-
|
|
1105
|
+
inset 0 1.5px 0 rgba(255, 255, 255, 0.45),
|
|
1106
|
+
inset 0 -1px 0 rgba(0, 0, 0, 0.12),
|
|
1107
|
+
0 8px 32px -8px rgba(0, 0, 0, 0.32),
|
|
1108
|
+
0 24px 56px -16px rgba(0, 0, 0, 0.2);
|
|
1109
|
+
backdrop-filter: blur(48px) saturate(1.85) brightness(1.02);
|
|
1110
|
+
-webkit-backdrop-filter: blur(48px) saturate(1.85) brightness(1.02);
|
|
1111
|
+
transition: transform 400ms var(--spring-smooth);
|
|
1061
1112
|
}
|
|
1062
1113
|
|
|
1063
1114
|
.liquid-glass:hover {
|
|
1064
|
-
transform: translateY(-
|
|
1115
|
+
transform: translateY(-3px) scale(1.01);
|
|
1065
1116
|
border-color: rgba(255, 255, 255, 0.16);
|
|
1066
|
-
box-shadow:
|
|
1067
|
-
0 12px 44px -8px rgba(0, 0, 0, 0.32),
|
|
1068
|
-
inset 0 1px 0 rgba(255, 255, 255, 0.1),
|
|
1069
|
-
inset 0 -1px 0 rgba(0, 0, 0, 0.08);
|
|
1070
1117
|
}
|
|
1071
1118
|
|
|
1072
1119
|
.liquid-glass-strong {
|
|
1073
|
-
border: 1px solid rgba(255, 255, 255, 0.
|
|
1074
|
-
background:
|
|
1075
|
-
145deg,
|
|
1076
|
-
rgba(255, 255, 255, 0.1) 0%,
|
|
1077
|
-
rgba(255, 255, 255, 0.03) 35%,
|
|
1078
|
-
rgba(255, 255, 255, 0.06) 100%
|
|
1079
|
-
);
|
|
1120
|
+
border: 1px solid rgba(255, 255, 255, 0.14);
|
|
1121
|
+
background: rgba(255, 255, 255, 0.08);
|
|
1080
1122
|
box-shadow:
|
|
1081
|
-
0
|
|
1082
|
-
inset 0 1px 0 rgba(
|
|
1083
|
-
|
|
1084
|
-
0 0 0 0.5px rgba(255, 255, 255, 0.
|
|
1085
|
-
backdrop-filter: blur(
|
|
1086
|
-
-webkit-backdrop-filter: blur(
|
|
1123
|
+
inset 0 1.5px 0 rgba(255, 255, 255, 0.55),
|
|
1124
|
+
inset 0 -1px 0 rgba(0, 0, 0, 0.15),
|
|
1125
|
+
0 12px 48px -12px rgba(0, 0, 0, 0.4),
|
|
1126
|
+
0 0 0 0.5px rgba(255, 255, 255, 0.06);
|
|
1127
|
+
backdrop-filter: blur(60px) saturate(1.9) brightness(1.03);
|
|
1128
|
+
-webkit-backdrop-filter: blur(60px) saturate(1.9) brightness(1.03);
|
|
1087
1129
|
}
|
|
1088
1130
|
|
|
1089
1131
|
.liquid-glass-sidebar {
|