1<!doctype html>2<html lang="en">3 <head>4 <meta charset="utf-8" />5 <meta name="viewport" content="width=device-width, initial-scale=1" />6 <title>{% block title %}{{ config.title }}{% endblock %}</title>7 <style>8 :root {9 --bg: #fafafa;10 --fg: #222;11 --accent: #2563eb;12 --muted: #666;13 --border: #e5e7eb;14 --code-bg: #f3f4f6;15 }16 @media (prefers-color-scheme: dark) {17 :root {18 --bg: #1a1a2e;19 --fg: #e0e0e0;20 --accent: #60a5fa;21 --muted: #999;22 --border: #333;23 --code-bg: #252540;24 }25 }26 * {27 margin: 0;28 padding: 0;29 box-sizing: border-box;30 }31 body {32 font-family:33 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,34 sans-serif;35 background: var(--bg);36 color: var(--fg);37 line-height: 1.6;38 }39 body {40 min-height: 100vh;41 display: flex;42 flex-direction: column;43 }44 .container {45 max-width: 640px;46 margin: 0 auto;47 padding: 2rem 1rem;48 flex: 1;49 display: flex;50 flex-direction: column;51 width: 100%;52 }53 main {54 flex: 1;55 }56 header {57 margin-bottom: 2rem;58 border-bottom: 1px solid var(--border);59 padding-bottom: 1rem;60 }61 header h1 {62 font-size: 1.5rem;63 }64 header h1 a {65 color: var(--fg);66 text-decoration: none;67 }68 header p {69 color: var(--muted);70 font-size: 0.9rem;71 margin-top: 0.25rem;72 }73 nav {74 margin-top: 0.5rem;75 display: flex;76 gap: 1rem;77 }78 nav a {79 color: var(--accent);80 text-decoration: none;81 font-size: 0.9rem;82 }83 nav a:hover {84 text-decoration: underline;85 }86 a {87 color: var(--accent);88 }89 h1,90 h2,91 h3 {92 margin: 1.5rem 0 0.5rem;93 }94 h1 {95 font-size: 1.75rem;96 }97 h2 {98 font-size: 1.3rem;99 }100 p {101 margin-bottom: 1rem;102 }103 ul,104 ol {105 margin: 0 0 1rem 1.5rem;106 }107 pre {108 background: var(--code-bg);109 padding: 1rem;110 border-radius: 6px;111 overflow-x: auto;112 margin-bottom: 1rem;113 font-size: 0.875rem;114 }115 code {116 font-family: "SF Mono", Menlo, monospace;117 font-size: 0.875em;118 }119 :not(pre) > code {120 background: var(--code-bg);121 padding: 0.15em 0.3em;122 border-radius: 3px;123 }124 .post-list {125 list-style: none;126 margin-left: 0;127 }128 .post-list li {129 padding: 0.75rem 0;130 border-bottom: 1px solid var(--border);131 }132 .post-list .date {133 color: var(--muted);134 font-size: 0.8rem;135 }136 .post-meta {137 color: var(--muted);138 font-size: 0.85rem;139 margin-bottom: 1rem;140 }141 .post-tags {142 margin-bottom: 1rem;143 }144 .tag {145 display: inline-block;146 background: var(--code-bg);147 color: var(--accent);148 padding: 0.15em 0.5em;149 border-radius: 3px;150 font-size: 0.8rem;151 text-decoration: none;152 margin-right: 0.25rem;153 }154 .tag:hover {155 text-decoration: underline;156 }157 .toc {158 margin: 1rem 0 1.5rem;159 padding: 0.75rem 1rem;160 background: var(--code-bg);161 border-radius: 6px;162 font-size: 0.85rem;163 }164 .toc summary {165 cursor: pointer;166 font-weight: 600;167 color: var(--muted);168 }169 .toc ul {170 margin: 0.5rem 0 0 1.25rem;171 }172 .toc li {173 margin: 0.2rem 0;174 }175 .page-nav {176 display: flex;177 justify-content: space-between;178 margin-top: 2rem;179 padding-top: 1rem;180 border-top: 1px solid var(--border);181 font-size: 0.9rem;182 }183 blockquote {184 border-left: 3px solid var(--border);185 padding-left: 1rem;186 color: var(--muted);187 margin: 1rem 0;188 }189 figure {190 margin: 1.5rem 0;191 }192 figure img {193 max-width: 100%;194 border-radius: 6px;195 }196 figcaption {197 color: var(--muted);198 font-size: 0.85rem;199 margin-top: 0.5rem;200 text-align: center;201 }202 table {203 width: 100%;204 border-collapse: collapse;205 margin: 1rem 0;206 font-size: 0.9rem;207 }208 th, td {209 text-align: left;210 padding: 0.5rem;211 border-bottom: 1px solid var(--border);212 }213 th {214 font-weight: 600;215 }216 .search-input {217 width: 100%;218 padding: 0.6rem 0.75rem;219 font-size: 1rem;220 border: 1px solid var(--border);221 border-radius: 6px;222 background: var(--bg);223 color: var(--fg);224 outline: none;225 font-family: inherit;226 }227 .search-input:focus {228 border-color: var(--accent);229 }230 .search-results {231 margin-top: 1rem;232 list-style: none;233 margin-left: 0;234 }235 .search-results li {236 padding: 0.75rem 0;237 border-bottom: 1px solid var(--border);238 }239 .search-results .title {240 font-weight: 600;241 }242 .search-results .body {243 color: var(--muted);244 font-size: 0.85rem;245 margin-top: 0.25rem;246 }247 .search-meta {248 color: var(--muted);249 font-size: 0.85rem;250 margin-top: 0.5rem;251 }252 footer {253 margin-top: 3rem;254 padding-top: 1rem;255 border-top: 1px solid var(--border);256 color: var(--muted);257 font-size: 0.8rem;258 }259 </style>260 </head>261 <body>262 <div class="container">263 <header>264 <h1><a href="{{ config.base_url }}">{{ config.title }}</a></h1>265 <p>{{ config.description }}</p>266 <nav>267 <a href="{{ config.base_url }}">home</a>268 <a href="{{ config.base_url }}about/">about</a>269 <a href="{{ config.base_url }}tags/">tags</a>270 <a href="{{ config.base_url }}search/">search</a>271 </nav>272 </header>273 <main>{% block content %}{% endblock %}</main>274 <footer>275 built with <a href="https://www.getzola.org">zola</a> on276 <a href="https://sublimated.com">sublimated</a>277 </footer>278 </div>279 </body>280</html> v8 of v9
commit a97082d
message edit base.html via macOS
author anton
date Apr 24, 2026
size 8.3 KB