summaryrefslogtreecommitdiffstats
path: root/assets
diff options
context:
space:
mode:
authorVolpeon <git@volpeon.ink>2021-01-07 20:48:05 +0100
committerVolpeon <git@volpeon.ink>2021-01-07 20:48:05 +0100
commitf3e649f674b739a8f50460f809eb8df2c13ff576 (patch)
treea406fc9a1c4d539e250f9869e6c93e5398f733d6 /assets
parentSmall design adjustments, added support for code blocks marked as 'plain' (diff)
downloadvolpeon.ink-f3e649f674b739a8f50460f809eb8df2c13ff576.tar.gz
volpeon.ink-f3e649f674b739a8f50460f809eb8df2c13ff576.tar.bz2
volpeon.ink-f3e649f674b739a8f50460f809eb8df2c13ff576.zip
Optimized CSS for code blocks
Diffstat (limited to 'assets')
-rw-r--r--assets/css/_basics.scss12
-rw-r--r--assets/css/components/_page.scss10
-rw-r--r--assets/css/scopes/_code.scss15
3 files changed, 14 insertions, 23 deletions
diff --git a/assets/css/_basics.scss b/assets/css/_basics.scss
index cbdfb9a..14c0391 100644
--- a/assets/css/_basics.scss
+++ b/assets/css/_basics.scss
@@ -46,10 +46,10 @@ code {
46pre { 46pre {
47 margin: ($line-height * 1em) 0 0; 47 margin: ($line-height * 1em) 0 0;
48 overflow-x: auto; 48 overflow-x: auto;
49 color: var(--code-block--fg); 49
50 font-size: $code-block--font-size; 50 code {
51 line-height: $code-block--line-height; 51 color: currentColor;
52 text-overflow: ''; 52 }
53 53
54 strong { 54 strong {
55 font-weight: normal; 55 font-weight: normal;
@@ -180,8 +180,8 @@ hr {
180 background-color: var(--obj); 180 background-color: var(--obj);
181} 181}
182 182
183blockquote { 183blockquote,
184 position: relative; 184pre {
185 margin: ($line-height * 1em) 0 0 1px; 185 margin: ($line-height * 1em) 0 0 1px;
186 padding-left: calc(#{$subcontent--indent} - 3px); 186 padding-left: calc(#{$subcontent--indent} - 3px);
187 border-left: 2px solid var(--obj); 187 border-left: 2px solid var(--obj);
diff --git a/assets/css/components/_page.scss b/assets/css/components/_page.scss
index 87d5413..a55bcb4 100644
--- a/assets/css/components/_page.scss
+++ b/assets/css/components/_page.scss
@@ -29,12 +29,6 @@
29 } 29 }
30 } 30 }
31 31
32 &__code {
33 margin-left: 1px;
34 padding-left: calc(#{$subcontent--indent} - 3px);
35 border-left: 2px solid var(--obj);
36 }
37
38 &__prefixed { 32 &__prefixed {
39 position: relative; 33 position: relative;
40 margin-left: -1 * $page--item-prefix--width; 34 margin-left: -1 * $page--item-prefix--width;
@@ -82,6 +76,10 @@
82 margin-left: calc(#{-1 * $page--item-prefix--width} * #{$scale-factor}); 76 margin-left: calc(#{-1 * $page--item-prefix--width} * #{$scale-factor});
83 padding-left: calc(#{$page--item-prefix--width} * #{$scale-factor}); 77 padding-left: calc(#{$page--item-prefix--width} * #{$scale-factor});
84 border-left: 0; 78 border-left: 0;
79 color: var(--code-block--fg);
80 font-size: $code-block--font-size;
81 line-height: $code-block--line-height;
82 text-overflow: '';
85 83
86 &::before { 84 &::before {
87 content: str-repeat('``\A', 40); 85 content: str-repeat('``\A', 40);
diff --git a/assets/css/scopes/_code.scss b/assets/css/scopes/_code.scss
index f024dbd..4a40d0f 100644
--- a/assets/css/scopes/_code.scss
+++ b/assets/css/scopes/_code.scss
@@ -1,22 +1,15 @@
1.s-code { 1.s-code {
2 pre, 2 &--highlight {
3 code { 3 pre {
4 color: var(--fg-lo); 4 color: var(--fg-lo);
5 }
5 } 6 }
6 7
7 pre { 8 pre {
8 overflow-x: auto;
9 font-size: 1em; 9 font-size: 1em;
10 line-height: $line-height; 10 line-height: $line-height;
11 } 11 }
12 12
13 &--plain {
14 pre,
15 code {
16 color: var(--fg);
17 }
18 }
19
20 /* stylelint-disable selector-class-pattern */ 13 /* stylelint-disable selector-class-pattern */
21 14
22 .c { 15 .c {