summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorVolpeon <git@volpeon.ink>2021-03-26 23:17:56 +0100
committerVolpeon <git@volpeon.ink>2021-03-26 23:17:56 +0100
commit6e0a7ea009b08983f2966d51fe4438681c0863c3 (patch)
treeae337f7903bb60ef6f5a71275101678ca0e58d88
parentWIP: Redesign (diff)
downloadvolpeon.ink-6e0a7ea009b08983f2966d51fe4438681c0863c3.tar.gz
volpeon.ink-6e0a7ea009b08983f2966d51fe4438681c0863c3.tar.bz2
volpeon.ink-6e0a7ea009b08983f2966d51fe4438681c0863c3.zip
WIP: Redesign
Diffstat
-rw-r--r--assets/css/_basics.scss2
-rw-r--r--assets/css/_vars.scss8
-rw-r--r--assets/css/components/_nav.scss3
-rw-r--r--assets/css/layouts/_landing.scss7
-rw-r--r--templates/layouts/categorized_list.html34
-rw-r--r--templates/layouts/index copy.html2
-rw-r--r--templates/layouts/index.html25
-rw-r--r--templates/layouts/page.html18
8 files changed, 57 insertions, 42 deletions
diff --git a/assets/css/_basics.scss b/assets/css/_basics.scss
index d05bc36..3e67b76 100644
--- a/assets/css/_basics.scss
+++ b/assets/css/_basics.scss
@@ -30,7 +30,7 @@ html {
30 30
31body { 31body {
32 margin: 0; 32 margin: 0;
33 padding: prop(--dims --nav --height, $global: true) 0 0; 33 padding: prop(--dims --outer, $global: true) 0 0;
34} 34}
35 35
36pre, 36pre,
diff --git a/assets/css/_vars.scss b/assets/css/_vars.scss
index 18cebc6..1063dc8 100644
--- a/assets/css/_vars.scss
+++ b/assets/css/_vars.scss
@@ -30,9 +30,7 @@ $gray6: hsl(220, 0%, 100%);
30 30
31@include store(( 31@include store((
32 --dims: ( 32 --dims: (
33 --nav: ( 33 --outer: 4.5rem,
34 --height: 4.5rem
35 )
36 ), 34 ),
37 --colors: ( 35 --colors: (
38 --bg-hi: $gray0, // Darker background 36 --bg-hi: $gray0, // Darker background
@@ -64,9 +62,7 @@ $gray6: hsl(220, 0%, 100%);
64 62
65@include store(( 63@include store((
66 --dims: ( 64 --dims: (
67 --nav: ( 65 --outer: 4rem
68 --height: 3.5rem
69 )
70 ), 66 ),
71), 'sm'); 67), 'sm');
72 68
diff --git a/assets/css/components/_nav.scss b/assets/css/components/_nav.scss
index 900b4f2..d0a255e 100644
--- a/assets/css/components/_nav.scss
+++ b/assets/css/components/_nav.scss
@@ -2,7 +2,6 @@
2 @include store(( 2 @include store((
3 --dims: ( 3 --dims: (
4 --font-size: 15px, 4 --font-size: 15px,
5 --height: prop(--dims --nav --height, $global: true),
6 --pad-x: 2.5rem, 5 --pad-x: 2.5rem,
7 --item: ( 6 --item: (
8 --pad-x: 1rem, 7 --pad-x: 1rem,
@@ -52,7 +51,7 @@
52 z-index: 10000; 51 z-index: 10000;
53 top: 0; 52 top: 0;
54 left: 0; 53 left: 0;
55 height: prop(--dims --height); 54 height: prop(--dims --outer, $global: true);
56 padding: 0 prop(--dims --pad-x); 55 padding: 0 prop(--dims --pad-x);
57 background-color: prop(--colors --bg); 56 background-color: prop(--colors --bg);
58 font-size: prop(--dims --font-size); 57 font-size: prop(--dims --font-size);
diff --git a/assets/css/layouts/_landing.scss b/assets/css/layouts/_landing.scss
index 7683d44..03af39f 100644
--- a/assets/css/layouts/_landing.scss
+++ b/assets/css/layouts/_landing.scss
@@ -10,9 +10,11 @@
10 10
11 @include layout(namespace()) { 11 @include layout(namespace()) {
12 display: flex; 12 display: flex;
13 box-sizing: border-box;
13 flex-direction: row; 14 flex-direction: row;
14 align-items: center; 15 align-items: center;
15 min-height: 100%; 16 min-height: 100%;
17 padding-bottom: prop(--dims --outer, $global: true);
16 18
17 @include element('banner') { 19 @include element('banner') {
18 flex-shrink: 1.2; 20 flex-shrink: 1.2;
@@ -36,8 +38,9 @@
36 } 38 }
37 39
38 @include media('<=md') { 40 @include media('<=md') {
39 display: block; 41 display: block;
40 height: auto; 42 height: auto;
43 padding-bottom: 0;
41 44
42 @include element('banner', 'content') { 45 @include element('banner', 'content') {
43 width: auto; 46 width: auto;
diff --git a/templates/layouts/categorized_list.html b/templates/layouts/categorized_list.html
index b32d2d5..8c25ec0 100644
--- a/templates/layouts/categorized_list.html
+++ b/templates/layouts/categorized_list.html
@@ -1,21 +1,23 @@
1<main class="c-page s-page l-container l-container--content l-container--pad-v"> 1<main>
2 <div class="c-page__content s-page-content"> 2 <div class="c-page s-page l-container l-container--content l-container--pad-x l-container--pad-y">
3 <div class="c-page__content s-page-content">
3$body$ 4$body$
4 5
5 $for(pages.by_category)$ 6 $for(pages.by_category)$
6 <h2 class="c-page__prefixed c-page__prefixed--h2"> 7 <h2 class="c-page__prefixed c-page__prefixed--h2">
7 $for(it.value/first)$ 8 $for(it.value/first)$
8 $it.category.name$ 9 $it.category.name$
9 $endfor$ 10 $endfor$
10 </h2> 11 </h2>
11 <ul> 12 <ul>
12 $for(it.value)$ 13 $for(it.value)$
13 <li class="c-page__prefixed c-page__prefixed--ref"> 14 <li class="c-page__prefixed c-page__prefixed--ref">
14 <a href="$it.url.rel$">$it.title$</a> 15 <a href="$it.url.rel$">$it.title$</a>
15 </li> 16 </li>
16 $endfor$ 17 $endfor$
17 </ul> 18 </ul>
18 $endfor$ 19 $endfor$
20 </div>
19 </div> 21 </div>
20</main> 22</main>
21 23
diff --git a/templates/layouts/index copy.html b/templates/layouts/index copy.html
index 34d8b0f..bd7cd3f 100644
--- a/templates/layouts/index copy.html
+++ b/templates/layouts/index copy.html
@@ -1,4 +1,4 @@
1<main class="c-page s-page l-container l-container--content l-container--pad-v l-container--pad-v--first"> 1<main class="c-page s-page l-container l-container--content l-container--pad-y l-container--pad-v--first">
2 <div class="c-page__content"> 2 <div class="c-page__content">
3 <header class="c-hero u-hidden@sm-down" role="presentation"> 3 <header class="c-hero u-hidden@sm-down" role="presentation">
4 $-- ' | ' ' ' ' ' | | | ' ' 4 $-- ' | ' ' ' ' ' | | | ' '
diff --git a/templates/layouts/index.html b/templates/layouts/index.html
index b2ccaa6..9b43503 100644
--- a/templates/layouts/index.html
+++ b/templates/layouts/index.html
@@ -20,14 +20,27 @@
20 20
21 <div class="l-card-grid"> 21 <div class="l-card-grid">
22 $for(profiles)$ 22 $for(profiles)$
23 <div class="c-card"> 23 $if(it.url)$
24 <div class="c-card__content"> 24 <a class="c-card" href="$it.url$">
25 <div> 25 $else$
26 <strong class="u-db">$it.platform$</strong> 26 <div class="c-card">
27 <small class="u-db">$it.username$</small> 27 $endif$
28 <div class="c-card__content">
29 <div>
30 <strong class="u-db">$it.platform$</strong>
31 <small class="u-db">$it.username$</small>
32 </div>
33 $if(it.url)$
34 <svg class="c-card__icon o-icon">
35 <use href="#icon-link-external"></use>
36 </svg>
37 $endif$
28 </div> 38 </div>
39 $if(it.url)$
40 </a>
41 $else$
29 </div> 42 </div>
30 </div> 43 $endif$
31 $endfor$ 44 $endfor$
32 </div> 45 </div>
33 46
diff --git a/templates/layouts/page.html b/templates/layouts/page.html
index fca4b9f..9e7d85a 100644
--- a/templates/layouts/page.html
+++ b/templates/layouts/page.html
@@ -1,13 +1,15 @@
1<main class="c-page l-container l-container--content l-container--pad-v"> 1<main>
2 <div class="c-page__content s-page-content"> 2 <div class="c-page l-container l-container--content l-container--pad-x l-container--pad-y">
3 <header class="c-page__header"> 3 <div class="c-page__content s-page-content">
4 <h1 class="c-page__prefixed c-page__prefixed--h1 c-page__header__title">$title$</h1> 4 <header class="c-page__header">
5 $if(category)$ 5 <h1 class="c-page__prefixed c-page__prefixed--h1 c-page__header__title">$title$</h1>
6 <h2 class="c-page__header__meta">in $category.name$</h2> 6 $if(category)$
7 $endif$ 7 <h2 class="c-page__header__meta">in $category.name$</h2>
8 </header> 8 $endif$
9 </header>
9 10
10$body$ 11$body$
12 </div>
11 </div> 13 </div>
12</main> 14</main>
13 15
generated by cgit v1.2.3-70-g09d2 (git 2.47.0) at 2024-12-25 20:21:30 +0000