summaryrefslogtreecommitdiffstats
path: root/assets/css
diff options
context:
space:
mode:
Diffstat (limited to 'assets/css')
-rw-r--r--assets/css/_basics.scss12
-rw-r--r--assets/css/_vars.scss15
-rw-r--r--assets/css/components/_nav.scss1
-rw-r--r--assets/css/components/_page-header.scss2
-rw-r--r--assets/css/layouts/_container.scss12
-rw-r--r--assets/css/scopes/_page.scss8
6 files changed, 26 insertions, 24 deletions
diff --git a/assets/css/_basics.scss b/assets/css/_basics.scss
index 202117e..da971d4 100644
--- a/assets/css/_basics.scss
+++ b/assets/css/_basics.scss
@@ -44,7 +44,7 @@ code {
44pre { 44pre {
45 margin: 0; 45 margin: 0;
46 color: var(--code-block-fg); 46 color: var(--code-block-fg);
47 font-size: 1em; 47 font-size: $code-block-font-size;
48 line-height: $code-block-line-height; 48 line-height: $code-block-line-height;
49 text-overflow: ""; 49 text-overflow: "";
50 overflow: hidden; 50 overflow: hidden;
@@ -61,7 +61,7 @@ strong {
61 61
62ul, 62ul,
63ol { 63ol {
64 margin: ($line-height * 1rem) 0 0; 64 margin: ($line-height * 1em) 0 0;
65 padding: 0; 65 padding: 0;
66 list-style: none; 66 list-style: none;
67} 67}
@@ -98,12 +98,12 @@ ol {
98h1, 98h1,
99h2, 99h2,
100h3 { 100h3 {
101 margin: ($line-height * 2rem) 0 0; 101 margin: ($line-height * 2em) 0 0;
102 102
103 + h1, 103 + h1,
104 + h2, 104 + h2,
105 + h3 { 105 + h3 {
106 margin-top: $line-height * 1rem; 106 margin-top: $line-height * 1em;
107 } 107 }
108} 108}
109 109
@@ -148,14 +148,14 @@ p {
148 148
149hr { 149hr {
150 height: 1px; 150 height: 1px;
151 margin: ($line-height * 2rem) 0 ($line-height * 2rem); 151 margin: ($line-height * 2em) 0 ($line-height * 2em);
152 background-color: var(--bg-plus); 152 background-color: var(--bg-plus);
153 border: 0; 153 border: 0;
154} 154}
155 155
156blockquote { 156blockquote {
157 position: relative; 157 position: relative;
158 margin: ($line-height * 1rem) 0 0; 158 margin: ($line-height * 1em) 0 0;
159 padding-left: calc(#{$subcontent-indent} - 2px); 159 padding-left: calc(#{$subcontent-indent} - 2px);
160 border-left: 2px solid var(--bg-plus); 160 border-left: 2px solid var(--bg-plus);
161} 161}
diff --git a/assets/css/_vars.scss b/assets/css/_vars.scss
index f9c80da..c061f4f 100644
--- a/assets/css/_vars.scss
+++ b/assets/css/_vars.scss
@@ -1,16 +1,21 @@
1$font-size: 16px; 1$font-size: 17px;
2$content-font-size: $font-size + 1; 2$nav-font-size: $font-size - 1;
3$content-h1-font-size: $content-font-size + 1; 3$code-block-font-size: $font-size - 1;
4$content-h1-font-size: $font-size + 1;
4 5
5$line-height: 1.5; 6$line-height: 1.5;
6$code-block-line-height: 1.4; 7$code-block-line-height: 1.4;
7 8
8$content-width: 75ch; 9$content-width: 80ch;
10
11$container-pad-h: 2rem;
12$container-pad-h-sm: 1rem;
13$container-pad-v: $line-height * 2rem;
9 14
10$nav-item-spacing: 4ch; 15$nav-item-spacing: 4ch;
11$nav-item-spacing-sm: 3ch; 16$nav-item-spacing-sm: 3ch;
12$nav-item-pad-h: 1ch; 17$nav-item-pad-h: 1ch;
13$nav-item-pad-v: 1rem; 18$nav-item-pad-v: 1em;
14 19
15$page-item-prefix-max-chars: 3ch; 20$page-item-prefix-max-chars: 3ch;
16$page-item-prefix-pad: 2ch; 21$page-item-prefix-pad: 2ch;
diff --git a/assets/css/components/_nav.scss b/assets/css/components/_nav.scss
index a85c7d8..7f5eb19 100644
--- a/assets/css/components/_nav.scss
+++ b/assets/css/components/_nav.scss
@@ -1,5 +1,6 @@
1.c-nav { 1.c-nav {
2 background-color: var(--nav-bg); 2 background-color: var(--nav-bg);
3 font-size: $nav-font-size;
3 4
4 &__items { 5 &__items {
5 display: flex; 6 display: flex;
diff --git a/assets/css/components/_page-header.scss b/assets/css/components/_page-header.scss
index 29eef00..ada20ab 100644
--- a/assets/css/components/_page-header.scss
+++ b/assets/css/components/_page-header.scss
@@ -1,5 +1,5 @@
1.c-page-header { 1.c-page-header {
2 margin-bottom: $line-height * 2rem; 2 margin-bottom: $line-height * 2em;
3 overflow: hidden; 3 overflow: hidden;
4 4
5 &::after { 5 &::after {
diff --git a/assets/css/layouts/_container.scss b/assets/css/layouts/_container.scss
index b5dee3c..7f6e292 100644
--- a/assets/css/layouts/_container.scss
+++ b/assets/css/layouts/_container.scss
@@ -1,6 +1,6 @@
1.l-container { 1.l-container {
2 padding-left: 2rem; 2 padding-left: $container-pad-h;
3 padding-right: 2rem; 3 padding-right: $container-pad-h;
4 4
5 &--content { 5 &--content {
6 margin-left: auto; 6 margin-left: auto;
@@ -9,12 +9,12 @@
9 } 9 }
10 10
11 &--pad-v { 11 &--pad-v {
12 padding-top: $line-height * 2rem; 12 padding-top: $container-pad-v;
13 padding-bottom: $line-height * 2rem; 13 padding-bottom: $container-pad-v;
14 } 14 }
15 15
16 @media (max-width: map-get($breakpoints, "sm")) { 16 @media (max-width: map-get($breakpoints, "sm")) {
17 padding-left: 1rem; 17 padding-left: $container-pad-h-sm;
18 padding-right: 1rem; 18 padding-right: $container-pad-h-sm;
19 } 19 }
20} 20}
diff --git a/assets/css/scopes/_page.scss b/assets/css/scopes/_page.scss
index 21d49d0..cdbdeb4 100644
--- a/assets/css/scopes/_page.scss
+++ b/assets/css/scopes/_page.scss
@@ -1,6 +1,4 @@
1.s-page { 1.s-page {
2 font-size: px-to-em($content-font-size);
3
4 &__content { 2 &__content {
5 padding-left: $page-item-prefix-width; 3 padding-left: $page-item-prefix-width;
6 4
@@ -32,11 +30,11 @@
32 } 30 }
33 31
34 h1 { 32 h1 {
35 font-size: px-to-em($content-h1-font-size, $content-font-size); 33 font-size: px-to-em($content-h1-font-size);
36 34
37 &::before { 35 &::before {
38 content: "#"; 36 content: "#";
39 font-size: px-to-em($content-font-size, $content-h1-font-size); 37 font-size: px-to-em($font-size, $content-h1-font-size);
40 } 38 }
41 } 39 }
42 40
@@ -53,8 +51,6 @@
53 } 51 }
54 52
55 pre { 53 pre {
56 font-size: px-to-em($font-size, $content-font-size);
57
58 &::before { 54 &::before {
59 content: str-repeat("``\A", 40); 55 content: str-repeat("``\A", 40);
60 height: 100%; 56 height: 100%;