1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
|
$accent: scale-color(#e8ad58, $lightness: 30%);
$background: hsl(210, 14%, 9%);
$text: mix(hsl(210, 60%, 95%), $background, 85%);
$text-minus: mix(hsl(210, 100%, 95%), $background, 60%);
$text-faint: mix(hsl(210, 100%, 95%), $background, 40%);
$text-plus: #fff;
$link-idle: $text-plus;
$link-visited: $text;
$border: mix(hsl(210, 100%, 95%), $background, 16%);
$sel-background: rgba($accent, .996);
$sel-text: #000;
@font-face {
font-family: 'Iosevka Term SS03';
font-style: normal;
font-weight: normal;
src: url('/iosevka-term-ss03-regular.woff2') format('woff2'),
url('/iosevka-term-ss03-regular.woff') format('woff');
}
body {
margin: 0;
padding: 0;
background-color: $background;
// background-image: repeating-linear-gradient(
// rgba(0, 0, 0, .25),
// rgba(0, 0, 0, .25) 1px,
// hsla(210, 100%, 95%, .025) 1px,
// hsla(210, 100%, 95%, .025) 2px
// );
color: $text;
}
::selection {
color: $sel-text;
background-color: $sel-background;
}
:link {
color: $link-idle;
}
:visited {
color: $link-visited;
}
// :link, :visited {
// &:hover {
// color: $text-plus;
// }
// }
.header {
padding: .9em 1em;
border-bottom: 1px solid $border;
font-family: 'Iosevka Term SS03', 'IBM Plex Mono', 'Fira Code', 'Fira Mono', 'Roboto Mono', 'Droid Sans Mono', Monaco, Consolas, Courier, monospace;
font-size: 1 / 16 * 17em;
line-height: 1.3;
color: $text-faint;
}
.header__uripart {
color: $text-minus;
}
.header__uripart--last {
color: $text-plus;
}
.wrap {
text-align: center;
}
.content {
display: inline-block;
min-width: 50em;
min-width: 5ch + 80;
margin: 0;
padding: 2em 1em;
text-align: left;
font-family: 'Iosevka Term SS03', 'IBM Plex Mono', 'Fira Code', 'Fira Mono', 'Roboto Mono', 'Droid Sans Mono', Monaco, Consolas, Courier, monospace;
font-size: 1 / 16 * 17em;
line-height: 1.5;
}
.link-type {
color: $text-minus;
}
|