Skip to content

Commit 9a9da3b

Browse files
mitranimmitranim
committed
make light/dark automatic
1 parent 89e6f2c commit 9a9da3b

File tree

4 files changed

+18
-95
lines changed

4 files changed

+18
-95
lines changed

‎multipage.nim‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -14,10 +14,8 @@ const
1414
<link rel="stylesheet" href="style.css">
1515
</head>
1616
<body>
17-
<!-- Right sidebar with theme switcher and file overview -->
17+
<!-- Right sidebar with file overview -->
1818
<div class="right-sidebar" id="rightSidebar" style="width: 100px;">
19-
<button class="theme-switcher" onclick="toggleTheme()">🌙 Dark</button>
20-
2119
<button class="$1" onclick="navigateToPage('$2')"> → Next</button>
2220
<button class="$3" onclick="navigateToPage('$4')"> ← Prev</button>
2321
</div>

‎nimdoc.cfg‎

Lines changed: 1 addition & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -187,9 +187,8 @@ doc.file = """<!DOCTYPE html>
187187
<link rel="stylesheet" href="style.css">
188188
</head>
189189
<body>
190-
<!-- Right sidebar with theme switcher and file overview -->
190+
<!-- Right sidebar with file overview -->
191191
<div class="right-sidebar" id="rightSidebar">
192-
<button class="theme-switcher" onclick="toggleTheme()">🌙 Dark</button>
193192
<div class="file-overview">
194193
<div class="current-section" id="currentSection">Loading...</div>
195194
</div>
@@ -244,11 +243,6 @@ doc.file = """<!DOCTYPE html>
244243
<link rel="stylesheet" href="style.css">
245244
</head>
246245
<body>
247-
<!-- Right sidebar with theme switcher and file overview -->
248-
<div class="right-sidebar" id="rightSidebar">
249-
<button class="theme-switcher" onclick="toggleTheme()">🌙 Dark</button>
250-
</div>
251-
252246
<!-- Toggle button for sidebar (shown when collapsed) -->
253247
<button class="sidebar-toggle" id="sidebarToggle" onclick="toggleSidebar()">📋</button>
254248

‎script.js‎

Lines changed: 0 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,3 @@
1-
// Theme switching functionality
2-
function toggleTheme() {
3-
const root = document.documentElement;
4-
const button = document.querySelector('.theme-switcher');
5-
6-
if (root.getAttribute('data-theme') === 'dark') {
7-
// Switch to light theme
8-
root.removeAttribute('data-theme');
9-
button.textContent = '🌙 Dark';
10-
button.title = 'Switch to dark theme';
11-
} else {
12-
// Switch to dark theme
13-
root.setAttribute('data-theme', 'dark');
14-
button.textContent = '🌙 Light';
15-
button.title = 'Switch to light theme';
16-
}
17-
18-
// Save preference to localStorage
19-
localStorage.setItem('nimony-theme', root.getAttribute('data-theme') || 'light');
20-
}
21-
221
// Sidebar toggle functionality
232
function toggleSidebar() {
243
const sidebar = document.getElementById('rightSidebar');
@@ -224,19 +203,6 @@ function navigateToPage(filename) {
224203

225204
// Load saved preferences and initialize on page load
226205
document.addEventListener('DOMContentLoaded', function() {
227-
// Load saved theme preference
228-
const savedTheme = localStorage.getItem('nimony-theme');
229-
const button = document.querySelector('.theme-switcher');
230-
231-
if (savedTheme === 'dark') {
232-
document.documentElement.setAttribute('data-theme', 'dark');
233-
button.textContent = '🌙 Light';
234-
button.title = 'Switch to light theme';
235-
} else {
236-
button.textContent = '🌙 Dark';
237-
button.title = 'Switch to dark theme';
238-
}
239-
240206
// Load saved sidebar preference
241207
const savedSidebarCollapsed = localStorage.getItem('nimony-sidebar-collapsed');
242208
const sidebar = document.getElementById('rightSidebar');

‎style.css‎

Lines changed: 16 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -32,42 +32,7 @@ color-scheme: light;
3232
--clipboard-image: var(--clipboard-image-normal)
3333
}
3434

35-
[data-theme="dark"] {
36-
color-scheme: dark;
37-
--primary-background: #171921;
38-
--secondary-background: #1e202a;
39-
--third-background: #2b2e3b;
40-
--info-background: #008000;
41-
--warning-background: #807000;
42-
--error-background: #c03000;
43-
--border: #0e1014;
44-
--text: #fff;
45-
--anchor: #8be9fd;
46-
--anchor-focus: #8be9fd;
47-
--input-focus: #8be9fd;
48-
--strong: #bd93f9;
49-
--hint: #7A7C85;
50-
51-
--keyword: #f8f8f2;
52-
--identifier: #f8f8f2;
53-
--comment: #ff79c6;
54-
--operator: #f8f8f2;
55-
--punctuation: #f8f8f2;
56-
--other: #f8f8f2;
57-
--escapeSequence: #bd93f9;
58-
--number: #f1fa8c;
59-
--literal: #f1fa8c;
60-
--program: #9090c0;
61-
--option: #90b010;
62-
--raw-data: #8be9fd;
63-
64-
--clipboard-image-normal: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' style='color: lightgray' fill='none' viewBox='0 0 24 24' stroke='currentColor'%3E %3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2' /%3E %3C/svg%3E");
65-
--clipboard-image-selected: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' style='color: lightgray' viewBox='0 0 20 20' fill='currentColor'%3E %3Cpath d='M8 3a1 1 0 011-1h2a1 1 0 110 2H9a1 1 0 01-1-1z' /%3E %3Cpath d='M6 3a2 2 0 00-2 2v11a2 2 0 002 2h8a2 2 0 002-2V5a2 2 0 00-2-2 3 3 0 01-3 3H9a3 3 0 01-3-3z' /%3E %3C/svg%3E");
66-
--clipboard-image: var(--clipboard-image-normal);
67-
}
68-
6935
@media (prefers-color-scheme: dark) {
70-
[data-theme="auto"] {
7136
color-scheme: dark;
7237
--primary-background: #171921;
7338
--secondary-background: #1e202a;
@@ -100,8 +65,6 @@ color-scheme: dark;
10065
--clipboard-image-selected: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' style='color: lightgray' viewBox='0 0 20 20' fill='currentColor'%3E %3Cpath d='M8 3a1 1 0 011-1h2a1 1 0 110 2H9a1 1 0 01-1-1z' /%3E %3Cpath d='M6 3a2 2 0 00-2 2v11a2 2 0 002 2h8a2 2 0 002-2V5a2 2 0 00-2-2 3 3 0 01-3 3H9a3 3 0 01-3-3z' /%3E %3C/svg%3E");
10166
--clipboard-image: var(--clipboard-image-normal);
10267
}
103-
}
104-
10568

10669
span.DecNumber {
10770
color: var(--number); }
@@ -200,20 +163,22 @@ color: var(--other); }
200163
}
201164

202165
/* Dark theme color scheme */
203-
[data-theme="dark"] {
204-
--bg-primary: #002451; /* Dark blue background */
205-
--bg-secondary: #00346e; /* Slightly lighter blue */
206-
--third-background: transparent; /* Third level background */
207-
--text-primary: #ffffff; /* White text */
208-
--text-secondary: #ffff00; /* Yellow for captions and highlights */
209-
--text-muted: #b4b4b4; /* Light gray for secondary text */
210-
--border-color: #1d3f53; /* Darker blue border */
211-
--code-bg: var(--bg-primary); /* Darker blue for code blocks */
212-
--code-border: #1d3f53; /* Darker blue for code borders */
213-
--accent-color: #ffff00; /* Soft red for accents */
214-
--string-color: #d1f1a9; /* Light green for strings */
215-
--keyword-color: #ff9da4; /* Soft red for keywords */
216-
--comment-color: #7285b7; /* Muted blue for comments */
166+
@media (prefers-color-scheme: dark) {
167+
:root {
168+
--bg-primary: #002451; /* Dark blue background */
169+
--bg-secondary: #00346e; /* Slightly lighter blue */
170+
--third-background: transparent; /* Third level background */
171+
--text-primary: #ffffff; /* White text */
172+
--text-secondary: #ffff00; /* Yellow for captions and highlights */
173+
--text-muted: #b4b4b4; /* Light gray for secondary text */
174+
--border-color: #1d3f53; /* Darker blue border */
175+
--code-bg: var(--bg-primary); /* Darker blue for code blocks */
176+
--code-border: #1d3f53; /* Darker blue for code borders */
177+
--accent-color: #ffff00; /* Soft red for accents */
178+
--string-color: #d1f1a9; /* Light green for strings */
179+
--keyword-color: #ff9da4; /* Soft red for keywords */
180+
--comment-color: #7285b7; /* Muted blue for comments */
181+
}
217182
}
218183

219184
* {

0 commit comments

Comments
 (0)