summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorVolpeon <git@volpeon.ink>2021-11-14 16:32:43 +0100
committerVolpeon <git@volpeon.ink>2021-11-14 16:32:43 +0100
commit789a593987be88bc3e16b8ceb7357c24ef9e5aa2 (patch)
tree27f8852f8d80723d3297c9f2eb0473bddd2ffc2a
parentUpdate npm dependencies (diff)
downloadvolpeon.ink-789a593987be88bc3e16b8ceb7357c24ef9e5aa2.tar.gz
volpeon.ink-789a593987be88bc3e16b8ceb7357c24ef9e5aa2.tar.bz2
volpeon.ink-789a593987be88bc3e16b8ceb7357c24ef9e5aa2.zip
Optimized layout structure
Diffstat
-rw-r--r--assets/css/_basics.scss2
-rw-r--r--assets/css/components/_header.scss4
-rw-r--r--templates/base.html2
-rw-r--r--templates/layouts/categorized_list.html48
-rw-r--r--templates/layouts/list.html30
-rw-r--r--templates/layouts/page.html18
-rw-r--r--templates/layouts/redirect.html8
7 files changed, 55 insertions, 57 deletions
diff --git a/assets/css/_basics.scss b/assets/css/_basics.scss
index b9096e9..4d4ecc6 100644
--- a/assets/css/_basics.scss
+++ b/assets/css/_basics.scss
@@ -37,6 +37,8 @@ body {
37} 37}
38 38
39main { 39main {
40 width: 100%;
41
40 @include iro-responsive-env(('sm', 'md')) { 42 @include iro-responsive-env(('sm', 'md')) {
41 font-size: iro-responsive-set((1rem, 1 / 16 * 18rem)); 43 font-size: iro-responsive-set((1rem, 1 / 16 * 18rem));
42 } 44 }
diff --git a/assets/css/components/_header.scss b/assets/css/components/_header.scss
index 341be75..a59c039 100644
--- a/assets/css/components/_header.scss
+++ b/assets/css/components/_header.scss
@@ -64,5 +64,9 @@
64 width: prop(--dims --icon); 64 width: prop(--dims --icon);
65 height: prop(--dims --icon); 65 height: prop(--dims --icon);
66 } 66 }
67
68 @include media('>=lg') {
69 position: absolute;
70 }
67 } 71 }
68} 72}
diff --git a/templates/base.html b/templates/base.html
index 9f439ed..0cfec50 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -65,7 +65,7 @@
65 $endif$ 65 $endif$
66 </nav> 66 </nav>
67 67
68 <main> 68 <main class="l-container l-container--pad-x l-container--pad-y l-container--content">
69 $if(layout.is_categorized_list)$ 69 $if(layout.is_categorized_list)$
70${layouts/categorized_list()} 70${layouts/categorized_list()}
71 $elseif(layout.is_list)$ 71 $elseif(layout.is_list)$
diff --git a/templates/layouts/categorized_list.html b/templates/layouts/categorized_list.html
index 256e9de..20c0ee5 100644
--- a/templates/layouts/categorized_list.html
+++ b/templates/layouts/categorized_list.html
@@ -1,29 +1,27 @@
1<section class="l-container l-container--pad-x l-container--pad-y l-container--content"> 1<div class="s-headlines s-colored-links">
2 <div class="s-headlines s-colored-links"> 2 <h1 class="u-mt0"><span class="s-headlines__title-inner">$title$</span></h1>
3 <h1 class="u-mt0"><span class="s-headlines__title-inner">$title$</span></h1>
4 3
5$body$ 4$body$
6 </div> 5</div>
7 6
8 <div class="c-card-list"> 7<div class="c-card-list">
9 $for(list)$ 8 $for(list)$
10 <header class="c-card-list__category-header"> 9 <header class="c-card-list__category-header">
11 <h2 class="c-card-list__category-title"> 10 <h2 class="c-card-list__category-title">
12 <a href="$it.url.rel$">$it.title$</a> 11 <a href="$it.url.rel$">$it.title$</a>
13 </h2> 12 </h2>
14 $if(it.content)$ 13 $if(it.content)$
15 <small class="c-card-list__category-subtitle">$it.content$</small> 14 <small class="c-card-list__category-subtitle">$it.content$</small>
16 $endif$
17 </header>
18 $if(it.grid)$
19 <div class="c-card-list__category-content c-card-list__category-content--grid">
20 $it.items:partials/grid_card()$
21 </div>
22 $else$
23 <div class="c-card-list__category-content">
24 $it.items:partials/list_card()$
25 </div>
26 $endif$ 15 $endif$
27 $endfor$ 16 </header>
28 </div> 17 $if(it.grid)$
29</section> 18 <div class="c-card-list__category-content c-card-list__category-content--grid">
19 $it.items:partials/grid_card()$
20 </div>
21 $else$
22 <div class="c-card-list__category-content">
23 $it.items:partials/list_card()$
24 </div>
25 $endif$
26 $endfor$
27</div>
diff --git a/templates/layouts/list.html b/templates/layouts/list.html
index 7a9d573..ff29314 100644
--- a/templates/layouts/list.html
+++ b/templates/layouts/list.html
@@ -1,21 +1,19 @@
1<section class="l-container l-container--pad-x l-container--pad-y l-container--content"> 1<div class="s-headlines s-colored-links">
2 <div class="s-headlines s-colored-links"> 2 <h1 class="u-mt0"><span class="s-headlines__title-inner">$title$</span></h1>
3 <h1 class="u-mt0"><span class="s-headlines__title-inner">$title$</span></h1>
4 3
5$body$ 4$body$
6 </div> 5</div>
7 6
8 <div class="c-card-list"> 7<div class="c-card-list">
9 $if(list_grid)$ 8 $if(list_grid)$
10 <div class="c-card-list__category-content c-card-list__category-content--grid"> 9 <div class="c-card-list__category-content c-card-list__category-content--grid">
11 $list:partials/grid_card()$ 10 $list:partials/grid_card()$
12 </div> 11 </div>
13 $else$ 12 $else$
14 <div class="c-card-list__category-content"> 13 <div class="c-card-list__category-content">
15 $list:partials/list_card()$ 14 $list:partials/list_card()$
16 </div> 15 </div>
17 $endif$ 16 $endif$
18 </div> 17</div>
19</section>
20 18
21 19
diff --git a/templates/layouts/page.html b/templates/layouts/page.html
index f1060ca..f6d3b53 100644
--- a/templates/layouts/page.html
+++ b/templates/layouts/page.html
@@ -1,13 +1,11 @@
1<div class="s-body"> 1<div class="s-body s-colored-links s-headlines">
2 <section class="l-container l-container--pad-x l-container--pad-y l-container--content s-colored-links s-headlines"> 2 $if(date)$
3 $if(date)$ 3 <div class="s-body__meta">
4 <div class="s-body__meta"> 4 $date.long$
5 $date.long$ 5 </div>
6 </div> 6 $endif$
7 $endif$
8 7
9 <h1 class="u-mt0"><span class="s-headlines__title-inner">$title$</span></h1> 8 <h1 class="u-mt0"><span class="s-headlines__title-inner">$title$</span></h1>
10 9
11 $body$ 10$body$
12 </section>
13</div> 11</div>
diff --git a/templates/layouts/redirect.html b/templates/layouts/redirect.html
index a51d47e..457b4fe 100644
--- a/templates/layouts/redirect.html
+++ b/templates/layouts/redirect.html
@@ -1,6 +1,4 @@
1<div class="s-body"> 1<div class="s-body s-colored-links s-headlines">
2 <section class="l-container l-container--pad-x l-container--pad-y l-container--content s-colored-links s-headlines"> 2 <h1 class="u-mt0"><span class="s-headlines__title-inner">Redirect</span></h1>
3 <h1 class="u-mt0"><span class="s-headlines__title-inner">Redirect</span></h1> 3 <p>This page should redirect you to <a href="$url.full$">$url.full$</a> in 3 seconds.</p>
4 <p>This page should redirect you to <a href="$url.full$">$url.full$</a> in 3 seconds.</p>
5 </section>
6</div> 4</div>
generated by cgit v1.2.3-70-g09d2 (git 2.47.0) at 2024-12-25 17:56:50 +0000