sqzass.git

sqzass

~ A static site generator written in Rust
git clone https://github.com/debuman/sqzass.git
commit 0ee4dec4e3e689cb7120262034eb551cf2095ca7
parent 57e1b0295c3dfe18fbca627ec5e5290a1566cdbf
Author: sqzer <110329244+sqzer-x@users.noreply.github.com>
Date: Sun, 26 Jul 2026 09:45:16 +0900

Build the footer out of what this build produced

It was one line — built with sqzass, source, MIT — which is a colophon, not a
footer. Three columns now: the mark with a tagline, the project, and the files
this build emitted.

The last column is the part worth having. sitemap.xml, robots.txt, llms.txt and
the search index are things the documentation claims the tool produces, and
linking them turns the claim into something a reader can click. It is a column
that only makes sense for a generator that builds its own documentation, which
is why it is not the one every footer has.

The one every footer has — a list of the documentation sections — is
deliberately absent. The masthead is sticky and the sidebar is always there, so
a third copy would be filling space rather than adding anything.

Two things surfaced while building it. `site.description` is a single value for
the whole site, so the Korean pages were carrying an English tagline, in the
footer and in the home page's <title>; both read from the i18n catalogue now,
which is the mechanism that exists for exactly this. And the responsive rules
written before the masthead rebuild were still in the file, hiding the table of
contents from 68rem while the new block hides it at 60rem — two sets of
breakpoints disagreeing about the same element. The old set is gone.

Diffstat:
Mdocs/i18n/en.toml | 8+++++++-
Mdocs/i18n/ko.toml | 8+++++++-
Mdocs/static/css/main.css | 93+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++--------------------
Mdocs/templates/base.html | 44++++++++++++++++++++++++++++++++++++++++----
4 files changed, 124 insertion(+), 29 deletion(-)

diff --git a/docs/i18n/en.toml b/docs/i18n/en.toml
@@ -10,7 +10,7 @@ on_this_page    = "On this page"
 search          = "Search"
 search_the_docs = "Search the documentation"
 theme           = "Theme"
-built_with      = "Built with sqzass"
+built_with      = "This site is built with sqzass, from docs/ in the repository. The files listed above came out of this build."
 pagination      = "Pagination"
 previous        = "Previous"
 next            = "Next"
@@ -20,3 +20,9 @@ not_found_body  = "That page does not exist, or it moved and left no forwarding
 overview        = "Overview"
 copy            = "Copy"
 copied          = "Copied"
+footer_project      = "Project"
+footer_releases     = "Releases"
+footer_issues       = "Issues"
+footer_this_build   = "This build"
+footer_search_index = "Search index"
+tagline             = "A static site generator written in Rust"
diff --git a/docs/i18n/ko.toml b/docs/i18n/ko.toml
@@ -10,7 +10,7 @@ on_this_page    = "이 페이지"
 search          = "검색"
 search_the_docs = "문서 검색"
 theme           = "테마"
-built_with      = "sqzass로 빌드됨"
+built_with      = "이 사이트는 저장소의 docs/를 sqzass가 빌드한 것입니다. 위에 걸린 파일들은 그 빌드가 내놓은 것입니다."
 pagination      = "이어 보기"
 previous        = "이전"
 next            = "다음"
@@ -20,3 +20,9 @@ not_found_body  = "그런 페이지가 없거나, 옮겨 가면서 안내를 남
 overview        = "개요"
 copy            = "복사"
 copied          = "복사됨"
+footer_project      = "프로젝트"
+footer_releases     = "릴리스"
+footer_issues       = "이슈"
+footer_this_build   = "이 빌드가 만든 것"
+footer_search_index = "검색 색인"
+tagline             = "Rust로 만든 정적 사이트 생성기"
diff --git a/docs/static/css/main.css b/docs/static/css/main.css
@@ -640,35 +640,79 @@ h4:hover > .anchor, h5:hover > .anchor, h6:hover > .anchor,
 
 .colophon {
   border-top: 1px solid var(--rule);
-  padding: 1.5rem var(--gutter);
+  max-width: 84rem;
+  margin: 0 auto;
+  padding: 2.5rem var(--gutter) 3.5rem;
+  font-size: var(--s-1);
+}
+
+/* 세 덩이. 브랜드 열이 넓고 링크 열이 좁은 건 왼쪽이 읽는 것이고 오른쪽이
+   찾는 것이기 때문이다. */
+/* 열 폭을 비율로 두면 넓은 화면에서 링크 열이 오른쪽 끝까지 밀려 서로 상관없는
+   덩이처럼 보인다. 왼쪽부터 채우고 남는 공간은 오른쪽에 둔다. */
+.colophon-grid {
+  display: grid;
+  grid-template-columns: minmax(0, 20rem) repeat(2, minmax(0, 9rem));
+  justify-content: start;
+  gap: clamp(1.5rem, 5vw, 4rem);
+}
+
+.colophon-mark {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.5rem;
   font-family: var(--mono);
-  font-size: 0.75rem;
+  font-size: var(--s0);
+  font-weight: 600;
+  letter-spacing: -0.03em;
+  color: var(--ink-2);
+  text-decoration: none;
+}
+.colophon-mark:hover { color: var(--ink); text-decoration: none; }
+
+.colophon-brand img {
+  width: 1.7rem;
+  height: 1.7rem;
+  filter: invert(1);
+  opacity: 0.6;
+}
+:root[data-theme="light"] .colophon-brand img { filter: none; }
+
+.colophon-brand p {
+  margin: 0.6rem 0 0;
+  max-width: 24rem;
   color: var(--ink-3);
-  display: flex;
-  flex-wrap: wrap;
-  gap: 0.4rem 1.5rem;
+  line-height: 1.6;
 }
-.colophon a { color: var(--ink-3); }
 
-/* ---------- responsive ---------- */
+/* 열 제목은 사이드바 갈래 제목과 같은 처리다. 라벨은 사이트 어디서나 같은
+   물건으로 보여야 한다. */
+.colophon h2 {
+  margin: 0 0 0.7rem;
+  font-family: var(--mono);
+  font-size: 0.72rem;
+  font-weight: 500;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+  color: var(--ink-3);
+}
 
-@media (max-width: 68rem) {
-  .layout { grid-template-columns: 14rem minmax(0, 1fr); }
-  .toc { display: none; }
+.colophon ul { list-style: none; margin: 0; padding: 0; }
+.colophon li + li { margin-top: 0.4rem; }
+.colophon a {
+  color: var(--ink-2);
+  text-decoration: none;
+  transition: color var(--tr);
 }
+.colophon a:hover { color: var(--accent); text-decoration: underline; }
 
-@media (max-width: 48rem) {
-  .layout {
-    grid-template-columns: minmax(0, 1fr);
-    padding-top: 1.5rem;
-  }
-  .sidebar {
-    position: static;
-    max-height: none;
-    padding-bottom: 1.5rem;
-    border-bottom: 1px solid var(--rule);
-  }
-  .title-block h1 { font-size: var(--s3); }
+/* 구분선은 푸터 전체를 가로지른다. max-width를 주면 선이 문장 길이에서 끊겨
+   구분이 아니라 밑줄로 읽힌다. */
+.colophon-note {
+  margin: 2.5rem 0 0;
+  padding-top: 1.25rem;
+  border-top: 1px solid var(--rule);
+  color: var(--ink-3);
 }
 
 /* ---------- Korean ----------
@@ -685,7 +729,8 @@ html[lang="ko"] .title-block h1,
 html[lang="ko"] .prose h2,
 html[lang="ko"] .prose h3,
 html[lang="ko"] .prose h4,
-html[lang="ko"] .sidebar > ul > li > a,
+html[lang="ko"] .nav-group > summary,
+html[lang="ko"] .colophon h2,
 html[lang="ko"] .toc::before,
 html[lang="ko"] .prose th,
 html[lang="ko"] .crumbs,
@@ -902,6 +947,8 @@ html[lang="ko"] .pager span {
   /* 목차는 사이드바 서랍과 같은 말을 한 번 더 하는 셈이라 뺀다. */
   .toc { display: none; }
 
+  .colophon-grid { grid-template-columns: minmax(0, 1fr); gap: 2rem; }
+
   /* 갈래 내비도 서랍에 있다. */
   .sections { display: none; }
 
diff --git a/docs/templates/base.html b/docs/templates/base.html
@@ -13,7 +13,7 @@
 <head>
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">
-<title>{% if page.url == home %}{{ site.title }} — {{ site.description }}{% else %}{{ page.title }} · {{ site.title }}{% endif %}</title>
+<title>{% if page.url == home %}{{ site.title }} — {{ t("tagline") }}{% else %}{{ page.title }} · {{ site.title }}{% endif %}</title>
 {% if page.description %}<meta name="description" content="{{ page.description }}">{% endif %}
 <link rel="canonical" href="{{ page.permalink }}">
 {#- 파비콘은 CSS 필터가 닿지 않는다. 탭 배경이 어두울 때 검은 선화는 보이지
@@ -146,9 +146,45 @@
 </div>
 
 <footer class="colophon">
-  <span>{{ t("built_with") }}</span>
-  <a href="https://github.com/sqzer-x/sqzass">Source</a>
-  <span>MIT</span>
+  <div class="colophon-grid">
+    <div class="colophon-brand">
+      <a class="colophon-mark" href="{{ home }}">
+        <img src="{{ asset("images/logo.png") }}" alt="" width="121" height="120">
+        <span>{{ site.title }}</span>
+      </a>
+      {#- site.description은 사이트에 하나뿐이라 언어를 타지 않는다. 한국어
+          페이지에 영어 한 줄이 남는 자리라서 i18n에서 가져온다. #}
+      <p>{{ t("tagline") }}</p>
+    </div>
+
+    {#- 문서 갈래는 넣지 않는다. 상단바가 sticky라 화면에서 사라지지 않고,
+        사이드바에도 있다. 같은 목록을 세 번째로 두는 건 채우는 것이지
+        보태는 것이 아니다. #}
+    <div>
+      <h2>{{ t("footer_project") }}</h2>
+      <ul>
+        <li><a href="https://github.com/sqzer-x/sqzass">GitHub</a></li>
+        <li><a href="https://github.com/sqzer-x/sqzass/releases">{{ t("footer_releases") }}</a></li>
+        <li><a href="https://github.com/sqzer-x/sqzass/issues">{{ t("footer_issues") }}</a></li>
+        <li><a href="https://github.com/sqzer-x/sqzass/blob/main/LICENSE">MIT</a></li>
+      </ul>
+    </div>
+
+    {#- 이 빌드가 실제로 내보낸 파일들. 자기 자신을 빌드하는 도구의 문서라서
+        여기 링크가 곧 증거가 된다 — 문서가 "이런 걸 만듭니다"라고 말한 것을
+        눌러서 확인할 수 있다. #}
+    <div>
+      <h2>{{ t("footer_this_build") }}</h2>
+      <ul>
+        <li><a href="{{ site.base_path }}/sitemap.xml">sitemap.xml</a></li>
+        <li><a href="{{ site.base_path }}/robots.txt">robots.txt</a></li>
+        <li><a href="{{ site.base_path }}/llms.txt">llms.txt</a></li>
+        <li><a href="{{ site.base_path }}/search-{{ page.language }}.json">{{ t("footer_search_index") }}</a></li>
+      </ul>
+    </div>
+  </div>
+
+  <p class="colophon-note">{{ t("built_with") }}</p>
 </footer>
 
 <dialog id="search-dialog" class="search-dialog" aria-label="{{ t("search_the_docs") }}">