summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
Diffstat
-rw-r--r--assets/css/_vars.scss4
-rw-r--r--assets/css/components/_footer.scss4
-rw-r--r--assets/css/components/_outer-button.scss34
-rw-r--r--assets/css/layouts/_container.scss16
-rw-r--r--assets/css/layouts/_section.scss6
-rw-r--r--templates/layouts/index copy.html45
6 files changed, 30 insertions, 79 deletions
diff --git a/assets/css/_vars.scss b/assets/css/_vars.scss
index 71dc5d2..756ddb8 100644
--- a/assets/css/_vars.scss
+++ b/assets/css/_vars.scss
@@ -31,9 +31,7 @@ $gray7: hsl(220, 0%, 100%);
31 31
32@include store(( 32@include store((
33 --dims: ( 33 --dims: (
34 --outer: 4rem, 34 --outer: 4rem,
35 --outer-spacing: 1.7rem,
36 --spacing-y: 4rem,
37 ), 35 ),
38 --colors: ( 36 --colors: (
39 --bg-hi: $gray0, // Darker background 37 --bg-hi: $gray0, // Darker background
diff --git a/assets/css/components/_footer.scss b/assets/css/components/_footer.scss
index 225cd29..fcea457 100644
--- a/assets/css/components/_footer.scss
+++ b/assets/css/components/_footer.scss
@@ -18,8 +18,8 @@
18 width: 100%; 18 width: 100%;
19 height: 100%; 19 height: 100%;
20 margin-top: -1px; 20 margin-top: -1px;
21 margin-right: prop(--dims --outer-spacing, $global: true); 21 margin-right: prop(--container --dims --pad-x, $global: true);
22 margin-left: prop(--dims --outer-spacing, $global: true); 22 margin-left: prop(--container --dims --pad-x, $global: true);
23 border-top: 1px solid prop(--colors --border); 23 border-top: 1px solid prop(--colors --border);
24 color: prop(--colors --fg); 24 color: prop(--colors --fg);
25 line-height: prop(--dims --outer, $global: true); 25 line-height: prop(--dims --outer, $global: true);
diff --git a/assets/css/components/_outer-button.scss b/assets/css/components/_outer-button.scss
index 774281d..d636f7d 100644
--- a/assets/css/components/_outer-button.scss
+++ b/assets/css/components/_outer-button.scss
@@ -11,6 +11,9 @@
11 --fg: prop(--colors --fg-lo, $global: true), 11 --fg: prop(--colors --fg-lo, $global: true),
12 --bg: prop(--colors --bg-hi, $global: true), 12 --bg: prop(--colors --bg-hi, $global: true),
13 ) 13 )
14 ),
15 --dims: (
16 --pad-x: 1.7rem,
14 ) 17 )
15 )); 18 ));
16 19
@@ -31,6 +34,11 @@
31 bottom: 0; 34 bottom: 0;
32 } 35 }
33 36
37 @include modifier('inverted') {
38 background-color: prop(--colors --inverted --bg);
39 color: prop(--colors --inverted --fg);
40 }
41
34 @include element('icon') { 42 @include element('icon') {
35 display: flex; 43 display: flex;
36 position: relative; 44 position: relative;
@@ -39,20 +47,6 @@
39 justify-content: center; 47 justify-content: center;
40 width: prop(--dims --outer, $global: true); 48 width: prop(--dims --outer, $global: true);
41 height: 100%; 49 height: 100%;
42 transition: background-color .2s, color .2s;
43 }
44
45 @include modifier('inverted') {
46 background-color: prop(--colors --inverted --bg);
47 color: prop(--colors --inverted --fg);
48 }
49
50 &:link,
51 &:visited {
52 &:hover {
53 background-color: prop(--colors --hover --bg);
54 color: prop(--colors --hover --fg);
55 }
56 } 50 }
57 51
58 @include element('icon-symbol') { 52 @include element('icon-symbol') {
@@ -63,10 +57,18 @@
63 57
64 @include element('content') { 58 @include element('content') {
65 height: 100%; 59 height: 100%;
66 padding-right: prop(--dims --outer-spacing, $global: true); 60 padding-right: prop(--dims --pad-x);
67 padding-left: prop(--dims --outer-spacing, $global: true); 61 padding-left: prop(--dims --pad-x);
68 line-height: prop(--dims --outer, $global: true); 62 line-height: prop(--dims --outer, $global: true);
69 white-space: nowrap; 63 white-space: nowrap;
70 } 64 }
65
66 &:link,
67 &:visited {
68 &:hover {
69 background-color: prop(--colors --hover --bg);
70 color: prop(--colors --hover --fg);
71 }
72 }
71 } 73 }
72} 74}
diff --git a/assets/css/layouts/_container.scss b/assets/css/layouts/_container.scss
index 0f569e4..ae23042 100644
--- a/assets/css/layouts/_container.scss
+++ b/assets/css/layouts/_container.scss
@@ -1,19 +1,15 @@
1@include namespace('container') { 1@include namespace('container') {
2 @include store(( 2 @include store((
3 --dims: ( 3 --dims: (
4 --pad-x: 3rem 4 --pad-x: 2rem,
5 --pad-y: 4rem,
5 ) 6 )
6 )); 7 ));
7 8
8 @include store(( 9 @include store((
9 --dims: ( 10 --dims: (
10 --pad-x: 2rem 11 --pad-x: 1rem,
11 ) 12 --pad-y: 3rem,
12 ), 'md');
13
14 @include store((
15 --dims: (
16 --pad-x: 4%
17 ) 13 )
18 ), 'sm'); 14 ), 'sm');
19 15
@@ -30,8 +26,8 @@
30 } 26 }
31 27
32 @include modifier('pad-y') { 28 @include modifier('pad-y') {
33 padding-top: prop(--dims --spacing-y, $global: true); 29 padding-top: prop(--dims --pad-y);
34 padding-bottom: prop(--dims --spacing-y, $global: true); 30 padding-bottom: prop(--dims --pad-y);
35 } 31 }
36 } 32 }
37} 33}
diff --git a/assets/css/layouts/_section.scss b/assets/css/layouts/_section.scss
index 3450858..70ace4c 100644
--- a/assets/css/layouts/_section.scss
+++ b/assets/css/layouts/_section.scss
@@ -2,7 +2,7 @@
2 @include store(( 2 @include store((
3 --colors: ( 3 --colors: (
4 --border: prop(--colors --obj-hi, $global: true), 4 --border: prop(--colors --obj-hi, $global: true),
5 ) 5 ),
6 )); 6 ));
7 7
8 @include layout(namespace()) { 8 @include layout(namespace()) {
@@ -33,8 +33,8 @@
33 width: 100%; 33 width: 100%;
34 height: 100%; 34 height: 100%;
35 margin-top: -1px; 35 margin-top: -1px;
36 margin-right: prop(--dims --outer-spacing, $global: true); 36 margin-right: prop(--container --dims --pad-x, $global: true);
37 margin-left: prop(--dims --outer-spacing, $global: true); 37 margin-left: prop(--container --dims --pad-x, $global: true);
38 border-top: 1px solid prop(--colors --border); 38 border-top: 1px solid prop(--colors --border);
39 } 39 }
40 } 40 }
diff --git a/templates/layouts/index copy.html b/templates/layouts/index copy.html
deleted file mode 100644
index bd7cd3f..0000000
--- a/templates/layouts/index copy.html
+++ /dev/null
@@ -1,45 +0,0 @@
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">
3 <header class="c-hero u-hidden@sm-down" role="presentation">
4 $-- ' | ' ' ' ' ' | | | ' '
5 $-- | ' ' ' //\_ ' | ' . | ' '
6 $-- .| ' ____,...,______..,_~`` -`.., ' | ' | ' '
7 $-- | _,~´"' , . ,~--´ ' _| | . |~~.__ ' '
8 $-- | | ,-" _.-|~/ |..,____,) ,/,,"' '_( | ' |) ) ' '
9 $-- '| \__,~"´ /:) / |:\ \ ,~( ) . | | ) `, ' _,--.
10 $-- ___\___.___:____(:/\_-,______\:.\_-,____.__\_.\______.__:___\__.___)_.___,/_____
11 $-- ░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░
12
13 <pre class="c-hero__pre c-page__prefixed c-page__prefixed--pre u-mt0 u-hidden@sm-down">
14`` ' | ' ' ' ' ' | | | ' '
15`` | ' ' ' <strong>//\_</strong> ' | ' . | ' '
16`` .| ' <strong>____,...,______..,_~`` -`..,</strong> ' | ' | ' '
17`` | <strong>_,~´"' , . ,~--´</strong> ' _| | . |~~.__ ' '
18`` | | <strong>,-" _.-|~/ |..,____,) ,/,,"'</strong> '_( | ' |) ) ' '
19`` '| <strong>\__,~"´ /:) / |:\ \</strong> ,~( ) . | | ) `, ' _,--.
20`` \ . : <strong>(:/\_-, \:.\_-,</strong> . \ .\ . : \ . ) . ' ,/ </pre>
21
22 </header>
23
24$body$
25 </div>
26</main>
27
28<footer class="c-footer l-container">
29 9thPK7O3xn
30</footer>
31
32<template id="header-sm">
33 $-- .| //\__ ' .' | . | ' . '
34 $-- | _.~-"""-----~`` ,-´ ' ' |' | ' '
35 $-- '| .´ ,~'\ ).,__,)/,," ' . ' | | | ' .'
36 $-- |_ `~´ (/\\, (/\\, _' '_ _| ' |_ _' '_
37
38 <pre class="c-hero__pre c-page__prefixed c-page__prefixed--pre u-mt0 $if(section.is_index)$u-hidden@sm-up$endif$">
39`` .| <strong> //\__</strong> ' .' | . | ' . '
40`` | <strong> _.~-"""-----~`` ,-´</strong> ' ' |' | ' '
41`` '| <strong>.´ ,~'\ ).,__,)/,," </strong> ' . ' | | | ' .'
42`` |_ <strong>`~´ (/\\, (/\\, </strong> _' '_ _| ' |_ _' '_</pre>
43</template>
44
45<script src="/index.js" type="text/javascript"></script>
generated by cgit v1.2.3-70-g09d2 (git 2.47.0) at 2024-12-25 17:37:29 +0000