diff options
Diffstat (limited to 'comic')
| -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 |
3 files changed, 46 insertions, 2 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> |