三端自适应布局与 PWA 可安装支持

新增响应式样式、手机侧滑导航、manifest 与 Service Worker；补充根路径重定向与安装 App 入口。

Co-authored-by: Cursor <cursoragent@cursor.com>

static/js/nav.js

@@ -0,0 +1,53 @@
+(function () {
+    var toggle = document.getElementById('nav-toggle');
+    var nav = document.getElementById('site-nav');
+    var backdrop = document.getElementById('nav-backdrop');
+    if (!toggle || !nav) return;
+
+    function openNav() {
+        nav.classList.add('open');
+        if (backdrop) {
+            backdrop.hidden = false;
+            backdrop.classList.add('show');
+        }
+        toggle.setAttribute('aria-expanded', 'true');
+        document.body.style.overflow = 'hidden';
+    }
+
+    function closeNav() {
+        nav.classList.remove('open');
+        if (backdrop) {
+            backdrop.classList.remove('show');
+            backdrop.hidden = true;
+        }
+        toggle.setAttribute('aria-expanded', 'false');
+        document.body.style.overflow = '';
+    }
+
+    function isMobileNav() {
+        return window.matchMedia('(max-width: 767px)').matches;
+    }
+
+    toggle.addEventListener('click', function () {
+        if (nav.classList.contains('open')) closeNav();
+        else openNav();
+    });
+
+    if (backdrop) {
+        backdrop.addEventListener('click', closeNav);
+    }
+
+    nav.querySelectorAll('a').forEach(function (link) {
+        link.addEventListener('click', function () {
+            if (isMobileNav()) closeNav();
+        });
+    });
+
+    window.addEventListener('resize', function () {
+        if (!isMobileNav()) closeNav();
+    });
+
+    document.addEventListener('keydown', function (e) {
+        if (e.key === 'Escape') closeNav();
+    });
+})();

static/js/pwa.js

@@ -0,0 +1,76 @@
+(function () {
+    var deferredPrompt = null;
+    var installBtn = document.getElementById('pwa-install-btn');
+    var iosHint = document.getElementById('pwa-ios-hint');
+
+    function isStandalone() {
+        return window.matchMedia('(display-mode: standalone)').matches
+            || window.navigator.standalone === true;
+    }
+
+    function isIOS() {
+        return /iPad|iPhone|iPod/.test(navigator.userAgent)
+            && !window.MSStream;
+    }
+
+    function updateThemeColor() {
+        var meta = document.getElementById('meta-theme-color');
+        if (!meta) return;
+        var theme = document.documentElement.getAttribute('data-theme');
+        meta.setAttribute('content', theme === 'light' ? '#e8eef8' : '#050508');
+    }
+
+    function showInstallBtn() {
+        if (installBtn && !isStandalone()) {
+            installBtn.hidden = false;
+        }
+    }
+
+    function showIosHint() {
+        if (iosHint && isIOS() && !isStandalone()) {
+            iosHint.classList.add('show');
+        }
+    }
+
+    if ('serviceWorker' in navigator) {
+        window.addEventListener('load', function () {
+            navigator.serviceWorker.register('/sw.js', { scope: '/' }).catch(function () { /* ignore */ });
+        });
+    }
+
+    window.addEventListener('beforeinstallprompt', function (e) {
+        e.preventDefault();
+        deferredPrompt = e;
+        showInstallBtn();
+    });
+
+    if (installBtn) {
+        installBtn.addEventListener('click', function () {
+            if (!deferredPrompt) return;
+            deferredPrompt.prompt();
+            deferredPrompt.userChoice.then(function () {
+                deferredPrompt = null;
+                installBtn.hidden = true;
+            });
+        });
+    }
+
+    window.addEventListener('appinstalled', function () {
+        deferredPrompt = null;
+        if (installBtn) installBtn.hidden = true;
+        if (iosHint) iosHint.classList.remove('show');
+    });
+
+    document.addEventListener('DOMContentLoaded', function () {
+        updateThemeColor();
+        showIosHint();
+        if (!isStandalone() && !deferredPrompt && installBtn) {
+            installBtn.hidden = true;
+        }
+    });
+
+    document.addEventListener('click', function (e) {
+        var pick = e.target.closest('[data-theme-pick]');
+        if (pick) setTimeout(updateThemeColor, 80);
+    });
+})();