summaryrefslogtreecommitdiffstats
path: root/templates/partials
diff options
context:
space:
mode:
authorVolpeon <git@volpeon.ink>2021-12-16 18:29:18 +0100
committerVolpeon <git@volpeon.ink>2021-12-16 18:29:18 +0100
commit5f4cb1fd8b84e69092ac56a643b1618006f0442c (patch)
tree1d2388ad69091163da498334e2de5c94c4e74dc7 /templates/partials
parentFix it for real (diff)
downloadvolpeon.ink-5f4cb1fd8b84e69092ac56a643b1618006f0442c.tar.gz
volpeon.ink-5f4cb1fd8b84e69092ac56a643b1618006f0442c.tar.bz2
volpeon.ink-5f4cb1fd8b84e69092ac56a643b1618006f0442c.zip
Add thumbnails to cards
Diffstat (limited to 'templates/partials')
-rw-r--r--templates/partials/gallery_card.html47
-rw-r--r--templates/partials/grid_card.html66
-rw-r--r--templates/partials/list_card.html76
3 files changed, 120 insertions, 69 deletions
diff --git a/templates/partials/gallery_card.html b/templates/partials/gallery_card.html
new file mode 100644
index 0000000..f724e3b
--- /dev/null
+++ b/templates/partials/gallery_card.html
@@ -0,0 +1,47 @@
1$if(it.url)$
2 <a href="$it.url.rel$" class="l-card-list__card c-card">
3 $if(it.thumbnail)$
4 <div class="c-card__row c-card__row--flush">
5 <div class="c-card__thumbnail">
6 <img class="c-card__thumbnail-img" src="$it.thumbnail.rel$" />
7 </div>
8 </div>
9 $endif$
10 <div class="c-card__row">
11 $if(it.indicator)$
12 <div class="c-card__block c-card__block--indicator"></div>
13 $endif$
14 $if(it.icon)$
15 <svg class="c-card__block o-icon" width="1em" height="1em">
16 <use href="/symbols.svg#icon-$it.icon$"></use>
17 </svg>
18 $endif$
19 <div class="c-card__block c-card__block--main">
20 $if(it.subtitle)$
21 <strong class="u-db u-elp">$it.title$</strong>
22 <small class="u-db u-elp">$it.subtitle$</small>
23 $elseif(it.category)$
24 <small class="u-db u-elp">$it.category$</small>
25 <strong class="u-db u-elp">$it.title$</strong>
26 $elseif(it.date)$
27 <time datetime="$it.date.yyyy_mm_dd$">
28 <small class="u-dn@sm-hi">
29 $it.date.short$
30 </small>
31 <small class="u-dn@sm-lo">
32 $it.date.long$
33 </small>
34 </time>
35 <strong class="u-db u-elp">$it.title$</strong>
36 $else$
37 $it.title$
38 $endif$
39 </div>
40 $if(it.post_icon)$
41 <svg class="c-card__block o-icon" width="1em" height="1em">
42 <use href="/symbols.svg#icon-$it.post_icon$"></use>
43 </svg>
44 $endif$
45 </div>
46 </a>
47$endif$
diff --git a/templates/partials/grid_card.html b/templates/partials/grid_card.html
index 6f6c16e..25cde52 100644
--- a/templates/partials/grid_card.html
+++ b/templates/partials/grid_card.html
@@ -1,38 +1,40 @@
1$if(it.url)$ 1$if(it.url)$
2 <a href="$it.url.rel$" class="l-card-list__card c-card"> 2 <a href="$it.url.rel$" class="l-card-list__card c-card">
3 $if(it.indicator)$ 3 <div class="c-card__row">
4 <div class="c-card__block c-card__block--indicator"></div> 4 $if(it.indicator)$
5 $endif$ 5 <div class="c-card__block c-card__block--indicator"></div>
6 $if(it.icon)$ 6 $endif$
7 <svg class="c-card__block o-icon" width="1em" height="1em"> 7 $if(it.icon)$
8 <use href="/symbols.svg#icon-$it.icon$"></use> 8 <svg class="c-card__block o-icon" width="1em" height="1em">
9 </svg> 9 <use href="/symbols.svg#icon-$it.icon$"></use>
10 $endif$ 10 </svg>
11 <div class="c-card__block c-card__block--main"> 11 $endif$
12 $if(it.subtitle)$ 12 <div class="c-card__block c-card__block--main">
13 <strong class="u-db u-elp">$it.title$</strong> 13 $if(it.subtitle)$
14 <small class="u-db u-elp">$it.subtitle$</small> 14 <strong class="u-db u-elp">$it.title$</strong>
15 $elseif(it.category)$ 15 <small class="u-db u-elp">$it.subtitle$</small>
16 <small class="u-db u-elp">$it.category$</small> 16 $elseif(it.category)$
17 <strong class="u-db u-elp">$it.title$</strong> 17 <small class="u-db u-elp">$it.category$</small>
18 $elseif(it.date)$ 18 <strong class="u-db u-elp">$it.title$</strong>
19 <time datetime="$it.date.yyyy_mm_dd$"> 19 $elseif(it.date)$
20 <small class="u-dn@sm-hi"> 20 <time datetime="$it.date.yyyy_mm_dd$">
21 $it.date.short$ 21 <small class="u-dn@sm-hi">
22 </small> 22 $it.date.short$
23 <small class="u-dn@sm-lo"> 23 </small>
24 $it.date.long$ 24 <small class="u-dn@sm-lo">
25 </small> 25 $it.date.long$
26 </time> 26 </small>
27 <strong class="u-db u-elp">$it.title$</strong> 27 </time>
28 $else$ 28 <strong class="u-db u-elp">$it.title$</strong>
29 $it.title$ 29 $else$
30 $it.title$
31 $endif$
32 </div>
33 $if(it.post_icon)$
34 <svg class="c-card__block o-icon" width="1em" height="1em">
35 <use href="/symbols.svg#icon-$it.post_icon$"></use>
36 </svg>
30 $endif$ 37 $endif$
31 </div> 38 </div>
32 $if(it.post_icon)$
33 <svg class="c-card__block o-icon" width="1em" height="1em">
34 <use href="/symbols.svg#icon-$it.post_icon$"></use>
35 </svg>
36 $endif$
37 </a> 39 </a>
38$endif$ 40$endif$
diff --git a/templates/partials/list_card.html b/templates/partials/list_card.html
index 73caa05..8244cf5 100644
--- a/templates/partials/list_card.html
+++ b/templates/partials/list_card.html
@@ -1,42 +1,44 @@
1$if(it.url)$ 1$if(it.url)$
2 <a href="$it.url.rel$" class="l-card-list__card c-card"> 2 <a href="$it.url.rel$" class="l-card-list__card c-card">
3 $if(it.indicator)$ 3 <div class="c-card__row">
4 <div class="c-card__block c-card__block--indicator"></div> 4 $if(it.indicator)$
5 $endif$ 5 <div class="c-card__block c-card__block--indicator"></div>
6 $if(it.icon)$ 6 $endif$
7 <svg class="c-card__block o-icon" width="1em" height="1em"> 7 $if(it.icon)$
8 <use href="/symbols.svg#icon-$it.icon$"></use> 8 <svg class="c-card__block o-icon" width="1em" height="1em">
9 </svg> 9 <use href="/symbols.svg#icon-$it.icon$"></use>
10 $endif$ 10 </svg>
11 <div class="c-card__block c-card__block--main"> 11 $endif$
12 $it.title$ 12 <div class="c-card__block c-card__block--main">
13 </div> 13 $it.title$
14 $if(it.subtitle)$
15 <div class="c-card__block u-fs0">
16 <small>
17 $it.subtitle$
18 </small>
19 </div>
20 $elseif(it.category)$
21 <div class="c-card__block u-fs0">
22 <small>
23 $it.category$
24 </small>
25 </div> 14 </div>
26 $elseif(it.date)$ 15 $if(it.subtitle)$
27 <time datetime="$it.date.yyyy_mm_dd$" class="c-card__block u-fs0"> 16 <div class="c-card__block u-fs0">
28 <small class="u-dn@sm-hi"> 17 <small>
29 $it.date.short$ 18 $it.subtitle$
30 </small> 19 </small>
31 <small class="u-dn@sm-lo"> 20 </div>
32 $it.date.long$ 21 $elseif(it.category)$
33 </small> 22 <div class="c-card__block u-fs0">
34 </time> 23 <small>
35 $endif$ 24 $it.category$
36 $if(it.post_icon)$ 25 </small>
37 <svg class="c-card__block o-icon" width="1em" height="1em"> 26 </div>
38 <use href="/symbols.svg#icon-$it.post_icon$"></use> 27 $elseif(it.date)$
39 </svg> 28 <time datetime="$it.date.yyyy_mm_dd$" class="c-card__block u-fs0">
40 $endif$ 29 <small class="u-dn@sm-hi">
30 $it.date.short$
31 </small>
32 <small class="u-dn@sm-lo">
33 $it.date.long$
34 </small>
35 </time>
36 $endif$
37 $if(it.post_icon)$
38 <svg class="c-card__block o-icon" width="1em" height="1em">
39 <use href="/symbols.svg#icon-$it.post_icon$"></use>
40 </svg>
41 $endif$
42 </div>
41 </a> 43 </a>
42$endif$ 44$endif$
generated by cgit v1.2.3-70-g09d2 (git 2.47.0) at 2024-12-25 17:32:24 +0000