diff options
| -rw-r--r-- | comic/assets/css/comic.css | 30 | ||||
| -rw-r--r-- | comic/issues/1/meta.json | 3 | ||||
| -rw-r--r-- | comic/templates/issue.html.j2 | 15 | ||||
| -rw-r--r-- | modules/comic_generate.py | 11 |
4 files changed, 55 insertions, 4 deletions
diff --git a/comic/assets/css/comic.css b/comic/assets/css/comic.css index 9449cab..a828323 100644 --- a/comic/assets/css/comic.css +++ b/comic/assets/css/comic.css @@ -31,6 +31,36 @@ hr { color: #e9d3ff; } +ul.navigation { + margin-top: 0; + padding: 0; +} + +ul.navigation li { + display: inline; + padding-left: 0.2rem; + padding-right: 0.2rem; +} + +ul.navigation li a { + width: 4rem; + margin-left: auto; + margin-right: auto; + display: inline-block; + text-align: center; + background: #a665c6; + color: white; + border: 0.1rem solid white; + border-radius: 0.5rem; +} + +ul.navigation li a:hover { + background: white; + color: #a665c6; + border: 0.1rem solid #a665c6; + text-decoration: none; +} + img.banner { width: 100%; } diff --git a/comic/issues/1/meta.json b/comic/issues/1/meta.json index e3079db..416f3d9 100644 --- a/comic/issues/1/meta.json +++ b/comic/issues/1/meta.json @@ -1,5 +1,6 @@ { "title" : "The beginning", "publish_date" : "2025-11-28", - "description" : "I have like twenty comic ideas figured out but not the title of the series." + "description" : "I have like twenty comic ideas figured out but not the title of the series.", + "extra_attributes": "title=\"There are no tooltip texts in this series.\"" } diff --git a/comic/templates/issue.html.j2 b/comic/templates/issue.html.j2 index 70b4745..9320850 100644 --- a/comic/templates/issue.html.j2 +++ b/comic/templates/issue.html.j2 @@ -19,14 +19,27 @@ <div class="row"> <main class="col-md-7"> <h1>{{ issue.title() }}</h1> - <img class="comic" src="{{ url }}/comic.png" alt="comic"/> + <ul class="navigation"> + <li><a href="/issues/1"><<</a></li> + <li><a href="{{ previous }}"><</a></li> + <li><a href="{{ next }}">></a></li> + <li><a href="/">>></a></li> + </ul> + <img class="comic" src="{{ url }}/comic.png" alt="comic" {{ issue.extra_attributes() }}/> <p class="description">{{ issue.description() }}</p> + <ul class="navigation"> + <li><a href="/issues/1"><<</a></li> + <li><a href="{{ previous }}"><</a></li> + <li><a href="{{ next }}">></a></li> + <li><a href="/">>></a></li> + </ul> </main> </div> <div class="row"> <footer class="col-md-7"> <p>Permalink to this comic: <a href="{{ url }}">{{ url }}</a></p> <p>Image url: <a href="{{ url }}/comic.png">{{ url }}/comic.png</a></p> + <p>{{ issue.get_publish_time() }}</p> <hr> <p><a href="/feed.xml">RSS feed</a></p> <hr> diff --git a/modules/comic_generate.py b/modules/comic_generate.py index 76705fa..ef539ba 100644 --- a/modules/comic_generate.py +++ b/modules/comic_generate.py @@ -14,6 +14,7 @@ IMAGE_FILE_NAME = "comic.png" TITLE_KEY = "title" DESCRIPTION_KEY = "description" PUBLISH_DATE_KEY = "publish_date" +EXTRA_ATTR_KEY = "extra_attributes" class Issue: @@ -39,6 +40,9 @@ class Issue: def get_link(self) -> str: return f"{Config.COMIC_ROOT_URL}/issues/{self.index}" + def extra_attributes(self) -> str: + return self.meta_data[EXTRA_ATTR_KEY] if EXTRA_ATTR_KEY in self.meta_data.keys() else "" + def get_issues(path: str, local: bool) -> list[Issue]: return_list = [] @@ -68,13 +72,16 @@ def generate(jinja_env: jinja2.Environment, output_root_path: str, local: bool): issue_template = jinja_env.get_template("issue.html.j2") last_render = None - for issue in issues: + last_issue_idx = len(issues) - 1 + for idx, issue in enumerate(issues): output_dir = os.path.join(output_root_path, "issues", issue.index) os.makedirs(output_dir, exist_ok=True) ctx = { "issue": issue, - "url": issue.get_link() + "url": issue.get_link(), + "previous": "/#" if idx == 0 else f"/issues/{str(idx)}", + "next": "/#" if idx == last_issue_idx else f"/issues/{str(idx + 2)}" } last_render = issue_template.render(ctx) |