add brightheader option
This commit is contained in:
parent
8f4743d718
commit
e1745b84ee
@ -13,6 +13,10 @@ Second, specify `contrast-hugo` as your default theme in the `config.toml` file.
|
||||
|
||||
at the top of the file.
|
||||
|
||||
## Options
|
||||
|
||||
To use the bright header, you can set `brightheader = true` in the `params` section of your config.
|
||||
|
||||
## Features
|
||||
|
||||
- supports dark mode on macOS Mojave
|
||||
|
@ -17,7 +17,7 @@
|
||||
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.10.2/dist/contrib/mathtex-script-type.min.js" integrity="sha256-b8diVEOgPDxUp0CuYCi7+lb5xIGcgrtIdrvE8d/oztQ=" crossorigin="anonymous"></script>
|
||||
{{- end }}
|
||||
|
||||
<header>
|
||||
<header class="{{ if .Site.Params.brightheader }}bright{{ else }}dark{{ end }}">
|
||||
<h1><a href="{{ .Site.BaseURL }}">{{ .Site.Title }}</a></h1>
|
||||
<nav>
|
||||
{{ range .Site.Menus.main }}
|
||||
|
@ -1,3 +1,10 @@
|
||||
@media (prefers-color-scheme: dark) {
|
||||
html {
|
||||
background: #282828;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
|
||||
font-size: 16px;
|
||||
@ -50,7 +57,7 @@ hr {
|
||||
|
||||
blockquote {
|
||||
background: rgba(148,148,148,0.06);
|
||||
border-left: 3px solid rgba(148,148,148,0.6);
|
||||
border-left: 4px solid #68f;
|
||||
padding: 1px 1.5em;
|
||||
}
|
||||
|
||||
@ -106,20 +113,6 @@ body > header, body > footer {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: light) {
|
||||
html {
|
||||
background: #fff;
|
||||
color: #282828;
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
html {
|
||||
background: #282828;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
body > header, article, body > footer {
|
||||
padding: 1.5em calc(34% - 12rem);
|
||||
}
|
||||
@ -134,7 +127,11 @@ article, body > footer {
|
||||
border-top: 1px solid rgba(148,148,148,0.12);
|
||||
}
|
||||
|
||||
body > header {
|
||||
body > header.bright {
|
||||
box-shadow: 0 0 1em rgba(40, 40, 40, .05);
|
||||
}
|
||||
|
||||
body > header.dark {
|
||||
background: #2b2b2b;
|
||||
color: #fff;
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user