diff options
| author | tanaka takashi <isazaka@gmail.com> | 2026-08-22 00:18:56 +0900 |
|---|---|---|
| committer | tanaka takashi <isazaka@gmail.com> | 2026-08-22 00:19:26 +0900 |
| commit | 9f2fb3bda733c32995c008bd0f40365e43c348da (patch) | |
| tree | 663a6b48ec83b2b6ba2c998dcfed89e0bb29f172 /sass/_tokens.scss | |
| parent | 31b19ee74469c23633bbea4e021d91ddd8c34e3a (diff) | |
feat: Zolaで「たかしの記録」を構築
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の成功を確認
Diffstat (limited to 'sass/_tokens.scss')
| -rw-r--r-- | sass/_tokens.scss | 42 |
1 files changed, 42 insertions, 0 deletions
diff --git a/sass/_tokens.scss b/sass/_tokens.scss new file mode 100644 index 0000000..a0ed8f3 --- /dev/null +++ b/sass/_tokens.scss @@ -0,0 +1,42 @@ +:root { + color-scheme: light; + --color-bg: #f6f5f1; + --color-surface: #fbfaf7; + --color-text: #202124; + --color-muted: #666b70; + --color-border: #d6d8da; + --color-link: #315f82; + --color-link-hover: #244a67; + --color-focus: #1e668f; + --font-sans: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans JP", sans-serif; + --font-mono: ui-monospace, "Cascadia Code", "SFMono-Regular", Consolas, "Liberation Mono", monospace; + --content-max: 72ch; + --site-max: 72rem; + --rule: 1px solid var(--color-border); +} + +:root[data-theme="dark"] { + color-scheme: dark; + --color-bg: #17191b; + --color-surface: #1d2022; + --color-text: #e9e9e6; + --color-muted: #a0a3a6; + --color-border: #363a3e; + --color-link: #86b6d8; + --color-link-hover: #add3ed; + --color-focus: #86b6d8; +} + +@media (prefers-color-scheme: dark) { + :root:not([data-theme="light"]) { + color-scheme: dark; + --color-bg: #17191b; + --color-surface: #1d2022; + --color-text: #e9e9e6; + --color-muted: #a0a3a6; + --color-border: #363a3e; + --color-link: #86b6d8; + --color-link-hover: #add3ed; + --color-focus: #86b6d8; + } +} |
