Refactor dark mode styles: update CSS variables for dark mode theme and set default background and text colors
This commit is contained in:
@@ -58,35 +58,20 @@
|
|||||||
- Also supports a manual `.dark-mode` class on body or a parent
|
- Also supports a manual `.dark-mode` class on body or a parent
|
||||||
*/
|
*/
|
||||||
|
|
||||||
:root {
|
|
||||||
--bg: #ffffff;
|
|
||||||
--text: #212529;
|
|
||||||
--muted: #6c757d;
|
|
||||||
--secondary: #6c757d;
|
|
||||||
--card-bg: #ffffff;
|
|
||||||
--card-border: #e9ecef;
|
|
||||||
--primary: #0d6efd;
|
|
||||||
--success: #198754;
|
|
||||||
--danger: #dc3545;
|
|
||||||
--feedback-bg: #f8f9fa;
|
|
||||||
--shadow: 0 1px 2px rgba(0,0,0,0.03);
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (prefers-color-scheme: dark) {
|
:root {
|
||||||
:root {
|
--bg: #050607;
|
||||||
--bg: #050607;
|
--text: #e6eef6;
|
||||||
--text: #e6eef6;
|
--muted: #9aa4ad;
|
||||||
--muted: #9aa4ad;
|
--card-bg: #0f1720;
|
||||||
--card-bg: #0f1720;
|
--card-border: #1f2a33;
|
||||||
--card-border: #1f2a33;
|
--primary: #6ea8ff;
|
||||||
--primary: #6ea8ff;
|
--success: #36d07a;
|
||||||
--success: #36d07a;
|
--danger: #ff6b6b;
|
||||||
--danger: #ff6b6b;
|
--feedback-bg: #071322;
|
||||||
--feedback-bg: #071322;
|
--shadow: 0 2px 6px rgba(0,0,0,0.6);
|
||||||
--shadow: 0 2px 6px rgba(0,0,0,0.6);
|
|
||||||
}
|
|
||||||
body, .exam-take-container { background: var(--bg); color: var(--text); }
|
|
||||||
}
|
}
|
||||||
|
body, .exam-take-container { background: var(--bg); color: var(--text); }
|
||||||
|
|
||||||
/* Manual override: add `dark-mode` to body or a parent to force dark theme */
|
/* Manual override: add `dark-mode` to body or a parent to force dark theme */
|
||||||
body.dark-mode, .dark-mode { color: var(--text); background: var(--bg); }
|
body.dark-mode, .dark-mode { color: var(--text); background: var(--bg); }
|
||||||
|
|||||||
Reference in New Issue
Block a user