summaryrefslogtreecommitdiffstats
path: root/templates
diff options
context:
space:
mode:
authorVolpeon <git@volpeon.ink>2022-08-23 14:07:20 +0200
committerVolpeon <git@volpeon.ink>2022-08-23 14:07:20 +0200
commit7c655a95058aa753355251eb78b83d31d44972ab (patch)
tree9024a3d991727d1f10f99d62497bdd5228e01640 /templates
parentUpdate (diff)
downloadvolpeon.ink-7c655a95058aa753355251eb78b83d31d44972ab.tar.gz
volpeon.ink-7c655a95058aa753355251eb78b83d31d44972ab.tar.bz2
volpeon.ink-7c655a95058aa753355251eb78b83d31d44972ab.zip
Better navigation of related content
Diffstat (limited to 'templates')
-rw-r--r--templates/partials/gallery_card.html52
-rw-r--r--templates/partials/grid_card.html76
-rw-r--r--templates/partials/list_card.html16
-rw-r--r--templates/partials/related.html17
4 files changed, 79 insertions, 82 deletions
diff --git a/templates/partials/gallery_card.html b/templates/partials/gallery_card.html
index 38daa0e..6802faa 100644
--- a/templates/partials/gallery_card.html
+++ b/templates/partials/gallery_card.html
@@ -19,30 +19,47 @@
19 /> 19 />
20 </div> 20 </div>
21 </div> 21 </div>
22
22 <div class="c-card__row l-media c-card__row--hidden"> 23 <div class="c-card__row l-media c-card__row--hidden">
23 $if(it.indicator)$ 24 $if(it.indicator)$
24 <div class="c-card__indicator l-media__block"></div> 25 <div class="c-card__indicator l-media__block"></div>
25 $endif$ 26 $endif$
26 $if(it.icon)$ 27 $if(it.is_prev)$
28 <svg class="l-media__block o-icon" width="1em" height="1em" aria-hidden="true">
29 <use href="$assets.icons_svg$#arrow-left"></use>
30 </svg>
31 $elseif(it.is_next)$
32 <svg class="l-media__block o-icon" width="1em" height="1em" aria-hidden="true">
33 <use href="$assets.icons_svg$#blank"></use>
34 </svg>
35 $elseif(it.icon)$
27 <svg class="l-media__block o-icon" width="1em" height="1em" aria-hidden="true"> 36 <svg class="l-media__block o-icon" width="1em" height="1em" aria-hidden="true">
28 <use href="$assets.icons_svg$#$it.icon$"></use> 37 <use href="$assets.icons_svg$#$it.icon$"></use>
29 </svg> 38 </svg>
30 $endif$ 39 $endif$
31 <div class="l-media__block l-media__block--main"> 40 <div class="l-media__block l-media__block--main">
32 $if(it.subtitle)$ 41 $if(it.is_prev)$
42 <small class="u-d-block">Previous</small>
43 <div>
44 <strong class="p-name" itemprop="name headline">$it.title$</strong>
45 $if(it.draft)$<span class="o-badge u-ml-100">Draft</span>$endif$
46 </div>
47 $elseif(it.is_next)$
48 <small class="u-d-block">Next</small>
49 <div>
50 <strong class="p-name" itemprop="name headline">$it.title$</strong>
51 $if(it.draft)$<span class="o-badge u-ml-100">Draft</span>$endif$
52 </div>
53 $elseif(it.subtitle)$
33 <div> 54 <div>
34 <strong class="p-name" itemprop="name headline">$it.title$</strong> 55 <strong class="p-name" itemprop="name headline">$it.title$</strong>
35 $if(it.draft)$ 56 $if(it.draft)$
36 <span class="o-badge u-ml-100">Draft</span> 57 <span class="o-badge u-ml-100">Draft</span>
37 $endif$ 58 $endif$
38 </div> 59 </div>
39 <small class="u-d-block"> 60 <small class="u-d-block">$it.subtitle$</small>
40 $it.subtitle$
41 </small>
42 $elseif(it.category)$ 61 $elseif(it.category)$
43 <small class="u-d-block"> 62 <small class="u-d-block">$it.category$</small>
44 $it.category$
45 </small>
46 <div> 63 <div>
47 <strong class="p-name" itemprop="name headline"> 64 <strong class="p-name" itemprop="name headline">
48 $it.title$ 65 $it.title$
@@ -59,20 +76,19 @@
59 </small> 76 </small>
60 <div> 77 <div>
61 <strong class="p-name" itemprop="name headline">$it.title$</strong> 78 <strong class="p-name" itemprop="name headline">$it.title$</strong>
62 $if(it.draft)$ 79 $if(it.draft)$<span class="o-badge u-ml-100">Draft</span>$endif$
63 <span class="o-badge u-ml-100">Draft</span>
64 $endif$
65 </div> 80 </div>
66 $else$ 81 $else$
67 <span class="p-name" itemprop="name headline"> 82 <span class="p-name" itemprop="name headline">$it.title$</span>
68 $it.title$ 83 $if(it.draft)$<span class="o-badge u-ml-100">Draft</span>$endif$
69 </span>
70 $if(it.draft)$
71 <span class="o-badge u-ml-100">Draft</span>
72 $endif$
73 $endif$ 84 $endif$
74 </div> 85 </div>
75 $if(it.post_icon)$ 86 $if(it.is_next)$
87 <svg class="l-media__block o-icon" width="1em" height="1em" aria-hidden="true">
88 <use href="$assets.icons_svg$#arrow-right"></use>
89 </svg>
90 $elseif(it.is_prev)$
91 $elseif(it.post_icon)$
76 <svg class="l-media__block o-icon" width="1em" height="1em" aria-hidden="true"> 92 <svg class="l-media__block o-icon" width="1em" height="1em" aria-hidden="true">
77 <use href="$assets.icons_svg$#$it.post_icon$"></use> 93 <use href="$assets.icons_svg$#$it.post_icon$"></use>
78 </svg> 94 </svg>
diff --git a/templates/partials/grid_card.html b/templates/partials/grid_card.html
index 9a0b06e..e75fa51 100644
--- a/templates/partials/grid_card.html
+++ b/templates/partials/grid_card.html
@@ -9,38 +9,45 @@
9 $endif$ 9 $endif$
10> 10>
11 <div class="c-card__row l-media"> 11 <div class="c-card__row l-media">
12 $if(it.indicator)$ 12 $if(it.is_prev)$
13 <div class="c-card__indicator l-media__block"></div> 13 <svg class="l-media__block o-icon" width="1em" height="1em" aria-hidden="true">
14 $endif$ 14 <use href="$assets.icons_svg$#arrow-left"></use>
15 $if(it.icon)$ 15 </svg>
16 $elseif(it.is_next)$
17 <svg class="l-media__block o-icon" width="1em" height="1em" aria-hidden="true">
18 <use href="$assets.icons_svg$#blank"></use>
19 </svg>
20 $elseif(it.icon)$
16 <svg class="l-media__block o-icon" width="1em" height="1em" aria-hidden="true"> 21 <svg class="l-media__block o-icon" width="1em" height="1em" aria-hidden="true">
17 <use href="$assets.icons_svg$#$it.icon$"></use> 22 <use href="$assets.icons_svg$#$it.icon$"></use>
18 </svg> 23 </svg>
24 $elseif(it.indicator)$
25 <div class="c-card__indicator l-media__block"></div>
19 $endif$ 26 $endif$
20 <div class="l-media__block l-media__block--main"> 27 <div class="l-media__block l-media__block--main">
21 $if(it.subtitle)$ 28 $if(it.is_prev)$
29 <small class="u-d-block">Previous</small>
22 <div> 30 <div>
23 <strong class="p-name" itemprop="name headline"> 31 <strong class="p-name" itemprop="name headline">$it.title$</strong>
24 $it.title$ 32 $if(it.draft)$<span class="o-badge u-ml-100">Draft</span>$endif$
25 </strong>
26 $if(it.draft)$
27 <span class="o-badge u-ml-100">Draft</span>
28 $endif$
29 </div> 33 </div>
30 <small class="u-d-block"> 34 $elseif(it.is_next)$
31 $it.subtitle$ 35 <small class="u-d-block">Next</small>
32 </small> 36 <div>
37 <strong class="p-name" itemprop="name headline">$it.title$</strong>
38 $if(it.draft)$<span class="o-badge u-ml-100">Draft</span>$endif$
39 </div>
40 $elseif(it.subtitle)$
41 <div>
42 <strong class="p-name" itemprop="name headline">$it.title$</strong>
43 $if(it.draft)$<span class="o-badge u-ml-100">Draft</span>$endif$
44 </div>
45 <small class="u-d-block">$it.subtitle$</small>
33 $elseif(it.category)$ 46 $elseif(it.category)$
34 <small class="u-d-block"> 47 <small class="u-d-block">$it.category$</small>
35 $it.category$
36 </small>
37 <div> 48 <div>
38 <strong class="p-name" itemprop="name headline"> 49 <strong class="p-name" itemprop="name headline">$it.title$</strong>
39 $it.title$ 50 $if(it.draft)$<span class="o-badge u-ml-100">Draft</span>$endif$
40 </strong>
41 $if(it.draft)$
42 <span class="o-badge u-ml-100">Draft</span>
43 $endif$
44 </div> 51 </div>
45 $elseif(it.show_date)$ 52 $elseif(it.show_date)$
46 <small class="u-d-block"> 53 <small class="u-d-block">
@@ -49,23 +56,20 @@
49 </time> 56 </time>
50 </small> 57 </small>
51 <div> 58 <div>
52 <strong class="p-name" itemprop="name headline"> 59 <strong class="p-name" itemprop="name headline">$it.title$</strong>
53 $it.title$ 60 $if(it.draft)$<span class="o-badge u-ml-100">Draft</span>$endif$
54 </strong>
55 $if(it.draft)$
56 <span class="o-badge u-ml-100">Draft</span>
57 $endif$
58 </div> 61 </div>
59 $else$ 62 $else$
60 <span class="p-name" itemprop="name headline"> 63 <span class="p-name" itemprop="name headline">$it.title$</span>
61 $it.title$ 64 $if(it.draft)$<span class="o-badge u-ml-100">Draft</span>$endif$
62 </span>
63 $if(it.draft)$
64 <span class="o-badge u-ml-100">Draft</span>
65 $endif$
66 $endif$ 65 $endif$
67 </div> 66 </div>
68 $if(it.post_icon)$ 67 $if(it.is_next)$
68 <svg class="l-media__block o-icon" width="1em" height="1em" aria-hidden="true">
69 <use href="$assets.icons_svg$#arrow-right"></use>
70 </svg>
71 $elseif(it.is_prev)$
72 $elseif(it.post_icon)$
69 <svg class="l-media__block o-icon" width="1em" height="1em" aria-hidden="true"> 73 <svg class="l-media__block o-icon" width="1em" height="1em" aria-hidden="true">
70 <use href="$assets.icons_svg$#$it.post_icon$"></use> 74 <use href="$assets.icons_svg$#$it.post_icon$"></use>
71 </svg> 75 </svg>
diff --git a/templates/partials/list_card.html b/templates/partials/list_card.html
index e12f62f..713919a 100644
--- a/templates/partials/list_card.html
+++ b/templates/partials/list_card.html
@@ -18,21 +18,13 @@
18 </svg> 18 </svg>
19 $endif$ 19 $endif$
20 <div class="l-media__block l-media__block--main"> 20 <div class="l-media__block l-media__block--main">
21 <span class="p-name" itemprop="name headline"> 21 <span class="p-name" itemprop="name headline">$it.title$</span>
22 $it.title$ 22 $if(it.draft)$<span class="o-badge u-ml-100">Draft</span>$endif$
23 </span>
24 $if(it.draft)$
25 <span class="o-badge u-ml-100">Draft</span>
26 $endif$
27 </div> 23 </div>
28 $if(it.subtitle)$ 24 $if(it.subtitle)$
29 <small class="l-media__block u-d-none@sm-lo"> 25 <small class="l-media__block u-d-none@sm-lo">$it.subtitle$</small>
30 $it.subtitle$
31 </small>
32 $elseif(it.category)$ 26 $elseif(it.category)$
33 <small class="l-media__block u-d-none@sm-lo"> 27 <small class="l-media__block u-d-none@sm-lo">$it.category$</small>
34 $it.category$
35 </small>
36 $elseif(it.show_date)$ 28 $elseif(it.show_date)$
37 <small class="l-media__block u-d-none@sm-lo"> 29 <small class="l-media__block u-d-none@sm-lo">
38 <time datetime="$it.last_update.yyyy_mm_dd$" class="dt-updated" itemprop="dateModified"> 30 <time datetime="$it.last_update.yyyy_mm_dd$" class="dt-updated" itemprop="dateModified">
diff --git a/templates/partials/related.html b/templates/partials/related.html
index 7d29c7a..3097866 100644
--- a/templates/partials/related.html
+++ b/templates/partials/related.html
@@ -16,24 +16,9 @@ $if(related)$
16 $if(related.layout.is_grid-2)$ 16 $if(related.layout.is_grid-2)$
17 $related.prev:partials/grid_card()$ 17 $related.prev:partials/grid_card()$
18 $related.next:partials/grid_card()$ 18 $related.next:partials/grid_card()$
19 $elseif(related.layout.is_grid-3)$ 19 $else$
20 $related.prev:partials/grid_card()$
21 $related.next:partials/grid_card()$
22 $elseif(related.layout.is_gallery-2)$
23 $related.prev:partials/gallery_card()$
24 $related.next:partials/gallery_card()$
25 $elseif(related.layout.is_gallery-3)$
26 $related.prev:partials/gallery_card()$ 20 $related.prev:partials/gallery_card()$
27 $related.next:partials/gallery_card()$ 21 $related.next:partials/gallery_card()$
28 $else$
29 <div class="u-d-contents u-d-none@sm-lo">
30 $related.prev:partials/list_card()$
31 $related.next:partials/list_card()$
32 </div>
33 <div class="u-d-contents u-d-none@sm-hi">
34 $related.prev:partials/grid_card()$
35 $related.next:partials/grid_card()$
36 </div>
37 $endif$ 22 $endif$
38 </div> 23 </div>
39 </div> 24 </div>