summaryrefslogtreecommitdiffstats
path: root/templates/layouts
diff options
context:
space:
mode:
authorVolpeon <git@volpeon.ink>2021-11-13 18:03:55 +0100
committerVolpeon <git@volpeon.ink>2021-11-13 18:03:55 +0100
commitc20ea9f6922557db29061a5d53c067ab20c734b9 (patch)
tree8db62241b809d73c51f9e7f8c3189638d9700c88 /templates/layouts
parentFix persistent scrollbar (diff)
downloadvolpeon.ink-c20ea9f6922557db29061a5d53c067ab20c734b9.tar.gz
volpeon.ink-c20ea9f6922557db29061a5d53c067ab20c734b9.tar.bz2
volpeon.ink-c20ea9f6922557db29061a5d53c067ab20c734b9.zip
Improved list generation, remove index template
Diffstat (limited to 'templates/layouts')
-rw-r--r--templates/layouts/categorized_list.html98
-rw-r--r--templates/layouts/deep_categorized_list.html54
-rw-r--r--templates/layouts/index.html67
-rw-r--r--templates/layouts/list.html96
4 files changed, 192 insertions, 123 deletions
diff --git a/templates/layouts/categorized_list.html b/templates/layouts/categorized_list.html
index a3af43c..ad510ae 100644
--- a/templates/layouts/categorized_list.html
+++ b/templates/layouts/categorized_list.html
@@ -11,36 +11,76 @@ $body$
11 <h2 class="c-card-list__category-header"> 11 <h2 class="c-card-list__category-header">
12 <a href="$it.url.rel$">$it.title$</a> 12 <a href="$it.url.rel$">$it.title$</a>
13 </h2> 13 </h2>
14 <div class="c-card-list__category-content$if(it.list_grid)$ c-card-list__category-content--grid$endif$"> 14 $if(it.list_grid)$
15 $for(it.pages.all)$ 15 <div class="c-card-list__category-content c-card-list__category-content--grid">
16 <a href="$it.url.rel$" class="c-card-list__card c-card"> 16 $for(it.pages.all)$
17 $if(pages.all.list_read_indicators)$ 17 <a href="$it.url.rel$" class="c-card-list__card c-card">
18 <div class="c-card__block c-card__block--indicator"></div> 18 $if(pages.all.list_read_indicators)$
19 $endif$ 19 <div class="c-card__block c-card__block--indicator"></div>
20 $if(pages.all.icon)$ 20 $endif$
21 <svg class="c-card__block o-icon" width="1em" height="1em"> 21 $if(pages.all.icon)$
22 <use href="/symbols.svg#icon-$pages.all.icon$"></use> 22 <svg class="c-card__block o-icon" width="1em" height="1em">
23 </svg> 23 <use href="/symbols.svg#icon-$pages.all.icon$"></use>
24 $endif$ 24 </svg>
25 <div class="c-card__block c-card__block--main"> 25 $endif$
26 $it.title$ 26 <div class="c-card__block c-card__block--main">
27 </div> 27 $if(it.date)$
28 $if(it.date)$ 28 <time datetime="$it.date.yyyy_mm_dd$">
29 <time datetime="$it.date.yyyy_mm_dd$" class="c-card__block u-fs0"> 29 <small class="u-dn@sm-hi">
30 <small class="u-dn@sm-hi"> 30 $it.date.short$
31 $it.date.short$ 31 </small>
32 </small> 32 <small class="u-dn@sm-lo">
33 <small class="u-dn@sm-lo"> 33 $it.date.long$
34 $it.date.long$ 34 </small>
35 </small> 35 </time>
36 </time> 36 <strong class="u-db">$it.title$</strong>
37 $endif$ 37 $else$
38 </a> 38 $it.title$
39 $endfor$ 39 $endif$
40 </div> 40 </div>
41 $if(list_icon)$
42 <svg class="c-card__block o-icon" width="1em" height="1em">
43 <use href="/symbols.svg#$list_icon$"></use>
44 </svg>
45 $endif$
46 </a>
47 $endfor$
48 </div>
49 $else$
50 <div class="c-card-list__category-content">
51 $for(it.pages.all)$
52 <a href="$it.url.rel$" class="c-card-list__card c-card">
53 $if(pages.all.list_read_indicators)$
54 <div class="c-card__block c-card__block--indicator"></div>
55 $endif$
56 $if(pages.all.icon)$
57 <svg class="c-card__block o-icon" width="1em" height="1em">
58 <use href="/symbols.svg#icon-$pages.all.icon$"></use>
59 </svg>
60 $endif$
61 <div class="c-card__block c-card__block--main">
62 $it.title$
63 </div>
64 $if(it.date)$
65 <time datetime="$it.date.yyyy_mm_dd$" class="c-card__block u-fs0">
66 <small class="u-dn@sm-hi">
67 $it.date.short$
68 </small>
69 <small class="u-dn@sm-lo">
70 $it.date.long$
71 </small>
72 </time>
73 $endif$
74 $if(list_icon)$
75 <svg class="c-card__block o-icon" width="1em" height="1em">
76 <use href="/symbols.svg#$list_icon$"></use>
77 </svg>
78 $endif$
79 </a>
80 $endfor$
81 </div>
82 $endif$
41 $endif$ 83 $endif$
42 $endfor$ 84 $endfor$
43 </div> 85 </div>
44</section> 86</section>
45
46
diff --git a/templates/layouts/deep_categorized_list.html b/templates/layouts/deep_categorized_list.html
new file mode 100644
index 0000000..eec16c9
--- /dev/null
+++ b/templates/layouts/deep_categorized_list.html
@@ -0,0 +1,54 @@
1<section class="l-container l-container--pad-x l-container--pad-y l-container--content">
2 <div class="s-headlines s-colored-links">
3 <h1 class="u-mt0"><span class="s-headlines__title-inner">$title$</span></h1>
4
5$body$
6 </div>
7
8 <div class="c-card-list">
9 $for(pages.all)$
10 $if(it.pages)$
11 <h2 class="c-card-list__category-header">
12 <a href="$it.url.rel$">$it.title$</a>
13 </h2>
14 <div class="c-card-list__category-content$if(it.list_grid)$ c-card-list__category-content--grid$endif$">
15 $for(pages.all.pages.all)$
16 $for(pages.all.pages.all.pages.all)$
17 <a href="$it.url.rel$" class="c-card-list__card c-card">
18 $if(pages.all.list_read_indicators)$
19 <div class="c-card__block c-card__block--indicator"></div>
20 $endif$
21 $if(pages.all.pages.all.icon)$
22 <svg class="c-card__block o-icon" width="1em" height="1em">
23 <use href="/symbols.svg#icon-$pages.all.pages.all.icon$"></use>
24 </svg>
25 $endif$
26 <div class="c-card__block c-card__block--main">
27 <small class="u-db">$pages.all.pages.all.title$</small>
28 <strong class="u-db">$it.title$</strong>
29 </div>
30 $if(it.date)$
31 <time datetime="$it.date.yyyy_mm_dd$" class="c-card__block u-fs0">
32 <small class="u-dn@sm-hi">
33 $it.date.short$
34 </small>
35 <small class="u-dn@sm-lo">
36 $it.date.long$
37 </small>
38 </time>
39 $endif$
40 $if(pages.all.list_icon)$
41 <svg class="c-card__block o-icon" width="1em" height="1em">
42 <use href="/symbols.svg#$pages.all.list_icon$"></use>
43 </svg>
44 $endif$
45 </a>
46 $endfor$
47 $endfor$
48 </div>
49 $endif$
50 $endfor$
51 </div>
52</section>
53
54
diff --git a/templates/layouts/index.html b/templates/layouts/index.html
deleted file mode 100644
index 1eca10f..0000000
--- a/templates/layouts/index.html
+++ /dev/null
@@ -1,67 +0,0 @@
1<section class="l-container l-container--pad-x l-container--pad-y l-container--content">
2 <div class="s-headlines s-colored-links">
3 <h1 class="u-mt0"><span class="s-headlines__title-inner">I'm a <strong>red fox</strong> in disguise.</span></h1>
4
5$body$
6 </div>
7
8 <div class="c-card-list">
9 <h2 class="c-card-list__category-header">
10 Profiles
11 </h2>
12 <div class="c-card-list__category-content c-card-list__category-content--grid">
13 $for(profiles)$
14 $if(it.featured)$
15 $if(it.url)$
16 <a class="c-card-list__card c-card" href="$it.url$">
17 $else$
18 <div class="c-card-list__card c-card">
19 $endif$
20 $if(it.icon)$
21 <svg class="c-card__block o-icon" width="1em" height="1em">
22 <use href="/symbols.svg#icon-$it.icon$"></use>
23 </svg>
24 $endif$
25 <div class="c-card__block c-card__block--main">
26 <strong class="u-db">$it.platform$</strong>
27 <small class="u-db">$it.username$</small>
28 </div>
29 $if(it.url)$
30 <svg class="c-card__block o-icon" width="1em" height="1em">
31 <use href="/symbols.svg#icon-arrow-up-right"></use>
32 </svg>
33 $endif$
34 $if(it.url)$
35 </a>
36 $else$
37 </div>
38 $endif$
39 $endif$
40 $endfor$
41 </div>
42
43 <h2 class="c-card-list__category-header">
44 <a href="$pages.by_id.projects.url.rel$">$pages.by_id.projects.title$</a>
45 </h2>
46 <div class="c-card-list__category-content c-card-list__category-content--grid">
47 $for(pages.by_id.projects.pages.all)$
48 $for(it.pages.all)$
49 <a href="$it.url.rel$" class="c-card-list__card c-card">
50 $if(pages.by_id.projects.pages.all.icon)$
51 <svg class="c-card__block o-icon" width="1em" height="1em">
52 <use href="/symbols.svg#icon-$pages.by_id.projects.pages.all.icon$"></use>
53 </svg>
54 $endif$
55 <div class="c-card__block c-card__block--main">
56 <small class="u-db">$pages.by_id.projects.pages.all.title$</small>
57 <strong class="u-db">$it.title$</strong>
58 </div>
59 <svg class="c-card__block o-icon" width="1em" height="1em">
60 <use href="/symbols.svg#icon-arrow-right"></use>
61 </svg>
62 </a>
63 $endfor$
64 $endfor$
65 </div>
66 </div>
67</section>
diff --git a/templates/layouts/list.html b/templates/layouts/list.html
index 2ef02ab..b4647a1 100644
--- a/templates/layouts/list.html
+++ b/templates/layouts/list.html
@@ -6,33 +6,75 @@ $body$
6 </div> 6 </div>
7 7
8 <div class="c-card-list"> 8 <div class="c-card-list">
9 <div class="c-card-list__category-content$if(list_grid)$ c-card-list__category-content--grid$endif$"> 9 $if(list_grid)$
10 $for(pages.all)$ 10 <div class="c-card-list__category-content c-card-list__category-content--grid">
11 <a href="$it.url.rel$" class="c-card-list__card c-card"> 11 $for(pages.all)$
12 $if(list_read_indicators)$ 12 <a href="$it.url.rel$" class="c-card-list__card c-card">
13 <div class="c-card__block c-card__block--indicator"></div> 13 $if(list_read_indicators)$
14 $endif$ 14 <div class="c-card__block c-card__block--indicator"></div>
15 $if(icon)$ 15 $endif$
16 <svg class="c-card__block o-icon"> 16 $if(icon)$
17 <use href="/symbols.svg#icon-$icon$"></use> 17 <svg class="c-card__block o-icon">
18 </svg> 18 <use href="/symbols.svg#icon-$icon$"></use>
19 $endif$ 19 </svg>
20 <div class="c-card__block c-card__block--main"> 20 $endif$
21 $it.title$ 21 <div class="c-card__block c-card__block--main">
22 </div> 22 $if(it.date)$
23 $if(it.date)$ 23 <time datetime="$it.date.yyyy_mm_dd$">
24 <time datetime="$it.date.yyyy_mm_dd$" class="c-card__block u-fs0"> 24 <small class="u-dn@sm-hi">
25 <small class="u-dn@sm-hi"> 25 $it.date.short$
26 $it.date.short$ 26 </small>
27 </small> 27 <small class="u-dn@sm-lo">
28 <small class="u-dn@sm-lo"> 28 $it.date.long$
29 $it.date.long$ 29 </small>
30 </small> 30 </time>
31 </time> 31 <strong class="u-db">$it.title$</strong>
32 $endif$ 32 $else$
33 </a> 33 $it.title$
34 $endfor$ 34 $endif$
35 </div> 35 </div>
36 $if(list_icon)$
37 <svg class="c-card__block o-icon" width="1em" height="1em">
38 <use href="/symbols.svg#$list_icon$"></use>
39 </svg>
40 $endif$
41 </a>
42 $endfor$
43 </div>
44 $else$
45 <div class="c-card-list__category-content">
46 $for(pages.all)$
47 <a href="$it.url.rel$" class="c-card-list__card c-card">
48 $if(list_read_indicators)$
49 <div class="c-card__block c-card__block--indicator"></div>
50 $endif$
51 $if(icon)$
52 <svg class="c-card__block o-icon">
53 <use href="/symbols.svg#icon-$icon$"></use>
54 </svg>
55 $endif$
56 <div class="c-card__block c-card__block--main">
57 $it.title$
58 </div>
59 $if(it.date)$
60 <time datetime="$it.date.yyyy_mm_dd$" class="c-card__block u-fs0">
61 <small class="u-dn@sm-hi">
62 $it.date.short$
63 </small>
64 <small class="u-dn@sm-lo">
65 $it.date.long$
66 </small>
67 </time>
68 $endif$
69 $if(list_icon)$
70 <svg class="c-card__block o-icon" width="1em" height="1em">
71 <use href="/symbols.svg#$list_icon$"></use>
72 </svg>
73 $endif$
74 </a>
75 $endfor$
76 </div>
77 $endif$
36 </div> 78 </div>
37</section> 79</section>
38 80
generated by cgit v1.2.3-70-g09d2 (git 2.47.0) at 2024-12-25 18:06:56 +0000