Spaces:
Running
Running
switch default theme to light mode. Update HTML template to reflect the new default theme and enhance theme toggle functionality.
Browse files- scripts/build.py +29 -21
scripts/build.py
CHANGED
|
@@ -161,22 +161,7 @@ def generate_eva_css() -> str:
|
|
| 161 |
"""Generate Neon Genesis Evangelion inspired CSS with light/dark mode support."""
|
| 162 |
return """
|
| 163 |
:root {
|
| 164 |
-
/*
|
| 165 |
-
--eva-purple: #9a1eb3;
|
| 166 |
-
--eva-green: #1c7361;
|
| 167 |
-
--eva-orange: #ff6600;
|
| 168 |
-
--eva-blue: #0066ff;
|
| 169 |
-
--eva-red: #ff0000;
|
| 170 |
-
--eva-black: #111111;
|
| 171 |
-
--eva-dark: #222222;
|
| 172 |
-
--eva-terminal-bg: rgba(0, 0, 0, 0.85);
|
| 173 |
-
--eva-text: #e0e0e0;
|
| 174 |
-
--eva-border-radius: 4px;
|
| 175 |
-
--eva-transition: all 0.3s ease;
|
| 176 |
-
}
|
| 177 |
-
|
| 178 |
-
/* Light mode colors */
|
| 179 |
-
[data-theme="light"] {
|
| 180 |
--eva-purple: #7209b7;
|
| 181 |
--eva-green: #1c7361;
|
| 182 |
--eva-orange: #e65100;
|
|
@@ -186,6 +171,21 @@ def generate_eva_css() -> str:
|
|
| 186 |
--eva-dark: #e0e0e0;
|
| 187 |
--eva-terminal-bg: rgba(255, 255, 255, 0.9);
|
| 188 |
--eva-text: #333333;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 189 |
}
|
| 190 |
|
| 191 |
body {
|
|
@@ -891,7 +891,7 @@ def generate_index(courses: Dict[str, Dict[str, Any]], output_dir: str) -> None:
|
|
| 891 |
with open(index_path, "w", encoding="utf-8") as f:
|
| 892 |
f.write(
|
| 893 |
"""<!DOCTYPE html>
|
| 894 |
-
<html lang="en" data-theme="
|
| 895 |
<head>
|
| 896 |
<meta charset="UTF-8">
|
| 897 |
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
@@ -1126,15 +1126,23 @@ def generate_index(courses: Dict[str, Dict[str, Any]], output_dir: str) -> None:
|
|
| 1126 |
</div>
|
| 1127 |
|
| 1128 |
<script>
|
|
|
|
|
|
|
|
|
|
| 1129 |
document.addEventListener('DOMContentLoaded', function() {
|
| 1130 |
// Theme toggle functionality
|
| 1131 |
const themeToggle = document.getElementById('themeToggle');
|
| 1132 |
const themeIcon = themeToggle.querySelector('i');
|
| 1133 |
|
| 1134 |
-
//
|
| 1135 |
-
|
| 1136 |
-
|
| 1137 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1138 |
|
| 1139 |
// Toggle theme when button is clicked
|
| 1140 |
themeToggle.addEventListener('click', () => {
|
|
|
|
| 161 |
"""Generate Neon Genesis Evangelion inspired CSS with light/dark mode support."""
|
| 162 |
return """
|
| 163 |
:root {
|
| 164 |
+
/* Light mode colors (default) */
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 165 |
--eva-purple: #7209b7;
|
| 166 |
--eva-green: #1c7361;
|
| 167 |
--eva-orange: #e65100;
|
|
|
|
| 171 |
--eva-dark: #e0e0e0;
|
| 172 |
--eva-terminal-bg: rgba(255, 255, 255, 0.9);
|
| 173 |
--eva-text: #333333;
|
| 174 |
+
--eva-border-radius: 4px;
|
| 175 |
+
--eva-transition: all 0.3s ease;
|
| 176 |
+
}
|
| 177 |
+
|
| 178 |
+
/* Dark mode colors */
|
| 179 |
+
[data-theme="dark"] {
|
| 180 |
+
--eva-purple: #9a1eb3;
|
| 181 |
+
--eva-green: #1c7361;
|
| 182 |
+
--eva-orange: #ff6600;
|
| 183 |
+
--eva-blue: #0066ff;
|
| 184 |
+
--eva-red: #ff0000;
|
| 185 |
+
--eva-black: #111111;
|
| 186 |
+
--eva-dark: #222222;
|
| 187 |
+
--eva-terminal-bg: rgba(0, 0, 0, 0.85);
|
| 188 |
+
--eva-text: #e0e0e0;
|
| 189 |
}
|
| 190 |
|
| 191 |
body {
|
|
|
|
| 891 |
with open(index_path, "w", encoding="utf-8") as f:
|
| 892 |
f.write(
|
| 893 |
"""<!DOCTYPE html>
|
| 894 |
+
<html lang="en" data-theme="light">
|
| 895 |
<head>
|
| 896 |
<meta charset="UTF-8">
|
| 897 |
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
|
| 1126 |
</div>
|
| 1127 |
|
| 1128 |
<script>
|
| 1129 |
+
// Set light theme as default immediately
|
| 1130 |
+
document.documentElement.setAttribute('data-theme', 'light');
|
| 1131 |
+
|
| 1132 |
document.addEventListener('DOMContentLoaded', function() {
|
| 1133 |
// Theme toggle functionality
|
| 1134 |
const themeToggle = document.getElementById('themeToggle');
|
| 1135 |
const themeIcon = themeToggle.querySelector('i');
|
| 1136 |
|
| 1137 |
+
// Update theme icon based on current theme
|
| 1138 |
+
updateThemeIcon('light');
|
| 1139 |
+
|
| 1140 |
+
// Check localStorage for saved theme preference
|
| 1141 |
+
const savedTheme = localStorage.getItem('theme');
|
| 1142 |
+
if (savedTheme && savedTheme !== 'light') {
|
| 1143 |
+
document.documentElement.setAttribute('data-theme', savedTheme);
|
| 1144 |
+
updateThemeIcon(savedTheme);
|
| 1145 |
+
}
|
| 1146 |
|
| 1147 |
// Toggle theme when button is clicked
|
| 1148 |
themeToggle.addEventListener('click', () => {
|