diff --git a/src/layouts/BaseLayout.astro b/src/layouts/BaseLayout.astro
index 81c216d..38ea84c 100644
--- a/src/layouts/BaseLayout.astro
+++ b/src/layouts/BaseLayout.astro
@@ -6,11 +6,8 @@ const currentPath = Astro.url.pathname;
const navItems = [
{ href: '/', label: 'Home' },
{ href: '/about/', label: 'About' },
- { href: '/demonstrations/', label: 'Demonstrations' },
{ href: '/downloads/', label: 'Downloads' },
{ href: '/docs/', label: 'Docs' },
- { href: '/search/', label: 'Search' },
- { href: '/community/', label: 'Community' },
{ href: '/faq/', label: 'FAQ' },
];
---
@@ -49,11 +46,27 @@ const navItems = [
}
@@ -68,12 +81,25 @@ const navItems = [
@@ -83,7 +109,7 @@ const navItems = [
const html = document.documentElement;
const sunIcon = document.getElementById('sun-icon');
const moonIcon = document.getElementById('moon-icon');
-
+
function updateIcons() {
if (html.classList.contains('dark')) {
sunIcon.style.display = 'block';
@@ -93,21 +119,24 @@ const navItems = [
moonIcon.style.display = 'block';
}
}
-
+
function toggleTheme() {
html.classList.toggle('dark');
localStorage.setItem('theme', html.classList.contains('dark') ? 'dark' : 'light');
updateIcons();
}
-
+
// Initialize theme from localStorage or system preference
- if (localStorage.getItem('theme') === 'dark' ||
- (!localStorage.getItem('theme') && window.matchMedia('(prefers-color-scheme: dark)').matches)) {
+ if (
+ localStorage.getItem('theme') === 'dark' ||
+ (!localStorage.getItem('theme') &&
+ window.matchMedia('(prefers-color-scheme: dark)').matches)
+ ) {
html.classList.add('dark');
}
-
+
updateIcons();
-
+
themeToggle.addEventListener('click', toggleTheme);
@@ -125,7 +154,9 @@ const navItems = [
background: color-mix(in srgb, var(--color-bg-primary) 95%, transparent);
border-bottom: 1px solid var(--color-border-subtle);
backdrop-filter: blur(8px);
- transition: background-color 0.3s ease, border-color 0.3s ease;
+ transition:
+ background-color 0.3s ease,
+ border-color 0.3s ease;
}
html.dark .site-header {
@@ -213,11 +244,27 @@ const navItems = [
color: var(--color-text-secondary);
}
- .site-footer a {
- color: var(--color-link);
+ .footer-brand p {
+ margin: 0;
+ color: var(--color-text-primary);
+ }
+
+ .footer-nav-list {
+ list-style: none;
+ margin: 0;
+ padding: 0;
+ display: flex;
+ flex-wrap: wrap;
+ gap: var(--space-sm) var(--space-md);
+ }
+
+ .footer-nav-list a {
+ color: var(--color-text-secondary);
+ text-decoration: none;
+ transition: var(--transition-smooth);
}
- .site-footer a:hover {
+ .footer-nav-list a:hover {
color: var(--color-link-hover);
}
diff --git a/src/pages/about.astro b/src/pages/about.astro
index a6110e3..be7090c 100644
--- a/src/pages/about.astro
+++ b/src/pages/about.astro
@@ -20,6 +20,15 @@ import BaseLayout from '../layouts/BaseLayout.astro';
steering toward your target, you can enter text at speeds competitive with touch typing,
using only a single pointing device.
+