diff options
author | Feuerfuchs <git@feuerfuchs.dev> | 2019-06-04 22:28:02 +0200 |
---|---|---|
committer | Feuerfuchs <git@feuerfuchs.dev> | 2019-06-04 22:28:02 +0200 |
commit | ce19e19efce3139d2c7b4024274b6ed2683e015e (patch) | |
tree | a6a06ff79bceec34fcf47c0721f03bd5e0f943fb /css | |
parent | Add custom styles (diff) | |
download | gopherproxy-ce19e19efce3139d2c7b4024274b6ed2683e015e.tar.gz gopherproxy-ce19e19efce3139d2c7b4024274b6ed2683e015e.tar.bz2 gopherproxy-ce19e19efce3139d2c7b4024274b6ed2683e015e.zip |
Style improvements
Diffstat (limited to 'css')
-rw-r--r-- | css/main.scss | 29 |
1 files changed, 13 insertions, 16 deletions
diff --git a/css/main.scss b/css/main.scss index dfda503..8ae988e 100644 --- a/css/main.scss +++ b/css/main.scss | |||
@@ -1,20 +1,17 @@ | |||
1 | $accent: scale-color(#e8ad58, $lightness: 30%); | ||
1 | $background: hsl(210, 14%, 9%); | 2 | $background: hsl(210, 14%, 9%); |
2 | $text: mix(hsl(210, 60%, 95%), $background, 85%); | 3 | $text: mix(hsl(210, 60%, 95%), $background, 85%); |
3 | $text-minus: mix(hsl(210, 100%, 95%), $background, 60%); | 4 | $text-minus: mix(hsl(210, 100%, 95%), $background, 60%); |
4 | $text-faint: mix(hsl(210, 100%, 95%), $background, 40%); | 5 | $text-faint: mix(hsl(210, 100%, 95%), $background, 40%); |
5 | $text-plus: #fff; | 6 | $text-plus: #fff; |
6 | $sel-background: $text; | 7 | $link-idle: $text-plus; |
8 | $link-visited: $text; | ||
9 | $sel-background: $accent; | ||
7 | $sel-text: #000; | 10 | $sel-text: #000; |
8 | 11 | ||
9 | @font-face { | ||
10 | font-family: 'IBM Plex Mono'; | ||
11 | font-style: normal; | ||
12 | font-weight: normal; | ||
13 | src: url('/assets/IBMPlexMono-Regular.woff2') format('woff2'), | ||
14 | url('/assets/IBMPlexMono-Regular.woff') format('woff'); | ||
15 | } | ||
16 | |||
17 | body { | 12 | body { |
13 | margin: 0; | ||
14 | padding: 0; | ||
18 | background-color: $background; | 15 | background-color: $background; |
19 | color: $text; | 16 | color: $text; |
20 | } | 17 | } |
@@ -40,18 +37,18 @@ body { | |||
40 | } | 37 | } |
41 | 38 | ||
42 | :link { | 39 | :link { |
43 | color: $text-plus; | 40 | color: $link-idle; |
44 | } | 41 | } |
45 | 42 | ||
46 | :visited { | 43 | :visited { |
47 | color: $text; | 44 | color: $link-visited; |
48 | } | 45 | } |
49 | 46 | ||
50 | :link, :visited { | 47 | // :link, :visited { |
51 | &:hover { | 48 | // &:hover { |
52 | color: $text-plus; | 49 | // color: $text-plus; |
53 | } | 50 | // } |
54 | } | 51 | // } |
55 | 52 | ||
56 | .link-type { | 53 | .link-type { |
57 | color: $text-minus; | 54 | color: $text-minus; |