15
15
@import url ("/css/defaults/placeholders.css" );
16
16
@import url ("/css/defaults/transparent.css" );
17
17
18
+ : root {
19
+ --v-theme-accent : var (--accent-color ):
20
+ }
21
+
18
22
@media (max-width : 720px ) {
19
23
20
24
.modal__body ,
@@ -59,6 +63,11 @@ html {
59
63
border-radius : 20px
60
64
}
61
65
66
+ /* OVERLAY */
67
+ .v-overlay__scrim {
68
+ background : rgb (var (--accent-color ));
69
+ }
70
+
62
71
/* TEXT */
63
72
.h1 ,
64
73
.h2 ,
78
87
color : var (--text-hover );
79
88
}
80
89
90
+ .text-accent {
91
+ color : rgb (var (--accent-color )) !important ;
92
+ }
93
+
81
94
.v-select__slot > label {
82
95
color : var (--text-hover ) !important ;
83
96
}
113
126
}
114
127
115
128
/* TOP NAVBAR */
116
- [class *= "theme--" ].v-app-bar .v-toolbar . v-sheet {
129
+ [class *= "theme--" ].v-app-bar .v-toolbar {
117
130
color : var (--text ) !important ;
118
131
}
119
132
120
- .v-app-bar . v-app-bar--hide-shadow {
133
+ .v-toolbar [ class *= "theme--" ] {
121
134
background : var (--transparency-dark-25 ) !important ;
122
135
}
123
136
137
150
}
138
151
139
152
/* SIDE MENU */
140
- .v-application .primary {
153
+ .v-application .primary , . v-navigation-drawer {
141
154
background : var (--transparency-dark-25 ) !important ;
142
155
color : var (--text ) !important ;
143
156
}
157
170
.v-navigation-drawer--is-mobile : not (.v-navigation-drawer--close ),
158
171
.v-navigation-drawer--temporary : not (.v-navigation-drawer--close ),
159
172
.v-navigation-drawer--is-mobile : not (.v-navigation-drawer--close ),
160
- .v-navigation-drawer--temporary : not (.v-navigation-drawer--close ) {
173
+ .v-navigation-drawer--temporary : not (.v-navigation-drawer--close ),
174
+ [class *= "theme--" ].v-app-bar .v-toolbar {
161
175
-webkit-backdrop-filter : blur (10px );
162
176
backdrop-filter : blur (10px );
163
177
}
164
178
}
165
179
180
+ /* STATS */
181
+ [class *= "v-theme--" ] .bg-secondary {
182
+ background-color : var (--transparency-light-15 ) !important ;
183
+ border-color : rgba (255 , 255 , 255 , .15 ) !important ;
184
+ }
185
+
186
+ /* CURRENT SPEED */
187
+ .v-navigation-drawer__content .v-sheet [class *= "theme--" ].bg-primary {
188
+ background-color : transparent !important ;
189
+ border-color : rgba (255 , 255 , 255 , .15 ) !important ;
190
+ }
191
+
166
192
/* slightly transparent fallback for Firefox (not supporting backdrop-filter) */
167
193
@supports not ((-webkit-backdrop-filter : none) or (backdrop-filter : none)) {
168
194
184
210
caret-color : var (--v-download-base ) !important ;
185
211
}
186
212
213
+ /* TABS */
214
+
215
+ .v-slide-group .v-tabs .v-tabs--horizontal .bg-primary {
216
+ background : var (--transparency-dark-25 ) !important ;
217
+ }
218
+
219
+ .v-btn .v-slide-group-item--active .v-tab--selected {
220
+ background : var (--transparency-dark-35 ) !important ;
221
+ }
222
+
223
+ /* BUTTON */
224
+ .v-btn--variant-elevated , .v-btn--variant-flat {
225
+ background : var (--button-color ) !important ;
226
+ color : var (--button-text ) !important ;
227
+ }
228
+ .bg-red {
229
+ --v-theme-overlay-multiplier : var (--v-theme-red-overlay-multiplier );
230
+ background-color : rgb (var (--v-theme-red )) !important ;
231
+ color : rgb (var (--v-theme-on-red )) !important ;
232
+ }
233
+
234
+ .v-btn--icon .v-btn--density-compact {
235
+ background : transparent !important ;
236
+ }
237
+
187
238
/* MODAL */
188
239
.v-dialog [class *= "theme--" ].v-card ,
189
240
.v-dialog [class *= "theme--" ].v-tabs-items ,
@@ -295,6 +346,15 @@ button>.v-btn--is-elevated .v-btn--has-bg.v-icon__svg {
295
346
.v-text-field--outlined fieldset {
296
347
border-color : rgba (255 , 255 , 255 , .1 ) !important ;
297
348
}
349
+ .v-field .v-field--variant-solo .v-theme--darkTheme {
350
+ background : var (--transparency-dark-25 ) !important ;
351
+ }
352
+ .v-field--variant-solo , .v-field--variant-solo-filled , .v-field--variant-solo-inverted {
353
+ background : var (--transparency-dark-25 ) !important ;
354
+ border-color : transparent;
355
+ color : rgba (var (--v-theme-on-surface ), var (--v-high-emphasis-opacity ));
356
+ box-shadow : 0 3px 1px -2px var (--v-shadow-key-umbra-opacity , rgba (0 , 0 , 0 , .2 )), 0 2px 2px 0 var (--v-shadow-key-penumbra-opacity , rgba (0 , 0 , 0 , .14 )), 0 1px 5px 0 var (--v-shadow-key-ambient-opacity , rgba (0 , 0 , 0 , .12 ));
357
+ }
298
358
299
359
/* DASHBOARD */
300
360
@@ -425,10 +485,23 @@ button>.v-btn--is-elevated .v-btn--has-bg.v-icon__svg {
425
485
color : var (--text ) !important ;
426
486
}
427
487
428
- .v-menu__content [class *= "theme--" ][class *= "theme--" ].v-list {
488
+ .v-menu__content [class *= "theme--" ][class *= "theme--" ].v-list , . v-menu [ class *= "theme--" ][ class *= "theme--" ]. v-list {
429
489
background : var (--drop-down-menu-bg )
430
490
}
431
491
492
+ .v-expansion-panel {
493
+ background-color : var (--drop-down-menu-bg ) !important ;
494
+ color : var (--text );
495
+ }
496
+ .v-expansion-panel-title__overlay {
497
+ background-color : var (--drop-down-menu-bg ) !important ;
498
+ }
499
+
500
+ .v-bottom-navigation {
501
+ background : var (--drop-down-menu-bg );
502
+ color : var (--text );
503
+ }
504
+
432
505
[class *= "theme--" ].v-icon {
433
506
color : rgb (var (--accent-color )) !important ;
434
507
}
@@ -437,8 +510,21 @@ button>.v-btn--is-elevated .v-btn--has-bg.v-icon__svg {
437
510
border-color : rgba (255 , 255 , 255 , .2 ) !important ;
438
511
}
439
512
513
+ .v-menu > .v-overlay__content > .v-card , .v-menu > .v-overlay__content > .v-sheet , .v-menu > .v-overlay__content > .v-list {
514
+ background : rgb (var (--drop-down-menu-bg ));
515
+ border-radius : inherit;
516
+ overflow : auto;
517
+ height : 100% ;
518
+ box-shadow : 0 5px 5px -3px var (--transparency-light-10 ) !important ;
519
+ }
520
+
521
+ .v-list-item--variant-plain , .v-list-item--variant-outlined , .v-list-item--variant-text , .v-list-item--variant-tonal {
522
+ background : transparent;
523
+ color : var (--link-color );
524
+ }
525
+
440
526
/* TABLE */
441
- [class *= "theme--" ].v-data-table {
527
+ [class *= "theme--" ].v-data-table , . v-table {
442
528
background : transparent;
443
529
color : var (--text );
444
530
}
@@ -512,6 +598,7 @@ button>.v-btn--is-elevated .v-btn--has-bg.v-icon__svg {
512
598
/* SETTING */
513
599
514
600
[class *= "theme--" ].v-list {
515
- background : var (--transparency-light-05 );
601
+ background : var (--transparency-dark-10 );
516
602
color : rgba (0 , 0 , 0 , .87 );
517
- }
603
+ }
604
+
0 commit comments