cccjc commited on
Commit
fe262ce
1 Parent(s): c1acd4a

update darkmode style

Browse files
Files changed (1) hide show
  1. 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: var(--body-text-color);
 
68
  }
69
 
70
  .custom-dataframe table {
71
- background-color: var(--background-fill-primary);
 
72
  }
73
 
74
  .custom-dataframe thead th {
75
- background-color: var(--background-fill-secondary);
76
- color: var(--body-text-color);
 
77
  }
78
 
79
  .custom-dataframe tbody td {
80
- color: var(--body-text-color);
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, 100, 200, 0.1);
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, 150, 0, 0.1);
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.05);
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, 100, 200, 0.15);
103
  }
104
 
105
  .custom-dataframe tbody tr:nth-child(even) td:nth-child(n+5) {
106
- background-color: rgba(0, 150, 0, 0.15);
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
  }