aboutsummaryrefslogtreecommitdiffstats
path: root/css
diff options
context:
space:
mode:
Diffstat (limited to 'css')
-rw-r--r--css/main.scss58
1 files changed, 46 insertions, 12 deletions
diff --git a/css/main.scss b/css/main.scss
index d0646d7..0d5a5d9 100644
--- a/css/main.scss
+++ b/css/main.scss
@@ -10,6 +10,12 @@ $border: mix(hsl(210, 100%, 95%), $background, 16%);
10$sel-background: rgba($accent, .996); 10$sel-background: rgba($accent, .996);
11$sel-text: #000; 11$sel-text: #000;
12 12
13@mixin monospace-font {
14 font-family: 'Iosevka Term SS03', 'IBM Plex Mono', 'Fira Code', 'Fira Mono', 'Roboto Mono', 'Droid Sans Mono', Monaco, Consolas, Courier, monospace;
15 font-size: 1 / 16 * 17em;
16 line-height: 1.5;
17}
18
13@font-face { 19@font-face {
14 font-family: 'Iosevka Term SS03'; 20 font-family: 'Iosevka Term SS03';
15 font-style: normal; 21 font-style: normal;
@@ -31,6 +37,35 @@ body {
31 color: $text; 37 color: $text;
32} 38}
33 39
40button {
41 @include monospace-font;
42
43 background: none;
44 border: 0;
45 padding: 0;
46 color: $text-plus;
47}
48
49img {
50 display: inline-block;
51 vertical-align: top;
52 max-width: 8em;
53 margin: .1em 0;
54
55 &::selection {
56 background-color: rgba($sel-background, .35);
57 }
58
59 &.expanded {
60 max-width: 40em;
61 max-width: 80ch;
62 }
63
64 &.faded {
65 opacity: .5;
66 }
67}
68
34::selection { 69::selection {
35 color: $sel-text; 70 color: $sel-text;
36 background-color: $sel-background; 71 background-color: $sel-background;
@@ -51,10 +86,10 @@ body {
51// } 86// }
52 87
53.header { 88.header {
89 @include monospace-font;
90
54 padding: .9em 1em; 91 padding: .9em 1em;
55 border-bottom: 1px solid $border; 92 border-bottom: 1px solid $border;
56 font-family: 'Iosevka Term SS03', 'IBM Plex Mono', 'Fira Code', 'Fira Mono', 'Roboto Mono', 'Droid Sans Mono', Monaco, Consolas, Courier, monospace;
57 font-size: 1 / 16 * 17em;
58 line-height: 1.3; 93 line-height: 1.3;
59 color: $text-faint; 94 color: $text-faint;
60} 95}
@@ -72,17 +107,16 @@ body {
72} 107}
73 108
74.content { 109.content {
75 display: inline-block; 110 @include monospace-font;
76 min-width: 50em; 111
77 min-width: 5ch + 80; 112 display: inline-block;
78 margin: 0; 113 min-width: 50em;
79 padding: 2em 1em; 114 min-width: 5ch + 80;
80 text-align: left; 115 margin: 0;
81 font-family: 'Iosevka Term SS03', 'IBM Plex Mono', 'Fira Code', 'Fira Mono', 'Roboto Mono', 'Droid Sans Mono', Monaco, Consolas, Courier, monospace; 116 padding: 2em 1em;
82 font-size: 1 / 16 * 17em; 117 text-align: left;
83 line-height: 1.5;
84} 118}
85 119
86.link-type { 120.type-annotation {
87 color: $text-minus; 121 color: $text-minus;
88} 122}