update darkmode style
Browse files- static/css/style.css +13 -10
static/css/style.css
CHANGED
@@ -64,45 +64,48 @@
|
|
64 |
/* Dark mode specific styles */
|
65 |
@media (prefers-color-scheme: dark) {
|
66 |
.custom-dataframe {
|
67 |
-
color:
|
|
|
68 |
}
|
69 |
|
70 |
.custom-dataframe table {
|
71 |
-
background-color:
|
|
|
72 |
}
|
73 |
|
74 |
.custom-dataframe thead th {
|
75 |
-
background-color:
|
76 |
-
color:
|
|
|
77 |
}
|
78 |
|
79 |
.custom-dataframe tbody td {
|
80 |
-
|
81 |
}
|
82 |
|
83 |
/* Style for global result columns in dark mode */
|
84 |
.custom-dataframe thead th:nth-child(-n+4),
|
85 |
.custom-dataframe tbody td:nth-child(-n+4) {
|
86 |
-
background-color: rgba(0,
|
87 |
}
|
88 |
|
89 |
/* Style for dimension-specific result columns in dark mode */
|
90 |
.custom-dataframe thead th:nth-child(n+5),
|
91 |
.custom-dataframe tbody td:nth-child(n+5) {
|
92 |
-
background-color: rgba(0,
|
93 |
}
|
94 |
|
95 |
/* Hover effect for better row distinction in dark mode */
|
96 |
.custom-dataframe tbody tr:hover td {
|
97 |
-
background-color: rgba(255, 255, 255, 0.
|
98 |
}
|
99 |
|
100 |
/* Alternating row colors for better readability in dark mode */
|
101 |
.custom-dataframe tbody tr:nth-child(even) td:nth-child(-n+4) {
|
102 |
-
background-color: rgba(0,
|
103 |
}
|
104 |
|
105 |
.custom-dataframe tbody tr:nth-child(even) td:nth-child(n+5) {
|
106 |
-
background-color: rgba(0,
|
107 |
}
|
108 |
}
|
|
|
64 |
/* Dark mode specific styles */
|
65 |
@media (prefers-color-scheme: dark) {
|
66 |
.custom-dataframe {
|
67 |
+
color: #e0e0e0;
|
68 |
+
background-color: #1a1a1a;
|
69 |
}
|
70 |
|
71 |
.custom-dataframe table {
|
72 |
+
background-color: #2a2a2a;
|
73 |
+
border-collapse: collapse;
|
74 |
}
|
75 |
|
76 |
.custom-dataframe thead th {
|
77 |
+
background-color: #333333;
|
78 |
+
color: #ffffff;
|
79 |
+
border-bottom: 2px solid #4a4a4a;
|
80 |
}
|
81 |
|
82 |
.custom-dataframe tbody td {
|
83 |
+
border: 1px solid #3a3a3a;
|
84 |
}
|
85 |
|
86 |
/* Style for global result columns in dark mode */
|
87 |
.custom-dataframe thead th:nth-child(-n+4),
|
88 |
.custom-dataframe tbody td:nth-child(-n+4) {
|
89 |
+
background-color: rgba(0, 50, 100, 0.3);
|
90 |
}
|
91 |
|
92 |
/* Style for dimension-specific result columns in dark mode */
|
93 |
.custom-dataframe thead th:nth-child(n+5),
|
94 |
.custom-dataframe tbody td:nth-child(n+5) {
|
95 |
+
background-color: rgba(0, 75, 0, 0.3);
|
96 |
}
|
97 |
|
98 |
/* Hover effect for better row distinction in dark mode */
|
99 |
.custom-dataframe tbody tr:hover td {
|
100 |
+
background-color: rgba(255, 255, 255, 0.1);
|
101 |
}
|
102 |
|
103 |
/* Alternating row colors for better readability in dark mode */
|
104 |
.custom-dataframe tbody tr:nth-child(even) td:nth-child(-n+4) {
|
105 |
+
background-color: rgba(0, 60, 120, 0.3);
|
106 |
}
|
107 |
|
108 |
.custom-dataframe tbody tr:nth-child(even) td:nth-child(n+5) {
|
109 |
+
background-color: rgba(0, 90, 0, 0.3);
|
110 |
}
|
111 |
}
|