{ "version": "https://jsonfeed.org/version/1.1", "title": "SIGIL", "home_page_url": "https://ouatis.com/hugo-theme-sigil/", "feed_url": "https://ouatis.com/hugo-theme-sigil/feed.json", "language": "en", "items": [ { "id": "https://ouatis.com/hugo-theme-sigil/posts/typography/", "url": "https://ouatis.com/hugo-theme-sigil/posts/typography/", "title": "Typography", "content_html": "\u003cp\u003eOne page that exercises everything a theme has to carry, so you can judge the\ntypesetting before you install. The body is set at 18px on a 720px measure,\nline-height 2.05, justified like a printed page.\u003c/p\u003e\n\u003ch2 id=\"text\"\u003eText\u003c/h2\u003e\n\u003cp\u003eBody text can carry \u003cem\u003eemphasis\u003c/em\u003e, \u003cstrong\u003estrength\u003c/strong\u003e, \u003cdel\u003estruck-through regret\u003c/del\u003e,\n\u003cmark\u003emarked passages\u003c/mark\u003e, \u003ccode\u003einline code\u003c/code\u003e, and\n\u003ca href=\"https://gohugo.io/\" class=\"sg-ext\"\u003elinks\u003c/a\u003e. Chinese, 日本語，and English share one family:\nIBM Plex Sans, subset per script and loaded only where a page needs it.\u003c/p\u003e\n\u003cblockquote\u003e\n\u003cp\u003eEverything comes in threes. The theme keeps to three accents — vermilion\nfor what responds, ink-green for what informs, amber for what glows — and a\nsingle ∴ where a section ends.\u003c/p\u003e\n\u003c/blockquote\u003e\n\u003ch2 id=\"lists\"\u003eLists\u003c/h2\u003e\n\u003col\u003e\n\u003cli\u003eFootnotes become Tufte-style margin notes on wide screens\u003csup id=\"fnref:1\"\u003e\u003ca href=\"#fn:1\" class=\"footnote-ref\" role=\"doc-noteref\"\u003e1\u003c/a\u003e\u003c/sup\u003e and fall\nback to endnotes on narrow ones.\u003c/li\u003e\n\u003cli\u003eThe dark-mode toggle is a circular reveal, not a hard cut.\u003c/li\u003e\n\u003cli\u003eArchives carry the year as a ghost numeral in the background.\u003c/li\u003e\n\u003c/ol\u003e\n\u003cul\u003e\n\u003cli\u003ethree accent colors, no fourth\u003c/li\u003e\n\u003cli\u003eIBM Plex, self-hosted and subset\u003c/li\u003e\n\u003cli\u003eno third-party requests\u003csup id=\"fnref:2\"\u003e\u003ca href=\"#fn:2\" class=\"footnote-ref\" role=\"doc-noteref\"\u003e2\u003c/a\u003e\u003c/sup\u003e\u003c/li\u003e\n\u003c/ul\u003e\n\u003ch2 id=\"code\"\u003eCode\u003c/h2\u003e\n\u003cp\u003eCode blocks use class-based Chroma highlighting in a Catppuccin Macchiato\npalette, with a copy button when enabled:\u003c/p\u003e\n\u003cdiv class=\"highlight\"\u003e\u003cpre tabindex=\"0\" class=\"chroma\"\u003e\u003ccode class=\"language-python\" data-lang=\"python\"\u003e\u003cspan class=\"line\"\u003e\u003cspan class=\"cl\"\u003e\u003cspan class=\"k\"\u003edef\u003c/span\u003e \u003cspan class=\"nf\"\u003emotto\u003c/span\u003e\u003cspan class=\"p\"\u003e(\u003c/span\u003e\u003cspan class=\"n\"\u003en\u003c/span\u003e\u003cspan class=\"p\"\u003e:\u003c/span\u003e \u003cspan class=\"nb\"\u003eint\u003c/span\u003e\u003cspan class=\"p\"\u003e)\u003c/span\u003e \u003cspan class=\"o\"\u003e-\u0026gt;\u003c/span\u003e \u003cspan class=\"nb\"\u003estr\u003c/span\u003e\u003cspan class=\"p\"\u003e:\u003c/span\u003e\n\u003c/span\u003e\u003c/span\u003e\u003cspan class=\"line\"\u003e\u003cspan class=\"cl\"\u003e \u003cspan class=\"s2\"\u003e\u0026#34;\u0026#34;\u0026#34;What can change the nature of a man?\u0026#34;\u0026#34;\u0026#34;\u003c/span\u003e\n\u003c/span\u003e\u003c/span\u003e\u003cspan class=\"line\"\u003e\u003cspan class=\"cl\"\u003e \u003cspan class=\"k\"\u003ereturn\u003c/span\u003e \u003cspan class=\"s2\"\u003e\u0026#34;∴ \u0026#34;\u003c/span\u003e \u003cspan class=\"o\"\u003e*\u003c/span\u003e \u003cspan class=\"n\"\u003en\u003c/span\u003e\n\u003c/span\u003e\u003c/span\u003e\u003c/code\u003e\u003c/pre\u003e\u003c/div\u003e\u003cdiv class=\"highlight\"\u003e\u003cpre tabindex=\"0\" class=\"chroma\"\u003e\u003ccode class=\"language-css\" data-lang=\"css\"\u003e\u003cspan class=\"line\"\u003e\u003cspan class=\"cl\"\u003e\u003cspan class=\"p\"\u003e.\u003c/span\u003e\u003cspan class=\"nc\"\u003epost-content\u003c/span\u003e \u003cspan class=\"p\"\u003e{\u003c/span\u003e\n\u003c/span\u003e\u003c/span\u003e\u003cspan class=\"line\"\u003e\u003cspan class=\"cl\"\u003e \u003cspan class=\"k\"\u003efont-size\u003c/span\u003e\u003cspan class=\"p\"\u003e:\u003c/span\u003e \u003cspan class=\"mi\"\u003e18\u003c/span\u003e\u003cspan class=\"kt\"\u003epx\u003c/span\u003e\u003cspan class=\"p\"\u003e;\u003c/span\u003e\n\u003c/span\u003e\u003c/span\u003e\u003cspan class=\"line\"\u003e\u003cspan class=\"cl\"\u003e \u003cspan class=\"k\"\u003eline-height\u003c/span\u003e\u003cspan class=\"p\"\u003e:\u003c/span\u003e \u003cspan class=\"mf\"\u003e2.05\u003c/span\u003e\u003cspan class=\"p\"\u003e;\u003c/span\u003e\n\u003c/span\u003e\u003c/span\u003e\u003cspan class=\"line\"\u003e\u003cspan class=\"cl\"\u003e \u003cspan class=\"k\"\u003etext-align\u003c/span\u003e\u003cspan class=\"p\"\u003e:\u003c/span\u003e \u003cspan class=\"kc\"\u003ejustify\u003c/span\u003e\u003cspan class=\"p\"\u003e;\u003c/span\u003e\n\u003c/span\u003e\u003c/span\u003e\u003cspan class=\"line\"\u003e\u003cspan class=\"cl\"\u003e\u003cspan class=\"p\"\u003e}\u003c/span\u003e\n\u003c/span\u003e\u003c/span\u003e\u003c/code\u003e\u003c/pre\u003e\u003c/div\u003e\u003ch2 id=\"notation\"\u003eNotation\u003c/h2\u003e\n\u003cp\u003eMath renders only where a page asks for it (\u003ccode\u003emath: true\u003c/code\u003e), display style:\u003c/p\u003e\n$$\n\\zeta(s) = \\sum_{n=1}^{\\infty} \\frac{1}{n^s}, \\qquad \\Re(s) \u003e 1\n$$\u003cp\u003eand inline like \\(\\alpha \\pm \\beta\\), without leaving the sentence. A long\nformula scrolls sideways on narrow screens instead of breaking the measure:\n\\(e^{i\\pi} + 1 = 0\\).\u003c/p\u003e\n\u003ch2 id=\"diagram\"\u003eDiagram\u003c/h2\u003e\n\u003cp\u003eDiagrams pick up the theme\u0026rsquo;s palette and re-render when the theme flips\n(\u003ccode\u003emermaid: true\u003c/code\u003e):\u003c/p\u003e\n\u003cpre tabindex=\"0\"\u003e\u003ccode class=\"language-mermaid\" data-lang=\"mermaid\"\u003egraph LR\n A[Install] --\u0026gt; B[Write]\n B --\u0026gt; C[Publish]\n B --\u0026gt; D[Stay quiet]\n\u003c/code\u003e\u003c/pre\u003e\u003ch2 id=\"figures\"\u003eFigures\u003c/h2\u003e\n\u003cp\u003eImages open in a lightbox when the page opts in (\u003ccode\u003elightbox: true\u003c/code\u003e); with more\nthan one, arrows appear, and the caption under each figure travels with it.\u003c/p\u003e\n\u003cfigure\u003e\n \u003cimg loading=\"lazy\" src=\"west-door.png\"\n alt=\"The west door, vermilion on paper.\"/\u003e \u003cfigcaption\u003e\n \u003cp\u003eThe west door, vermilion on paper.\u003c/p\u003e\n \u003c/figcaption\u003e\n\u003c/figure\u003e\n\n\u003cfigure\u003e\n \u003cimg loading=\"lazy\" src=\"east-door.png\"\n alt=\"The east door, ink-green on paper.\"/\u003e \u003cfigcaption\u003e\n \u003cp\u003eThe east door, ink-green on paper.\u003c/p\u003e\n \u003c/figcaption\u003e\n\u003c/figure\u003e\n\n\u003ch2 id=\"table\"\u003eTable\u003c/h2\u003e\n\u003ctable\u003e\n\t\u003cthead\u003e\n\t\t\t\u003ctr\u003e\n\t\t\t\t\t\u003cth\u003eElement\u003c/th\u003e\n\t\t\t\t\t\u003cth\u003eLight\u003c/th\u003e\n\t\t\t\t\t\u003cth\u003eDark\u003c/th\u003e\n\t\t\t\u003c/tr\u003e\n\t\u003c/thead\u003e\n\t\u003ctbody\u003e\n\t\t\t\u003ctr\u003e\n\t\t\t\t\t\u003ctd\u003eLinks\u003c/td\u003e\n\t\t\t\t\t\u003ctd\u003evermilion \u003ccode\u003e#ad3e32\u003c/code\u003e\u003c/td\u003e\n\t\t\t\t\t\u003ctd\u003evermilion \u003ccode\u003e#e07061\u003c/code\u003e\u003c/td\u003e\n\t\t\t\u003c/tr\u003e\n\t\t\t\u003ctr\u003e\n\t\t\t\t\t\u003ctd\u003eMeta\u003c/td\u003e\n\t\t\t\t\t\u003ctd\u003eink-green \u003ccode\u003e#2f6754\u003c/code\u003e\u003c/td\u003e\n\t\t\t\t\t\u003ctd\u003eink-green \u003ccode\u003e#648f77\u003c/code\u003e\u003c/td\u003e\n\t\t\t\u003c/tr\u003e\n\t\t\t\u003ctr\u003e\n\t\t\t\t\t\u003ctd\u003eMark\u003c/td\u003e\n\t\t\t\t\t\u003ctd\u003eamber highlight\u003c/td\u003e\n\t\t\t\t\t\u003ctd\u003esofter amber\u003c/td\u003e\n\t\t\t\u003c/tr\u003e\n\t\u003c/tbody\u003e\n\u003c/table\u003e\n\u003ch2 id=\"details\"\u003eDetails\u003c/h2\u003e\n\n\n\u003cp\u003e\u003cdetails \u003e\n \u003csummary markdown=\"span\"\u003eWhy ∴ ?\u003c/summary\u003e\n Here it simply marks the end of a section.\nEverything comes in threes.\n\u003c/details\u003e\u003c/p\u003e\n\n\u003chr\u003e\n\u003cp\u003eA theme should disappear while you read. If you noticed it just now, that is\nwhat the margin notes are for.\u003c/p\u003e\n\u003cdiv class=\"footnotes\" role=\"doc-endnotes\"\u003e\n\u003chr\u003e\n\u003col\u003e\n\u003cli id=\"fn:1\"\u003e\n\u003cp\u003eLike this one — resize the window below 1280px and it returns to the endnotes.\u0026#160;\u003ca href=\"#fnref:1\" class=\"footnote-backref\" role=\"doc-backlink\"\u003e\u0026#x21a9;\u0026#xfe0e;\u003c/a\u003e\u003c/p\u003e\n\u003c/li\u003e\n\u003cli id=\"fn:2\"\u003e\n\u003cp\u003eFonts are the only self-hosted asset; no analytics, no trackers.\u0026#160;\u003ca href=\"#fnref:2\" class=\"footnote-backref\" role=\"doc-backlink\"\u003e\u0026#x21a9;\u0026#xfe0e;\u003c/a\u003e\u003c/p\u003e\n\u003c/li\u003e\n\u003c/ol\u003e\n\u003c/div\u003e\n","summary": "\u003cp\u003eOne page that exercises everything a theme has to carry, so you can judge the\ntypesetting before you install. The body is set at 18px on a 720px measure,\nline-height 2.05, justified like a printed page.\u003c/p\u003e\n\u003ch2 id=\"text\"\u003eText\u003c/h2\u003e\n\u003cp\u003eBody text can carry \u003cem\u003eemphasis\u003c/em\u003e, \u003cstrong\u003estrength\u003c/strong\u003e, \u003cdel\u003estruck-through regret\u003c/del\u003e,\n\u003cmark\u003emarked passages\u003c/mark\u003e, \u003ccode\u003einline code\u003c/code\u003e, and\n\u003ca href=\"https://gohugo.io/\" class=\"sg-ext\"\u003elinks\u003c/a\u003e. Chinese, 日本語，and English share one family:\nIBM Plex Sans, subset per script and loaded only where a page needs it.\u003c/p\u003e", "date_published": "2026-01-14T00:00:00+00:00","date_modified": "2026-01-14T00:00:00+00:00","tags": ["demo","typography"],"language": "en" }, { "id": "https://ouatis.com/hugo-theme-sigil/posts/what-can-change/", "url": "https://ouatis.com/hugo-theme-sigil/posts/what-can-change/", "title": "What can change the nature of a man?", "content_html": "\u003cp\u003e\u003cem\u003ePlanescape: Torment\u003c/em\u003e\u003csup id=\"fnref:1\"\u003e\u003ca href=\"#fn:1\" class=\"footnote-ref\" role=\"doc-noteref\"\u003e1\u003c/a\u003e\u003c/sup\u003e asks one question from its first screen to its last.\nIt is never answered outright — only lived through.\u003c/p\u003e\n\u003cblockquote\u003e\n\u003cp\u003eWhat can change the nature of a man? If there is anything I have learned in\nmy travels across the Planes, it is that many things may change the nature\nof a man. Whether regret, or love, or revenge or fear — whatever you believe\ncan change the nature of a man, can.\u003c/p\u003e\n\u003c/blockquote\u003e\n\u003cblockquote\u003e\n\u003cp\u003eI\u0026rsquo;ve seen belief move cities, make men stave off death, and turn an evil\nhag\u0026rsquo;s heart half-circle. This entire Fortress has been constructed from\nbelief\u0026hellip;\u003csup id=\"fnref:2\"\u003e\u003ca href=\"#fn:2\" class=\"footnote-ref\" role=\"doc-noteref\"\u003e2\u003c/a\u003e\u003c/sup\u003e\u003c/p\u003e\n\u003c/blockquote\u003e\n\u003ch2 id=\"the-closing-verse\"\u003eThe closing verse\u003c/h2\u003e\n\u003cp\u003eThe last line of the game is Li Shangyin\u0026rsquo;s 無題 — a Tang-dynasty poem on\nparting, time, and the end of feeling.\u003csup id=\"fnref:3\"\u003e\u003ca href=\"#fn:3\" class=\"footnote-ref\" role=\"doc-noteref\"\u003e3\u003c/a\u003e\u003c/sup\u003e\u003c/p\u003e\n\u003cblockquote\u003e\n\u003cp\u003eIt is difficult to meet as it is difficult to part,\nThe north wind has weakened; hundreds of flowers fade way,\nWhen the Spring worms die, the silk shall never come again,\nWhen the candle wax becomes ash, tears shall stop.\u003c/p\u003e\n\u003c/blockquote\u003e\n\u003ch2 id=\"note\"\u003eNote\u003c/h2\u003e\n\u003cp\u003eFootnotes in this theme become Tufte-style margin notes on wide screens —\nthis line was placed there so you can see one at work.\u003c/p\u003e\n\u003cdiv class=\"footnotes\" role=\"doc-endnotes\"\u003e\n\u003chr\u003e\n\u003col\u003e\n\u003cli id=\"fn:1\"\u003e\n\u003cp\u003e\u003cem\u003ePlanescape: Torment\u003c/em\u003e (Black Isle Studios, 1999).\u0026#160;\u003ca href=\"#fnref:1\" class=\"footnote-backref\" role=\"doc-backlink\"\u003e\u0026#x21a9;\u0026#xfe0e;\u003c/a\u003e\u003c/p\u003e\n\u003c/li\u003e\n\u003cli id=\"fn:2\"\u003e\n\u003cp\u003eVia \u003ca href=\"https://en.wikiquote.org/wiki/Planescape:_Torment\" class=\"sg-ext\"\u003eWikiquote\u003c/a\u003e.\u0026#160;\u003ca href=\"#fnref:2\" class=\"footnote-backref\" role=\"doc-backlink\"\u003e\u0026#x21a9;\u0026#xfe0e;\u003c/a\u003e\u003c/p\u003e\n\u003c/li\u003e\n\u003cli id=\"fn:3\"\u003e\n\u003cp\u003eLi Shangyin (c. 813–858), 無題: 「相見時難别亦難，東風無力百花殘。春蠶到死絲方盡，蠟炬成灰淚始乾。」 — English rendering from the game\u0026rsquo;s closing.\u0026#160;\u003ca href=\"#fnref:3\" class=\"footnote-backref\" role=\"doc-backlink\"\u003e\u0026#x21a9;\u0026#xfe0e;\u003c/a\u003e\u003c/p\u003e\n\u003c/li\u003e\n\u003c/ol\u003e\n\u003c/div\u003e\n","summary": "\u003cp\u003e\u003cem\u003ePlanescape: Torment\u003c/em\u003e\u003csup id=\"fnref:1\"\u003e\u003ca href=\"#fn:1\" class=\"footnote-ref\" role=\"doc-noteref\"\u003e1\u003c/a\u003e\u003c/sup\u003e asks one question from its first screen to its last.\nIt is never answered outright — only lived through.\u003c/p\u003e\n\u003cblockquote\u003e\n\u003cp\u003eWhat can change the nature of a man? If there is anything I have learned in\nmy travels across the Planes, it is that many things may change the nature\nof a man. Whether regret, or love, or revenge or fear — whatever you believe\ncan change the nature of a man, can.\u003c/p\u003e", "date_published": "2026-01-12T00:00:00+00:00","date_modified": "2026-01-12T00:00:00+00:00","tags": ["demo","poetry"],"language": "en" }] }