summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--assets/css/_basics.scss4
-rw-r--r--assets/css/components/_card-list.scss (renamed from assets/css/components/_post-list.scss)30
-rw-r--r--assets/css/style.scss2
-rw-r--r--content/9thPK7O3xn/dreams/index.md11
-rw-r--r--content/9thPK7O3xn/misc/index.md9
-rw-r--r--content/9thPK7O3xn/pages/index.md9
-rw-r--r--content/index.md1
-rw-r--r--content/projects/emojis/index.md6
-rw-r--r--content/projects/index.md5
-rw-r--r--content/symbols.svg43
-rw-r--r--metadata/metadata.yaml10
-rw-r--r--templates/layouts/categorized_list.html28
-rw-r--r--templates/layouts/index.html43
-rw-r--r--templates/layouts/list.html26
14 files changed, 168 insertions, 59 deletions
diff --git a/assets/css/_basics.scss b/assets/css/_basics.scss
index 6da5e88..09b9585 100644
--- a/assets/css/_basics.scss
+++ b/assets/css/_basics.scss
@@ -36,7 +36,9 @@ body {
36} 36}
37 37
38main { 38main {
39 font-size: 1 / 16 * 19em; 39 @include iro-responsive-env(('sm', 'md')) {
40 font-size: iro-responsive-set((1rem, 1 / 16 * 19rem));
41 }
40} 42}
41 43
42pre, 44pre,
diff --git a/assets/css/components/_post-list.scss b/assets/css/components/_card-list.scss
index 9b124a6..2a2ae69 100644
--- a/assets/css/components/_post-list.scss
+++ b/assets/css/components/_card-list.scss
@@ -1,4 +1,4 @@
1@include namespace('post-list') { 1@include namespace('card-list') {
2 @include store(( 2 @include store((
3 --colors: ( 3 --colors: (
4 --cat: ( 4 --cat: (
@@ -34,28 +34,26 @@
34 @include element('category-content') { 34 @include element('category-content') {
35 margin-top: $line-height * .5rem; 35 margin-top: $line-height * .5rem;
36 filter: drop-shadow(#{prop(--dims --obj-shadow, $global: true)} #{prop(--colors --obj-shadow, $global: true)}); 36 filter: drop-shadow(#{prop(--dims --obj-shadow, $global: true)} #{prop(--colors --obj-shadow, $global: true)});
37
38 @include modifier('grid') {
39 display: grid;
40 grid-template-columns: repeat(auto-fill, minmax(#{prop(--dims --col-width)}, 1fr));
41 gap: 6px;
42
43 @include element('card') {
44 @include next-twin-element {
45 margin-top: 0;
46 }
47 }
48 }
37 } 49 }
38 50
39 @include element('post') { 51 @include element('card') {
40 box-shadow: none; 52 box-shadow: none;
41 53
42 @include next-twin-element { 54 @include next-twin-element {
43 margin-top: 2px; 55 margin-top: 2px;
44 } 56 }
45 } 57 }
46
47 @include modifier('grid') {
48 @include element('category-content') {
49 display: grid;
50 grid-template-columns: repeat(auto-fill, minmax(#{prop(--dims --col-width)}, 1fr));
51 gap: $line-height * .5rem;
52 }
53
54 @include element('post') {
55 @include next-twin-element {
56 margin-top: 0;
57 }
58 }
59 }
60 } 58 }
61} 59}
diff --git a/assets/css/style.scss b/assets/css/style.scss
index 99d52c1..8068b87 100644
--- a/assets/css/style.scss
+++ b/assets/css/style.scss
@@ -16,7 +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/post-list'; 19@import 'components/card-list';
20 20
21@import 'scopes/colored-links'; 21@import 'scopes/colored-links';
22@import 'scopes/headlines'; 22@import 'scopes/headlines';
diff --git a/content/9thPK7O3xn/dreams/index.md b/content/9thPK7O3xn/dreams/index.md
index db7be1c..c230cef 100644
--- a/content/9thPK7O3xn/dreams/index.md
+++ b/content/9thPK7O3xn/dreams/index.md
@@ -1,7 +1,8 @@
1--- 1---
2title: Dream Journal 2title: Dream Journal
3show_dates: true 3position: 9
4position: 9 4layout: list
5layout: list 5show_dates: true
6create_feed: true 6show_read_indicators: true
7create_feed: true
7--- 8---
diff --git a/content/9thPK7O3xn/misc/index.md b/content/9thPK7O3xn/misc/index.md
index 0d79d44..840b8c9 100644
--- a/content/9thPK7O3xn/misc/index.md
+++ b/content/9thPK7O3xn/misc/index.md
@@ -1,6 +1,7 @@
1--- 1---
2title: Other stuff 2title: Other stuff
3position: 10 3position: 10
4layout: list 4layout: list
5create_feed: true 5show_read_indicators: true
6create_feed: true
6--- 7---
diff --git a/content/9thPK7O3xn/pages/index.md b/content/9thPK7O3xn/pages/index.md
index ca2e190..583b34b 100644
--- a/content/9thPK7O3xn/pages/index.md
+++ b/content/9thPK7O3xn/pages/index.md
@@ -1,6 +1,7 @@
1--- 1---
2title: Pages 2title: Pages
3position: 0 3position: 0
4layout: list 4layout: list
5create_feed: true 5show_read_indicators: true
6create_feed: true
6--- 7---
diff --git a/content/index.md b/content/index.md
index c9ce120..4ae64c2 100644
--- a/content/index.md
+++ b/content/index.md
@@ -5,4 +5,3 @@ title: Home
5# I'm a **red fox** in disguise. {.u-mt0} 5# I'm a **red fox** in disguise. {.u-mt0}
6 6
7Hi, I'm Volpeon. I enjoy programming, creating vector art and designing user interfaces. 7Hi, I'm Volpeon. I enjoy programming, creating vector art and designing user interfaces.
8You can find me on the [Fediverse](https://mk.vulpes.one/@volpeon).
diff --git a/content/projects/emojis/index.md b/content/projects/emojis/index.md
index cbffe1b..f650b2e 100644
--- a/content/projects/emojis/index.md
+++ b/content/projects/emojis/index.md
@@ -1,4 +1,6 @@
1--- 1---
2title: Emojis 2title: Emojis
3icon: smile 3icon: smile
4layout: list
5list_grid: true
4--- 6---
diff --git a/content/projects/index.md b/content/projects/index.md
index 1a33149..8aa8f96 100644
--- a/content/projects/index.md
+++ b/content/projects/index.md
@@ -1,4 +1,5 @@
1--- 1---
2title: Projects 2title: Projects
3layout: categorized_list 3layout: categorized_list
4list_grid: true
4--- 5---
diff --git a/content/symbols.svg b/content/symbols.svg
index f633664..fecf78e 100644
--- a/content/symbols.svg
+++ b/content/symbols.svg
@@ -10,6 +10,49 @@
10 <path d="m8.75 3.75 4.5 4.5-4.5 4.5m-6-4.5h10.5" fill="none" stroke="currentColor" /> 10 <path d="m8.75 3.75 4.5 4.5-4.5 4.5m-6-4.5h10.5" fill="none" stroke="currentColor" />
11 </symbol> 11 </symbol>
12 12
13 <symbol id="icon-arrow-up-right" viewBox="0 0 16 16" preserveAspectRatio="xMinYMid">
14 <path d="m5.25 4.25h6.5v6.5m0-6.5-7.5 7.5" fill="none" stroke="currentColor" />
15 </symbol>
16
17 <symbol id="icon-envelope" viewBox="0 0 16 16" preserveAspectRatio="xMinYMid">
18 <path
19 d="m1.25 3.5c0-0.4155 0.3345-0.75 0.75-0.75h12c0.4155 0 0.75 0.3345 0.75 0.75v8.5c0 0.4155-0.3345 0.75-0.75 0.75h-12c-0.4155 0-0.75-0.3345-0.75-0.75zm0 0.25 5.2845 4.3681c1.0065 0.83198 1.9181 0.82912 2.9676-0.03704l5.2479-4.3311"
20 fill="none" stroke="currentColor" />
21 </symbol>
22
23 <symbol id="icon-hash" viewBox="0 0 16 16" preserveAspectRatio="xMinYMid">
24 <path d="m4.7501 14.25 0.99984-12m4 12 1.0002-12m-8.5001 3.5h11m-11 5h11" fill="none" stroke="currentColor" />
25 </symbol>
26
27 <symbol id="icon-messages" viewBox="0 0 16 16" preserveAspectRatio="xMinYMid">
28 <path
29 d="m1.5 1.25h9c0.4155 0 0.75 0.3345 0.75 0.75v6.9999c0 0.4155-0.3345 0.75-0.75 0.75h-7.25l-2.5 2.5001v-10.25c0-0.4155 0.3345-0.75 0.75-0.75z"
30 fill="none" stroke="currentColor" />
31 <path d="m5.25 12.75h7.5l2.5 2.5001v-10.25c0-0.4155-0.3345-0.75-0.75-0.75h-0.25" fill="none"
32 stroke="currentColor" />
33 </symbol>
34
35 <symbol id="icon-parallelogram" viewBox="0 0 16 16" preserveAspectRatio="xMinYMid">
36 <path d="m15.25 4.25-5 7.5h-9.5l5-7.5z" fill="none" stroke="currentColor" />
37 </symbol>
38
39 <symbol id="icon-video" viewBox="0 0 16 16" preserveAspectRatio="xMinYMid">
40 <path d="m6.75 6.25 2.5 2-2.5 2z" fill="currentColor" stroke="currentColor" />
41 <rect x=".75" y="2.25" width="14.5" height="12" ry=".75" fill="none" stroke="currentColor" />
42 </symbol>
43
44 <symbol id="icon-graph" viewBox="0 0 16 16" preserveAspectRatio="xMinYMid">
45 <path
46 d="m7.25 12.5c0 0.9665-0.7835 1.75-1.75 1.75s-1.75-0.7835-1.75-1.75 0.7835-1.75 1.75-1.75 1.75 0.7835 1.75 1.75zm8-3c0 0.9665-0.7835 1.75-1.75 1.75s-1.75-0.7835-1.75-1.75c0-0.9665 0.7835-1.75 1.75-1.75s1.75 0.7835 1.75 1.75zm-6-6.5c0 0.9665-0.7835 1.75-1.75 1.75s-1.75-0.7835-1.75-1.75 0.7835-1.75 1.75-1.75 1.75 0.7835 1.75 1.75zm2 12.25 1.6219-4.1121m-8.331-0.13789-3.7909-5.25m6.4058 6.1626 4.6868-1.8235m-3.163-5.7868 3.5859 3.9307m-5.0863-3.5029-1.3496 6.043"
47 fill="none" stroke="currentColor" />
48 </symbol>
49
50 <symbol id="icon-git-branch" viewBox="0 0 16 16" preserveAspectRatio="xMinYMid">
51 <path
52 d="m12.25 5.75c0 3.5899-2.9101 6.5-6.5 6.5m3e-7 0c0 1.1046-0.89543 2-2 2s-2-0.89543-2-2 0.89543-2 2-2 2 0.89543 2 2zm8.5-8.5c0 1.1046-0.89543 2-2 2s-2-0.89543-2-2 0.89543-2 2-2 2 0.89543 2 2zm-10.5 6.4998v-7.9998"
53 fill="none" stroke="currentColor" />
54 </symbol>
55
13 <symbol id="icon-smile" viewBox="0 0 16 16" preserveAspectRatio="xMinYMid"> 56 <symbol id="icon-smile" viewBox="0 0 16 16" preserveAspectRatio="xMinYMid">
14 <path d="m11.309 9.7658c-0.63143 1.1808-1.8764 1.9842-3.3091 1.9842-1.4381 0-2.6872-0.80955-3.3163-1.9978" 57 <path d="m11.309 9.7658c-0.63143 1.1808-1.8764 1.9842-3.3091 1.9842-1.4381 0-2.6872-0.80955-3.3163-1.9978"
15 fill="none" stroke="currentColor" /> 58 fill="none" stroke="currentColor" />
diff --git a/metadata/metadata.yaml b/metadata/metadata.yaml
index 16388d2..c8f2d72 100644
--- a/metadata/metadata.yaml
+++ b/metadata/metadata.yaml
@@ -9,7 +9,7 @@ menus:
9 main: 9 main:
10 - id: projects 10 - id: projects
11 label: Projects 11 label: Projects
12 url: /#projects 12 url: /projects/
13 13
14 - id: 9thPK7O3xn 14 - id: 9thPK7O3xn
15 label: Personal 15 label: Personal
@@ -31,7 +31,8 @@ profiles:
31 31
32 - platform: Fediverse 32 - platform: Fediverse
33 icon: graph 33 icon: graph
34 username: "@volpeon@fedi.vulpes.one" 34 username: "@volpeon@mk.vulpes.one"
35 url: "https://mk.vulpes.one/@volpeon"
35 featured: true 36 featured: true
36 37
37 - platform: GitHub 38 - platform: GitHub
@@ -43,11 +44,6 @@ profiles:
43 icon: hash 44 icon: hash
44 username: volpeon 45 username: volpeon
45 46
46 - platform: PeerTube
47 icon: video
48 username: "@volpeon@pt.vulpes.one"
49 featured: true
50
51 - platform: Steam 47 - platform: Steam
52 username: volpeon 48 username: volpeon
53 url: https://steamcommunity.com/id/volpeon/ 49 url: https://steamcommunity.com/id/volpeon/
diff --git a/templates/layouts/categorized_list.html b/templates/layouts/categorized_list.html
index 8f8b1ae..fa0f000 100644
--- a/templates/layouts/categorized_list.html
+++ b/templates/layouts/categorized_list.html
@@ -5,17 +5,24 @@
5$body$ 5$body$
6 </div> 6 </div>
7 7
8 <div class="c-post-list"> 8 <div class="c-card-list">
9 $for(pages.asc_title)$ 9 $for(pages.asc_title)$
10 $if(it.pages)$ 10 $if(it.pages)$
11 <h2 class="c-post-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-post-list__category-content"> 14 <div class="c-card-list__category-content$if(pages.asc_title.list_grid)$ c-card-list__category-content--grid$endif$">
15 $if(pages.asc_title.show_dates)$ 15 $if(pages.asc_title.show_dates)$
16 $for(it.pages.desc_date)$ 16 $for(it.pages.desc_date)$
17 <a href="$it.url.rel$" class="c-post-list__post c-card"> 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.asc_title.show_read_indicators)$
19 <div class="c-card__block c-card__block--indicator"></div>
20 $endif$
21 $if(pages.asc_title.icon)$
22 <svg class="c-card__block o-icon">
23 <use href="/symbols.svg#icon-$pages.asc_title.icon$"></use>
24 </svg>
25 $endif$
19 <div class="c-card__block c-card__block--main"> 26 <div class="c-card__block c-card__block--main">
20 $it.title$ 27 $it.title$
21 </div> 28 </div>
@@ -31,8 +38,15 @@ $body$
31 $endfor$ 38 $endfor$
32 $else$ 39 $else$
33 $for(it.pages.asc_title)$ 40 $for(it.pages.asc_title)$
34 <a href="$it.url.rel$" class="c-post-list__post c-card"> 41 <a href="$it.url.rel$" class="c-card-list__card c-card">
35 <div class="c-card__block c-card__block--indicator"></div> 42 $if(pages.asc_title.show_read_indicators)$
43 <div class="c-card__block c-card__block--indicator"></div>
44 $endif$
45 $if(pages.asc_title.icon)$
46 <svg class="c-card__block o-icon">
47 <use href="/symbols.svg#icon-$pages.asc_title.icon$"></use>
48 </svg>
49 $endif$
36 <div class="c-card__block c-card__block--main"> 50 <div class="c-card__block c-card__block--main">
37 $it.title$ 51 $it.title$
38 </div> 52 </div>
diff --git a/templates/layouts/index.html b/templates/layouts/index.html
index a7b68c3..838f570 100644
--- a/templates/layouts/index.html
+++ b/templates/layouts/index.html
@@ -3,11 +3,48 @@
3$body$ 3$body$
4 </div> 4 </div>
5 5
6 <div id="projects" class="c-post-list c-post-list--grid"> 6 <div class="c-card-list">
7 <div class="c-post-list__category-content"> 7 <h2 class="c-card-list__category-header">
8 Profiles
9 </h2>
10 <div class="c-card-list__category-content c-card-list__category-content--grid">
11 $for(profiles)$
12 $if(it.featured)$
13 $if(it.url)$
14 <a class="c-card-list__card c-card" href="$it.url$">
15 $else$
16 <div class="c-card-list__card c-card">
17 $endif$
18 $if(it.icon)$
19 <svg class="c-card__block o-icon">
20 <use href="/symbols.svg#icon-$it.icon$"></use>
21 </svg>
22 $endif$
23 <div class="c-card__block c-card__block--main">
24 <strong class="u-db">$it.platform$</strong>
25 <small class="u-db">$it.username$</small>
26 </div>
27 $if(it.url)$
28 <svg class="c-card__block o-icon">
29 <use href="/symbols.svg#icon-arrow-up-right"></use>
30 </svg>
31 $endif$
32 $if(it.url)$
33 </a>
34 $else$
35 </div>
36 $endif$
37 $endif$
38 $endfor$
39 </div>
40
41 <h2 class="c-card-list__category-header">
42 <a href="$pages.by_id.projects.url.rel$">$pages.by_id.projects.title$</a>
43 </h2>
44 <div class="c-card-list__category-content c-card-list__category-content--grid">
8 $for(pages.by_id.projects.pages.all)$ 45 $for(pages.by_id.projects.pages.all)$
9 $for(it.pages.all)$ 46 $for(it.pages.all)$
10 <a href="$it.url.rel$" class="c-post-list__post c-card"> 47 <a href="$it.url.rel$" class="c-card-list__card c-card">
11 $if(pages.by_id.projects.pages.all.icon)$ 48 $if(pages.by_id.projects.pages.all.icon)$
12 <svg class="c-card__block o-icon"> 49 <svg class="c-card__block o-icon">
13 <use href="/symbols.svg#icon-$pages.by_id.projects.pages.all.icon$"></use> 50 <use href="/symbols.svg#icon-$pages.by_id.projects.pages.all.icon$"></use>
diff --git a/templates/layouts/list.html b/templates/layouts/list.html
index 4831228..c0045c0 100644
--- a/templates/layouts/list.html
+++ b/templates/layouts/list.html
@@ -5,12 +5,19 @@
5$body$ 5$body$
6 </div> 6 </div>
7 7
8 <div class="c-post-list"> 8 <div class="c-card-list">
9 <div class="c-post-list__category-content"> 9 <div class="c-card-list__category-content$if(list_grid)$ c-card-list__category-content--grid$endif$">
10 $if(show_dates)$ 10 $if(show_dates)$
11 $for(pages.desc_date)$ 11 $for(pages.desc_date)$
12 <a href="$it.url.rel$" class="c-post-list__post c-card"> 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(show_read_indicators)$
14 <div class="c-card__block c-card__block--indicator"></div>
15 $endif$
16 $if(icon)$
17 <svg class="c-card__block o-icon">
18 <use href="/symbols.svg#icon-$icon$"></use>
19 </svg>
20 $endif$
14 <div class="c-card__block c-card__block--main"> 21 <div class="c-card__block c-card__block--main">
15 $it.title$ 22 $it.title$
16 </div> 23 </div>
@@ -26,8 +33,15 @@ $body$
26 $endfor$ 33 $endfor$
27 $else$ 34 $else$
28 $for(pages.asc_title)$ 35 $for(pages.asc_title)$
29 <a href="$it.url.rel$" class="c-post-list__post c-card"> 36 <a href="$it.url.rel$" class="c-card-list__card c-card">
30 <div class="c-card__block c-card__block--indicator"></div> 37 $if(show_read_indicators)$
38 <div class="c-card__block c-card__block--indicator"></div>
39 $endif$
40 $if(icon)$
41 <svg class="c-card__block o-icon">
42 <use href="/symbols.svg#icon-$icon$"></use>
43 </svg>
44 $endif$
31 <div class="c-card__block c-card__block--main"> 45 <div class="c-card__block c-card__block--main">
32 $it.title$ 46 $it.title$
33 </div> 47 </div>