templates/post.html (2624B)
1 {#- 글 한 편. 날짜는 mono 로 찍는다 — 월 약어를 쓰려면 i18n 키가 언어당 12개
2 필요한데, 숫자는 두 언어에서 같게 읽히고 tabular-nums 로 자리가 맞는다. #}
3 {% extends "base.html" %}
4 {% from "partials/toc.html" import toc_list %}
5 {% from "partials/lang.html" import lang_switch %}
6
7 {% block content %}
8 <article class="wrap wrap-read">
9 <header class="page-head" data-reveal>
10 {%- if page.section %}
11 <nav class="crumbs" aria-label="{{ t("breadcrumb") }}">
12 <a href="{{ page.section.url }}">{{ page.section.title }}</a>
13 </nav>
14 {%- endif %}
15 <h1 class="page-title">{{ page.title }}</h1>
16 {%- if page.description %}
17 <p class="page-lede">{{ page.description }}</p>
18 {%- endif %}
19 {#- 날짜와 언어는 같은 줄에 선다. 둘 다 "이 문서가 무엇인가"에 대한 사실이고,
20 따로 세우면 제목과 본문 사이에 줄이 하나 더 생긴다.
21 바깥 if 가 필요한 이유: 이 div 안에는 줄바꿈이 있어서 둘 다 없을 때
22 :empty 가 안 걸린다. 목록 템플릿은 한 줄로 붙어 있어 걸린다. #}
23 {%- if page.date or page.translations %}
24 <div class="page-meta">
25 {%- if page.date %}
26 <time datetime="{{ page.date.date }}">{{ page.date.year }}.{% if page.date.month < 10 %}0{% endif %}{{ page.date.month }}.{% if page.date.day < 10 %}0{% endif %}{{ page.date.day }}</time>
27 {%- endif %}
28 {{ lang_switch(page) }}
29 </div>
30 {%- endif %}
31 </header>
32
33 <div class="fence" aria-hidden="true">+++</div>
34
35 {%- if page.toc and page.toc_entries %}
36 <nav class="toc" aria-label="{{ t("on_this_page") }}">
37 <p class="toc-label">{{ t("on_this_page") }}</p>
38 {{ toc_list(page.toc_entries) }}
39 </nav>
40 {%- endif %}
41
42 <div class="prose">
43 {{ page.content | safe }}
44 </div>
45
46 {%- if page.prev or page.next %}
47 <nav class="pager" aria-label="{{ t("menu") }}">
48 {#- 이전/다음의 라벨은 방향이 아니라 목적지를 말한다. "다음"만 적힌 링크는
49 누르기 전에는 어디로 가는지 알 수 없다. #}
50 {%- if page.prev %}
51 <a class="pager-link pager-prev" href="{{ page.prev.url }}">
52 <span class="pager-dir">{{ t("previous") }}</span>
53 <span class="pager-title">{{ page.prev.title }}</span>
54 </a>
55 {%- endif %}
56 {%- if page.next %}
57 <a class="pager-link pager-next" href="{{ page.next.url }}">
58 <span class="pager-dir">{{ t("next") }}</span>
59 <span class="pager-title">{{ page.next.title }}</span>
60 </a>
61 {%- endif %}
62 </nav>
63 {%- endif %}
64 </article>
65 {% endblock %}