Skip to content

Commit 7bd03fa

Browse files
DevuboxLinuxDevuboxLinux
committed
fix stuff
1 parent 208ec43 commit 7bd03fa

1 file changed

Lines changed: 46 additions & 30 deletions

File tree

‎download/index.html‎

Lines changed: 46 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -5,18 +5,24 @@
55
<!-- Required meta tags for character set and responsive design -->
66
<meta charset="UTF-8">
77
<meta name="viewport" content="width=device-width, initial-scale=1.0">
8-
9-
<!-- SEO Meta Tags -->
10-
<title>Download Devubox-MX - Midweight Simple Stable Desktop OS</title>
118
<meta name="description"
129
content="Download the latest version of Devubox-MX, a midweight, simple, and stable desktop OS based on Devuan. Check system requirements and get started.">
1310
<meta name="keywords"
1411
content="Download Devubox-MX, Linux, Devuan, Debian, Openbox, Operating System, Indonesia, Desktop OS">
1512
<meta name="author" content="Devubox-MX Team">
1613
<meta name="robots" content="index, follow">
1714
<meta name="google-site-verification" content="5NSUj4iUm8mQVvVLfs-nzIvBGkmw6tJR6EQUsfkQQM0" />
15+
16+
<!-- SEO Meta Tags -->
17+
<title>Download Devubox-MX - Midweight Simple Stable Desktop OS</title>
1818
<link rel="canonical" href="https://devuboxlinux.github.io/download/">
1919
<link rel='shortlink' href="https://devuboxlinux.github.io/download/" />
20+
21+
<!-- Performance Optimization: Preconnect to critical origins -->
22+
<link rel="preconnect" href="https://fonts.googleapis.com">
23+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
24+
<link rel="preconnect" href="https://cdn.jsdelivr.net" crossorigin>
25+
2026
<!-- Open Graph / Facebook Meta Tags -->
2127
<meta property="og:type" content="website">
2228
<meta property="og:url" content="https://devuboxlinux.github.io/download/">
@@ -37,14 +43,17 @@
3743
<!-- Favicon -->
3844
<link rel="icon" href="/favicon.ico" type="image/x-icon">
3945

46+
<!-- Google Fonts (with display=swap for performance) -->
47+
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap" rel="stylesheet">
48+
4049
<!-- Bootstrap CSS from CDN -->
41-
<!-- This link fetches the latest Bootstrap 5 styles -->
4250
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
4351

4452
<!-- Bootstrap Icons CDN -->
45-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css">
53+
<link rel="preload" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
54+
<noscript><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"></noscript>
4655

47-
<!-- Custom CSS for minor style adjustments and dark mode -->
56+
<!-- Custom CSS -->
4857
<style>
4958
:root {
5059
--body-bg-light: linear-gradient(to right, #e2e2e2, #c9d6ff);
@@ -163,11 +172,6 @@
163172
}
164173
</style>
165174

166-
<!-- Google Fonts -->
167-
<link rel="preconnect" href="https://fonts.googleapis.com">
168-
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
169-
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap" rel="stylesheet">
170-
171175
</head>
172176

173177
<body>
@@ -192,8 +196,7 @@
192196
<li class="nav-item"><a class="nav-link" href="https://github.com/DevuboxLinux/Devubox-MX/">Source
193197
Code</a></li>
194198
<li class="nav-item ms-lg-2">
195-
<a class="nav-link theme-toggle" id="theme-toggle-btn" title="Toggle theme">
196-
<!-- Replaced SVG with Bootstrap Icons -->
199+
<a class="nav-link theme-toggle" id="theme-toggle-btn" title="Toggle theme" role="button" tabindex="0">
197200
<i class="bi bi-sun-fill sun-icon"></i>
198201
<i class="bi bi-moon-fill moon-icon"></i>
199202
</a>
@@ -316,7 +319,7 @@ <h2 class="fw-bold text-center mb-4">System Requirements</h2>
316319
<div class="card custom-card shadow-sm h-100">
317320
<div class="card-body p-4">
318321
<h2 class="fw-bold text-center mb-4">Verify Your Download</h2>
319-
<h5 class="card-title">How to Verify the Checksum of the ISO</h5>
322+
<h2 class="card-title h5">How to Verify the Checksum of the ISO</h2>
320323
<p>To ensure the integrity of the downloaded ISO, please use one of the methods below based
321324
on your operating system:</p>
322325
<div class="p-3 mb-3 rounded checksum-box">
@@ -346,17 +349,17 @@ <h5 class="card-title">How to Verify the Checksum of the ISO</h5>
346349
<code>DAFA27F7C8EECEACDC56805C3FEF465AE7183F38</code></p>
347350
</div>
348351
</div>
349-
<h6 class="mt-3"><strong>MD5 Check (Linux):</strong></h6>
352+
<h2 class="mt-3 h6"><strong>MD5 Check (Linux):</strong></h6>
350353
<pre class="p-2 rounded"><code>md5sum Devubox-MX25_Base_sysvinit_RC1_x64.iso</code></pre>
351-
<h6 class="mt-3"><strong>MD5 Check (Windows):</strong></h6>
354+
<h2 class="mt-3 h6"><strong>MD5 Check (Windows):</strong></h6>
352355
<pre
353356
class="p-2 rounded"><code>certutil -hashfile Devubox-MX25_Base_sysvinit_RC1_x64.iso MD5</code></pre>
354-
<h6 class="mt-3"><strong>SHA256 Check (Linux):</strong></h6>
357+
<h2 class="mt-3 h6"><strong>SHA256 Check (Linux):</strong></h6>
355358
<pre class="p-2 rounded"><code>sha256sum Devubox-MX25_Base_sysvinit_RC1_x64.iso</code></pre>
356-
<h6 class="mt-3"><strong>SHA256 Check (Windows):</strong></h6>
359+
<h2 class="mt-3 h6"><strong>SHA256 Check (Windows):</strong></h6>
357360
<pre
358361
class="p-2 rounded"><code>certutil -hashfile Devubox-MX25_Base_sysvinit_RC1_x64.iso SHA256</code></pre>
359-
<h6 class="mt-3"><strong>Verify ISO Signature (Linux Only):</strong></h6>
362+
<h2 class="mt-3 h6"><strong>Verify ISO Signature (Linux Only):</strong></h6>
360363
<p>To verify the integrity of the ISO, you can use the following GPG commands:</p>
361364
<pre
362365
class="p-2 rounded"><code>gpg --no-default-keyring --keyring gnupg-ring:trustedkeys.gpg --keyserver keyserver.ubuntu.com --recv-keys 3FEF465AE7183F38</code></pre>
@@ -377,7 +380,7 @@ <h2 class="fw-bold text-center mb-4">How to Make a Live USB</h2>
377380
<strong>Important:</strong> Make sure to back up all data on your USB drive to prevent
378381
data loss, as the drive will be formatted.
379382
</div>
380-
<h5 class="mt-4">Using Graphical Tools</h5>
383+
<h2 class="mt-4 h5">Using Graphical Tools</h2>
381384
<p>A full-featured bootable (Live) USB can be made from an ISO by using <a
382385
href="https://mxlinux.org/wiki/help-files/help-mx-live-usb-maker/" target="_blank"
383386
rel="noopener noreferrer">MX’s Live USB Maker</a> tool. Users of other Linux
@@ -396,7 +399,7 @@ <h5 class="mt-4">Using Graphical Tools</h5>
396399
href="https://rufus.ie/" target="_blank" rel="noopener noreferrer">Rufus</a> or <a
397400
href="https://www.ventoy.net/" target="_blank" rel="noopener noreferrer">Ventoy</a>
398401
(Note: Ventoy is not working at the moment).</p>
399-
<h5 class="mt-4">Using the Command Line (Advanced)</h5>
402+
<h2 class="mt-4 h5">Using the Command Line (Advanced)</h2>
400403
<p>You can also use the command line to make a Live USB. Let us assume your USB is
401404
identified as <code>sdb</code> (change as needed for your system), then copy and paste
402405
the command below into a Terminal Emulator with Sudo or Root Access. Replace
@@ -427,8 +430,8 @@ <h5 class="mt-4">Using the Command Line (Advanced)</h5>
427430

428431

429432
<!-- ======================= Scripts ======================= -->
430-
<script src="https://code.jquery.com/jquery-3.7.1.slim.min.js"></script>
431-
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
433+
<script src="https://code.jquery.com/jquery-3.7.1.slim.min.js" defer></script>
434+
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" defer></script>
432435

433436
<!-- Dark Mode Toggle Script -->
434437
<script>
@@ -452,13 +455,26 @@ <h5 class="mt-4">Using the Command Line (Advanced)</h5>
452455

453456
setTheme(getPreferredTheme())
454457

455-
const themeToggleButton = document.getElementById('theme-toggle-btn');
456-
457-
themeToggleButton.addEventListener('click', () => {
458-
const currentTheme = getStoredTheme() || getPreferredTheme();
459-
const newTheme = currentTheme === 'light' ? 'dark' : 'light';
460-
setStoredTheme(newTheme);
461-
setTheme(newTheme);
458+
// Wait for DOMContentLoaded to ensure elements exist
459+
document.addEventListener('DOMContentLoaded', () => {
460+
const themeToggleButton = document.getElementById('theme-toggle-btn');
461+
462+
if (themeToggleButton) {
463+
themeToggleButton.addEventListener('click', () => {
464+
const currentTheme = getStoredTheme() || getPreferredTheme();
465+
const newTheme = currentTheme === 'light' ? 'dark' : 'light';
466+
setStoredTheme(newTheme);
467+
setTheme(newTheme);
468+
});
469+
470+
// Add keyboard accessibility for the toggle button (which is an anchor)
471+
themeToggleButton.addEventListener('keydown', (e) => {
472+
if (e.key === 'Enter' || e.key === ' ') {
473+
e.preventDefault();
474+
themeToggleButton.click();
475+
}
476+
});
477+
}
462478
});
463479

464480
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {

0 commit comments

Comments
 (0)