revert compiletime sass color var; use runtime again

This commit is contained in:
wgroeneveld 2020-06-03 17:00:49 +02:00
parent 2bfe5894f8
commit cb49d272a9
12 changed files with 40 additions and 35 deletions

View File

@ -1,6 +1,7 @@
---
title: "Hi, Im Wouter Groeneveld"
bigimg: About Me.jpg
accent: darkred
disableComments: true
---

View File

@ -23,7 +23,7 @@ blockquote
-webkit-mask-size: cover
content: ''
display: inline-block
background-color: $accent
background-color: var(--accent)
position: absolute
width: 40px
height: 40px

View File

@ -3,9 +3,9 @@ h1
@media (min-width: 768px)
font-size: 3rem
h2
font-size: 2.0rem
font-size: 2.1rem
h3
font-size: 1.9rem
font-size: 1.7rem
h4
font-size: 1.5rem
h5
@ -47,7 +47,7 @@ code
font-family: Menlo,Monaco,Consolas,"Courier New",monospace
padding: 2px 4px
font-size: 90%
color: $accent2
color: var(--accent2)
background-color: #f9f2f4
border-radius: 4px
@ -119,7 +119,7 @@ pre code
display: inline-block !important
.navbar.navbar-default
border-top: 5px solid $accent
border-top: 5px solid var(--accent)
border-bottom: 1px solid #e7e7e7
.navbar-right
@ -199,7 +199,7 @@ nav
font-weight: bold
body > footer
border-bottom: 5px solid $accent
border-bottom: 5px solid var(--accent)
background-color: rgba(243, 243, 243, 0.8)
.navbar-default .navbar-toggle

View File

@ -39,12 +39,12 @@ div.highlight
a:link, a:visited, a
color: $accent
color: var(--accent)
text-decoration: none
&:hover
text-decoration: underline
color: darken($accent, 10%)
color: $grey
nav
a:hover
@ -83,6 +83,19 @@ main
article a
text-decoration: underline
&.post article > p:first-of-type::first-letter,
&.essays article > p:first-of-type::first-letter
font-size: 3.05em
font-weight: bold
line-height: 1.1em
float: left
margin-right: 10px
footer
margin-top: 3.5rem
header
margin: auto
padding-top: 1rem
@ -90,7 +103,7 @@ header
max-width: 80%
h1
color: $accent
color: var(--accent)
h2
margin-top: -1rem
h2, h3
@ -103,8 +116,8 @@ time
color: grey
kbd
color: $accent
border: 1px solid $accent
color: var(--accent)
border: 1px solid var(--accent)
font-size: 1rem
padding: 2px 4px
border-radius: 3px

View File

@ -3,8 +3,8 @@
font-size: 12pt !important
.commento-round-check input[type=checkbox]:checked+label:before, .commento-round-check input[type=radio]:checked+label:before
background: $accent !important
border: 1px solid $accent !important
background: var(--accent) !important
border: 1px solid var(--accent) !important
.commento-markdown-help tr td pre
padding: 0 !important
@ -16,14 +16,14 @@
.commento-button
color: white !important
background: $accent !important
background: var(--accent) !important
.commento-oauth-buttons button
width: auto !important
.commento-root a,
.commento-email-button
color: $accent !important
color: var(--accent) !important
.commento-name
font-size: 14pt !important

View File

@ -48,4 +48,4 @@ figure
-o-background-size: cover
border-top: 2px solid lightgray
border-bottom: 1px solid $accent
border-bottom: 1px solid var(--accent)

View File

@ -1,7 +1,7 @@
/* --- goodreads widget styles --- */
.goodreadswidget
border-bottom: 3px solid $accent
border-bottom: 3px solid var(--accent)
padding: 0px
padding-bottom: 10px

View File

@ -15,18 +15,6 @@ main
.icon
@extend %icon-in-text
&.single article > p:first-of-type::first-letter
font-size: 3.05em
font-weight: bold
line-height: 1.1em
float: left
margin-right: 10px
footer
margin-top: 3.5rem
.icon
width: 32px
height: 32px

View File

@ -29,7 +29,7 @@ div.list
padding-left: 0.4rem
padding-right: 0.4rem
color: white
background-color: $accent
background-color: var(--accent)
border-radius: 2rem
margin-top: 1.5rem
float: left
@ -46,4 +46,4 @@ div.list
.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover
background-color: white !important
border-color: $accent !important
border-color: var(--accent) !important

View File

@ -1,7 +1,4 @@
$grey: #333
$accent: {{ .Params.accent | default .Site.Params.accent }}
$accent2: {{ .Params.accent2 | default .Site.Params.accent2 }}
@import 'fonts'
@import 'bootstrap-minimal'

View File

@ -3,7 +3,7 @@
{{ partial "bigimg" . }}
{{ partial "single-header" . }}
<main class="single">
<main class="single {{ .Section }}">
<br>
<article>
<!-- thanks https://www.godo.dev/tutorials/hugo-image-figure-wrap/ -->

View File

@ -1,5 +1,11 @@
<link rel = 'stylesheet' href = '/css/simple-lightbox.min.css'>
<style>
:root {
--accent: {{ if .Params.accent }}{{ .Params.accent }}{{ else }}{{ .Site.Params.accent }}{{ end }};
--accent2: {{ if .Params.accent2 }}{{ .Params.accent2 }}{{ else }}{{ .Site.Params.accent2 }}{{ end }};
}
</style>
{{- $options := (dict "targetPath" "css/styles.css" "outputStyle" "compressed" "enableSourceMap" "true") -}}
{{- $styles := resources.Get "sass/main.sass" | resources.ExecuteAsTemplate "main.sass" . | resources.ToCSS $options | resources.Fingerprint "sha512" }}
<link rel = 'stylesheet' href = '{{ $styles.Permalink }}' integrity = '{{ $styles.Data.Integrity }}'>