summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
Diffstat
-rw-r--r--assets/css/components/_note.scss23
-rw-r--r--assets/css/style.scss1
-rw-r--r--content/9thPK7O3xn/index.md4
-rw-r--r--content/9thPK7O3xn/posts/fox.md12
-rw-r--r--filters/macros.lua8
-rw-r--r--templates/partials/grid_card.html72
-rw-r--r--templates/partials/list_card.html80
7 files changed, 125 insertions, 75 deletions
diff --git a/assets/css/components/_note.scss b/assets/css/components/_note.scss
new file mode 100644
index 0000000..1879ea9
--- /dev/null
+++ b/assets/css/components/_note.scss
@@ -0,0 +1,23 @@
1@include namespace('note') {
2 @include store((
3 --colors: (
4 --fg: prop(--colors --accent --strong, $global: true),
5 --bg: prop(--colors --accent --faint, $global: true),
6 ),
7 --dims: (
8 --pad-x: 1em,
9 --pad-y: .7em
10 )
11 ));
12
13 @include component(namespace()) {
14 margin-top: $line-height * 1rem;
15 padding: prop(--dims --pad-y) prop(--dims --pad-x);
16 background-color: prop(--colors --bg);
17 color: prop(--colors --fg);
18
19 :first-child {
20 margin-top: 0;
21 }
22 }
23}
diff --git a/assets/css/style.scss b/assets/css/style.scss
index 9c57b28..db8f232 100644
--- a/assets/css/style.scss
+++ b/assets/css/style.scss
@@ -16,6 +16,7 @@
16@import 'components/header'; 16@import 'components/header';
17@import 'components/footer'; 17@import 'components/footer';
18@import 'components/card'; 18@import 'components/card';
19@import 'components/note';
19 20
20@import 'layouts/card-list'; 21@import 'layouts/card-list';
21 22
diff --git a/content/9thPK7O3xn/index.md b/content/9thPK7O3xn/index.md
index 370eee4..e190ea7 100644
--- a/content/9thPK7O3xn/index.md
+++ b/content/9thPK7O3xn/index.md
@@ -5,4 +5,6 @@ feed: true
5--- 5---
6 6
7Content that doesn't belong in the public sections of my website such as test pages or posts about more personal topics. 7Content that doesn't belong in the public sections of my website such as test pages or posts about more personal topics.
8Feel free to share pages from here *privately* --- i.e. not on public social media posts --- if you think someone would like them. 8
9The purpose of this section is *not* to be only accessible for specific people, but simply to be a bit more tricky to find.
10Feel free to share pages from here *privately* if you think someone would like them.
diff --git a/content/9thPK7O3xn/posts/fox.md b/content/9thPK7O3xn/posts/fox.md
new file mode 100644
index 0000000..772422e
--- /dev/null
+++ b/content/9thPK7O3xn/posts/fox.md
@@ -0,0 +1,12 @@
1---
2title: I Am (Not) a Fox
3unlisted: true
4---
5
6I wish I was a fox.
7
8You see statements like this pretty often on social media nowadays, usually packaged as a meme and meant to express the desire to escape the stressful life of a human being.
9
10In this case, however, I'm entirely serious.
11
12
diff --git a/filters/macros.lua b/filters/macros.lua
new file mode 100644
index 0000000..9e9d954
--- /dev/null
+++ b/filters/macros.lua
@@ -0,0 +1,8 @@
1function Div(el)
2 if el.classes:includes("note") then
3 el.classes = pandoc.List()
4 el.classes:insert("c-note")
5 end
6
7 return el
8end
diff --git a/templates/partials/grid_card.html b/templates/partials/grid_card.html
index 9cd8463..6f6c16e 100644
--- a/templates/partials/grid_card.html
+++ b/templates/partials/grid_card.html
@@ -1,36 +1,38 @@
1<a href="$it.url.rel$" class="l-card-list__card c-card"> 1$if(it.url)$
2 $if(it.indicator)$ 2 <a href="$it.url.rel$" class="l-card-list__card c-card">
3 <div class="c-card__block c-card__block--indicator"></div> 3 $if(it.indicator)$
4 $endif$ 4 <div class="c-card__block c-card__block--indicator"></div>
5 $if(it.icon)$
6 <svg class="c-card__block o-icon" width="1em" height="1em">
7 <use href="/symbols.svg#icon-$it.icon$"></use>
8 </svg>
9 $endif$
10 <div class="c-card__block c-card__block--main">
11 $if(it.subtitle)$
12 <strong class="u-db u-elp">$it.title$</strong>
13 <small class="u-db u-elp">$it.subtitle$</small>
14 $elseif(it.category)$
15 <small class="u-db u-elp">$it.category$</small>
16 <strong class="u-db u-elp">$it.title$</strong>
17 $elseif(it.date)$
18 <time datetime="$it.date.yyyy_mm_dd$">
19 <small class="u-dn@sm-hi">
20 $it.date.short$
21 </small>
22 <small class="u-dn@sm-lo">
23 $it.date.long$
24 </small>
25 </time>
26 <strong class="u-db u-elp">$it.title$</strong>
27 $else$
28 $it.title$
29 $endif$ 5 $endif$
30 </div> 6 $if(it.icon)$
31 $if(it.post_icon)$ 7 <svg class="c-card__block o-icon" width="1em" height="1em">
32 <svg class="c-card__block o-icon" width="1em" height="1em"> 8 <use href="/symbols.svg#icon-$it.icon$"></use>
33 <use href="/symbols.svg#icon-$it.post_icon$"></use> 9 </svg>
34 </svg> 10 $endif$
35 $endif$ 11 <div class="c-card__block c-card__block--main">
36</a> 12 $if(it.subtitle)$
13 <strong class="u-db u-elp">$it.title$</strong>
14 <small class="u-db u-elp">$it.subtitle$</small>
15 $elseif(it.category)$
16 <small class="u-db u-elp">$it.category$</small>
17 <strong class="u-db u-elp">$it.title$</strong>
18 $elseif(it.date)$
19 <time datetime="$it.date.yyyy_mm_dd$">
20 <small class="u-dn@sm-hi">
21 $it.date.short$
22 </small>
23 <small class="u-dn@sm-lo">
24 $it.date.long$
25 </small>
26 </time>
27 <strong class="u-db u-elp">$it.title$</strong>
28 $else$
29 $it.title$
30 $endif$
31 </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>
38$endif$
diff --git a/templates/partials/list_card.html b/templates/partials/list_card.html
index b784c1e..73caa05 100644
--- a/templates/partials/list_card.html
+++ b/templates/partials/list_card.html
@@ -1,40 +1,42 @@
1<a href="$it.url.rel$" class="l-card-list__card c-card"> 1$if(it.url)$
2 $if(it.indicator)$ 2 <a href="$it.url.rel$" class="l-card-list__card c-card">
3 <div class="c-card__block c-card__block--indicator"></div> 3 $if(it.indicator)$
4 $endif$ 4 <div class="c-card__block c-card__block--indicator"></div>
5 $if(it.icon)$ 5 $endif$
6 <svg class="c-card__block o-icon" width="1em" height="1em"> 6 $if(it.icon)$
7 <use href="/symbols.svg#icon-$it.icon$"></use> 7 <svg class="c-card__block o-icon" width="1em" height="1em">
8 </svg> 8 <use href="/symbols.svg#icon-$it.icon$"></use>
9 $endif$ 9 </svg>
10 <div class="c-card__block c-card__block--main"> 10 $endif$
11 $it.title$ 11 <div class="c-card__block c-card__block--main">
12 </div> 12 $it.title$
13 $if(it.subtitle)$
14 <div class="c-card__block u-fs0">
15 <small>
16 $it.subtitle$
17 </small>
18 </div> 13 </div>
19 $elseif(it.category)$ 14 $if(it.subtitle)$
20 <div class="c-card__block u-fs0"> 15 <div class="c-card__block u-fs0">
21 <small> 16 <small>
22 $it.category$ 17 $it.subtitle$
23 </small> 18 </small>
24 </div> 19 </div>
25 $elseif(it.date)$ 20 $elseif(it.category)$
26 <time datetime="$it.date.yyyy_mm_dd$" class="c-card__block u-fs0"> 21 <div class="c-card__block u-fs0">
27 <small class="u-dn@sm-hi"> 22 <small>
28 $it.date.short$ 23 $it.category$
29 </small> 24 </small>
30 <small class="u-dn@sm-lo"> 25 </div>
31 $it.date.long$ 26 $elseif(it.date)$
32 </small> 27 <time datetime="$it.date.yyyy_mm_dd$" class="c-card__block u-fs0">
33 </time> 28 <small class="u-dn@sm-hi">
34 $endif$ 29 $it.date.short$
35 $if(it.post_icon)$ 30 </small>
36 <svg class="c-card__block o-icon" width="1em" height="1em"> 31 <small class="u-dn@sm-lo">
37 <use href="/symbols.svg#icon-$it.post_icon$"></use> 32 $it.date.long$
38 </svg> 33 </small>
39 $endif$ 34 </time>
40</a> 35 $endif$
36 $if(it.post_icon)$
37 <svg class="c-card__block o-icon" width="1em" height="1em">
38 <use href="/symbols.svg#icon-$it.post_icon$"></use>
39 </svg>
40 $endif$
41 </a>
42$endif$
generated by cgit v1.2.3-70-g09d2 (git 2.47.0) at 2024-12-25 18:00:40 +0000