87c4c8dfbd
* Add default dark theme for modern browsers This version is based on the DOM specification used by Firefox, Chrome, and the new Edge. Since it is standards compliant it should work on modern browsers, but dark mode won't be available on IE11 and maybe the old Edge. I have avoided the screen flash on loading the page, and toggling from dark to light (or vice versa) both when dark is default and when light is default. Signed-off-by: Daniel F. Dickinson <20735818+danielfdickinson@users.noreply.github.com> * Edit/improve as suggested by maintainer * Improves documentation (README.md) * Improves Go template logic for setting the default theme type * Improves coding (and markdown) style * Adds the new param to exampleSite/config.yaml for documentation Signed-off-by: Daniel F. Dickinson <20735818+danielfdickinson@users.noreply.github.com>
68 lines
2.0 KiB
HTML
68 lines
2.0 KiB
HTML
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
|
|
{{ hugo.Generator }}
|
|
<link rel="canonical" href="{{ .RelPermalink }}">
|
|
|
|
{{ if .IsHome }}
|
|
{{ with .Site.Params.homeMetaContent }}
|
|
<meta name="description" content="{{ . | plainify }}">
|
|
{{ end }}
|
|
{{ else }}
|
|
{{ $summary := trim (.Summary | plainify | htmlUnescape) "\n\r"
|
|
| default .Title }}
|
|
<meta name="description" content="{{ $summary }}">
|
|
{{ end }}
|
|
|
|
<link rel="apple-touch-icon" sizes="180x180" href="{{ "apple-touch-icon.png" | absURL }}">
|
|
<link rel="icon" type="image/png" sizes="32x32" href="{{ "favicon-32x32.png" | absURL }}">
|
|
<link rel="icon" type="image/png" sizes="16x16" href="{{ "favicon-16x16.png" | absURL }}">
|
|
<link rel="manifest" href="{{ "site.webmanifest" | absURL }}">
|
|
<link rel="mask-icon" href="{{ "safari-pinned-tab.svg" | absURL }}" color="#000000">
|
|
<meta name="msapplication-TileColor" content="#ffffff">
|
|
<meta name="theme-color" content="#ffffff">
|
|
|
|
<style>
|
|
body {
|
|
visibility: hidden;
|
|
opacity: 0;
|
|
}
|
|
</style>
|
|
|
|
<style id="darkTheme">
|
|
.intro-and-nav,
|
|
.main-and-footer {
|
|
filter: invert(100%);
|
|
}
|
|
|
|
* {
|
|
background-color: inherit
|
|
}
|
|
|
|
img:not([src*=".svg"]),
|
|
.colors,
|
|
iframe,
|
|
.demo-container {
|
|
filter: invert(100%);
|
|
}
|
|
</style>
|
|
|
|
<link rel="stylesheet" href="{{ "css/prism.css" | relURL }}" media="none" onload="this.media='all';">
|
|
|
|
{{ $templateStyles := resources.Get "css/template-styles.css" }}
|
|
{{ $styles := $templateStyles | resources.ExecuteAsTemplate "css/styles.css" . }}
|
|
<link rel="stylesheet" type="text/css" href="{{ $styles.RelPermalink }}">
|
|
|
|
{{ range .Site.Params.customCss }}
|
|
<link rel="stylesheet" href="{{ . | relURL }}">
|
|
{{ end }}
|
|
|
|
{{ $title := print .Title " | " .Site.Title }}
|
|
{{ if .IsHome }}
|
|
{{ $title = .Site.Title }}
|
|
{{ end }}
|
|
<title>{{ $title }}</title>
|
|
</head>
|