diff options
-rw-r--r-- | assets/css/_basics.scss | 2 | ||||
-rw-r--r-- | assets/css/_vars.scss | 2 | ||||
-rw-r--r-- | assets/css/components/_card-list.scss | 36 | ||||
-rw-r--r-- | assets/css/scopes/_invisible-links.scss | 13 | ||||
-rw-r--r-- | assets/css/style.scss | 1 | ||||
-rw-r--r-- | content/profiles/index.md | 2 | ||||
-rw-r--r-- | content/projects/emojis/index.md | 2 | ||||
-rw-r--r-- | content/projects/index.md | 3 | ||||
-rw-r--r-- | filters/icons.lua | 4 | ||||
-rw-r--r-- | templates/layouts/categorized_list.html | 21 | ||||
-rw-r--r-- | templates/partials/grid_card.html | 2 |
11 files changed, 40 insertions, 48 deletions
diff --git a/assets/css/_basics.scss b/assets/css/_basics.scss index 4d9f2f5..efa0279 100644 --- a/assets/css/_basics.scss +++ b/assets/css/_basics.scss | |||
@@ -171,7 +171,7 @@ p { | |||
171 | 171 | ||
172 | :link, | 172 | :link, |
173 | :visited { | 173 | :visited { |
174 | color: prop(--colors --link --idle); | 174 | color: prop(--colors --link --default); |
175 | } | 175 | } |
176 | 176 | ||
177 | hr { | 177 | hr { |
diff --git a/assets/css/_vars.scss b/assets/css/_vars.scss index a8c7fdf..9e1b661 100644 --- a/assets/css/_vars.scss +++ b/assets/css/_vars.scss | |||
@@ -80,7 +80,7 @@ $content--width: 46rem; | |||
80 | ), | 80 | ), |
81 | 81 | ||
82 | --link: ( | 82 | --link: ( |
83 | --idle: var(--colors--fg-lo), | 83 | --default: var(--colors--fg-lo), |
84 | --colored: ( | 84 | --colored: ( |
85 | --idle-h: 220, | 85 | --idle-h: 220, |
86 | --idle-s: 100%, | 86 | --idle-s: 100%, |
diff --git a/assets/css/components/_card-list.scss b/assets/css/components/_card-list.scss index 605c442..aa6eef9 100644 --- a/assets/css/components/_card-list.scss +++ b/assets/css/components/_card-list.scss | |||
@@ -1,12 +1,8 @@ | |||
1 | @include namespace('card-list') { | 1 | @include namespace('card-list') { |
2 | @include store(( | 2 | @include store(( |
3 | --colors: ( | 3 | --colors: ( |
4 | --cat: ( | 4 | --title: prop(--colors --fg-lo, $global: true), |
5 | --fg: prop(--colors --fg-lo, $global: true), | 5 | --text: prop(--colors --fg-hi, $global: true), |
6 | ), | ||
7 | --meta: ( | ||
8 | --fg: prop(--colors --fg-hi, $global: true), | ||
9 | ) | ||
10 | ), | 6 | ), |
11 | --dims: ( | 7 | --dims: ( |
12 | --col-width: 17em | 8 | --col-width: 17em |
@@ -17,36 +13,20 @@ | |||
17 | margin-top: $line-height * 2rem; | 13 | margin-top: $line-height * 2rem; |
18 | font-size: 1rem; | 14 | font-size: 1rem; |
19 | 15 | ||
20 | @include element('category-header') { | 16 | @include element('title') { |
21 | margin-top: $line-height * 2rem; | 17 | color: prop(--colors --title); |
22 | color: prop(--colors --cat --fg); | ||
23 | } | 18 | } |
24 | 19 | ||
25 | @include element('category-title') { | 20 | @include element('text') { |
26 | display: inline-block; | 21 | color: prop(--colors --text); |
27 | margin-top: 0; | 22 | line-height: 1.4; |
28 | margin-right: 1em; | ||
29 | |||
30 | :link, | ||
31 | :visited { | ||
32 | text-decoration: none; | ||
33 | |||
34 | &:hover { | ||
35 | text-decoration: underline; | ||
36 | } | ||
37 | } | ||
38 | } | ||
39 | |||
40 | @include element('category-description') { | ||
41 | display: block; | ||
42 | font-size: px-to-em(15px); | ||
43 | 23 | ||
44 | p { | 24 | p { |
45 | margin-top: $line-height * .25rem; | 25 | margin-top: $line-height * .25rem; |
46 | } | 26 | } |
47 | } | 27 | } |
48 | 28 | ||
49 | @include element('category-content') { | 29 | @include element('cards') { |
50 | margin-top: $line-height * .625rem; | 30 | margin-top: $line-height * .625rem; |
51 | filter: drop-shadow(#{prop(--dims --obj-shadow, $global: true)} #{prop(--colors --obj-shadow, $global: true)}); | 31 | filter: drop-shadow(#{prop(--dims --obj-shadow, $global: true)} #{prop(--colors --obj-shadow, $global: true)}); |
52 | 32 | ||
diff --git a/assets/css/scopes/_invisible-links.scss b/assets/css/scopes/_invisible-links.scss new file mode 100644 index 0000000..e4d149e --- /dev/null +++ b/assets/css/scopes/_invisible-links.scss | |||
@@ -0,0 +1,13 @@ | |||
1 | @include namespace('invisible-links') { | ||
2 | @include scope(namespace()) { | ||
3 | :link, | ||
4 | :visited { | ||
5 | color: currentColor; | ||
6 | text-decoration: none; | ||
7 | |||
8 | &:hover { | ||
9 | text-decoration: underline; | ||
10 | } | ||
11 | } | ||
12 | } | ||
13 | } | ||
diff --git a/assets/css/style.scss b/assets/css/style.scss index 67f44ed..754b91e 100644 --- a/assets/css/style.scss +++ b/assets/css/style.scss | |||
@@ -19,6 +19,7 @@ | |||
19 | @import 'components/card-list'; | 19 | @import 'components/card-list'; |
20 | 20 | ||
21 | @import 'scopes/colored-links'; | 21 | @import 'scopes/colored-links'; |
22 | @import 'scopes/invisible-links'; | ||
22 | @import 'scopes/headlines'; | 23 | @import 'scopes/headlines'; |
23 | @import 'scopes/body'; | 24 | @import 'scopes/body'; |
24 | 25 | ||
diff --git a/content/profiles/index.md b/content/profiles/index.md index 265a23b..0d8df9f 100644 --- a/content/profiles/index.md +++ b/content/profiles/index.md | |||
@@ -2,5 +2,5 @@ | |||
2 | title: Profiles | 2 | title: Profiles |
3 | position: 1 | 3 | position: 1 |
4 | list_grid: true | 4 | list_grid: true |
5 | list_post_icon: icon-arrow-up-right | 5 | list_post_icon: arrow-up-right |
6 | --- | 6 | --- |
diff --git a/content/projects/emojis/index.md b/content/projects/emojis/index.md index 58ad85b..728ade5 100644 --- a/content/projects/emojis/index.md +++ b/content/projects/emojis/index.md | |||
@@ -1,5 +1,5 @@ | |||
1 | --- | 1 | --- |
2 | title: Emojis | 2 | title: Emojis |
3 | icon: smile | 3 | icon: smile |
4 | list_post_icon: icon-arrow-right | 4 | list_post_icon: arrow-right |
5 | --- | 5 | --- |
diff --git a/content/projects/index.md b/content/projects/index.md index 3b6b718..eaaf808 100644 --- a/content/projects/index.md +++ b/content/projects/index.md | |||
@@ -4,3 +4,6 @@ position: 2 | |||
4 | list_grid: true | 4 | list_grid: true |
5 | list_limit: 4 | 5 | list_limit: 4 |
6 | --- | 6 | --- |
7 | |||
8 | A selection of projects I wasn't too lazy to create a page for. | ||
9 | You can find more projects on [git.vulpes.one](https://git.vulpes.one/). | ||
diff --git a/filters/icons.lua b/filters/icons.lua index 3800e5d..fb6a608 100644 --- a/filters/icons.lua +++ b/filters/icons.lua | |||
@@ -3,8 +3,8 @@ function Str(el) | |||
3 | 3 | ||
4 | if icon then | 4 | if icon then |
5 | return pandoc.RawInline('html', | 5 | return pandoc.RawInline('html', |
6 | '<svg class="o-icon o-icon--inline" width="1em" height="1em"><use href="/symbols.svg#' .. icon .. | 6 | '<svg class="o-icon o-icon--inline" width="1em" height="1em"><use href="/symbols.svg#icon-' .. |
7 | '"></use></svg>') | 7 | icon .. '"></use></svg>') |
8 | end | 8 | end |
9 | 9 | ||
10 | return el | 10 | return el |
diff --git a/templates/layouts/categorized_list.html b/templates/layouts/categorized_list.html index 690ab68..6f06a63 100644 --- a/templates/layouts/categorized_list.html +++ b/templates/layouts/categorized_list.html | |||
@@ -7,23 +7,18 @@ $body$ | |||
7 | <div class="c-card-list"> | 7 | <div class="c-card-list"> |
8 | $for(list)$ | 8 | $for(list)$ |
9 | <section> | 9 | <section> |
10 | <header class="c-card-list__category-header"> | 10 | <h2 class="c-card-list__title s-invisible-links"> |
11 | <div> | 11 | <a href="$it.url.rel$">$it.title$</a> |
12 | <h2 class="c-card-list__category-title"> | 12 | </h2> |
13 | <a href="$it.url.rel$">$it.title$</a> | 13 | $if(it.description)$ |
14 | </h2> | 14 | <div class="c-card-list__text s-colored-links">$it.description$</div> |
15 | $if(it.omitted)$<small>$it.omitted$ more</small>$endif$ | 15 | $endif$ |
16 | </div> | ||
17 | $if(it.description)$ | ||
18 | <small class="c-card-list__category-description">$it.description$</small> | ||
19 | $endif$ | ||
20 | </header> | ||
21 | $if(it.grid)$ | 16 | $if(it.grid)$ |
22 | <div class="c-card-list__category-content c-card-list__category-content--grid"> | 17 | <div class="c-card-list__cards c-card-list__cards--grid"> |
23 | $it.items:partials/grid_card()$ | 18 | $it.items:partials/grid_card()$ |
24 | </div> | 19 | </div> |
25 | $else$ | 20 | $else$ |
26 | <div class="c-card-list__category-content"> | 21 | <div class="c-card-list__cards"> |
27 | $it.items:partials/list_card()$ | 22 | $it.items:partials/list_card()$ |
28 | </div> | 23 | </div> |
29 | $endif$ | 24 | $endif$ |
diff --git a/templates/partials/grid_card.html b/templates/partials/grid_card.html index 449b25c..e1b7f78 100644 --- a/templates/partials/grid_card.html +++ b/templates/partials/grid_card.html | |||
@@ -30,7 +30,7 @@ | |||
30 | </div> | 30 | </div> |
31 | $if(it.post_icon)$ | 31 | $if(it.post_icon)$ |
32 | <svg class="c-card__block o-icon" width="1em" height="1em"> | 32 | <svg class="c-card__block o-icon" width="1em" height="1em"> |
33 | <use href="/symbols.svg#$it.post_icon$"></use> | 33 | <use href="/symbols.svg#icon-$it.post_icon$"></use> |
34 | </svg> | 34 | </svg> |
35 | $endif$ | 35 | $endif$ |
36 | </a> | 36 | </a> |