From 9f2fb3bda733c32995c008bd0f40365e43c348da Mon Sep 17 00:00:00 2001 From: tanaka takashi Date: Sat, 22 Aug 2026 00:18:56 +0900 Subject: feat: Zolaで「たかしの記録」を構築 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Specifications.mdとDesign.mdを実装の基準として、個人アーカイブサイトをZola 0.23.3向けに構築する。 - Home、Notes、Software、About、Tagsの情報設計と専用URLを追加 - Notesの年別アーカイブ、タグ分類、目次、脚注、参考文献、更新日表示を実装 - Softwareの一覧・詳細、cgit/GitHub情報、Notesとの明示的な相互参照を実装 - Tera 2 componentによる再帰TOCと共通partialsを追加 - Minimal Editorial ArchiveのSCSS、レスポンシブ表示、アクセシビリティ対応を追加 - OS設定とlocalStorageに対応するLight/Darkテーマ切替を外部JavaScriptで実装 - Atom/RSS、sitemap、robots.txt、404、favicon、syntax highlightingを設定 - メールアドレスをzola.tomlへ一元化し、AboutとFooterから参照 - 表示名・内部ディレクトリ・変数・URLをSoftware/softwareへ統一 - public/をGit管理対象外とし、外部CDNやNode.js依存を導入しない - zola checkおよびzola buildの成功を確認 --- static/js/theme.js | 75 ++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 75 insertions(+) create mode 100644 static/js/theme.js (limited to 'static/js') diff --git a/static/js/theme.js b/static/js/theme.js new file mode 100644 index 0000000..3d2b25c --- /dev/null +++ b/static/js/theme.js @@ -0,0 +1,75 @@ +(function () { + "use strict"; + + var root = document.documentElement; + root.classList.add("theme-ready"); + var toggle = document.querySelector("[data-theme-toggle]"); + var syntaxLight = document.getElementById("syntax-light"); + var syntaxDark = document.getElementById("syntax-dark"); + var media = window.matchMedia("(prefers-color-scheme: dark)"); + var storedTheme = null; + + try { + storedTheme = window.localStorage.getItem("theme"); + } catch (error) { + storedTheme = null; + } + + function activeTheme() { + if (root.dataset.theme === "light" || root.dataset.theme === "dark") { + return root.dataset.theme; + } + return media.matches ? "dark" : "light"; + } + + function syncSyntax(theme) { + if (!syntaxLight || !syntaxDark) { + return; + } + syntaxLight.media = theme === "light" ? "all" : "not all"; + syntaxDark.media = theme === "dark" ? "all" : "not all"; + } + + function updateToggle() { + if (!toggle) { + return; + } + var dark = activeTheme() === "dark"; + toggle.setAttribute("aria-pressed", String(dark)); + toggle.setAttribute("aria-label", dark ? "ライトテーマに切り替える" : "ダークテーマに切り替える"); + toggle.textContent = dark ? "Light" : "Dark"; + } + + function applyTheme(theme, persist) { + root.dataset.theme = theme; + syncSyntax(theme); + updateToggle(); + if (persist) { + try { + window.localStorage.setItem("theme", theme); + } catch (error) { + // Storageが利用できなくても、現在のpageではthemeを維持する。 + } + } + } + + if (storedTheme === "light" || storedTheme === "dark") { + applyTheme(storedTheme, false); + } else { + syncSyntax(activeTheme()); + updateToggle(); + } + + if (toggle) { + toggle.addEventListener("click", function () { + applyTheme(activeTheme() === "dark" ? "light" : "dark", true); + }); + } + + media.addEventListener("change", function () { + if (!root.dataset.theme) { + syncSyntax(activeTheme()); + updateToggle(); + } + }); +})(); -- cgit v1.2.3