kaholaz/hello-friend-ng
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

theme-color now changes with site theme

Browse source
This commit is contained in:
Reijnn 2019-03-05 13:16:59 +01:00
parent e35ede04c2
commit 22c42bbd5f
3 changed files with 34 additions and 23 deletions
Download patch file Download diff file Expand all files Collapse all files

4
assets/js/theme.js
View file

@ -3,6 +3,7 @@
const getTheme = window.localStorage && window.localStorage.getItem("theme"); const getTheme = window.localStorage && window.localStorage.getItem("theme");
const themeToggle = document.querySelector(".theme-toggle"); const themeToggle = document.querySelector(".theme-toggle");
const isDark = getTheme === "dark"; const isDark = getTheme === "dark";
var metaThemeColor = document.querySelector("meta[name=theme-color]");
if (getTheme !== null) { if (getTheme !== null) {
document.body.classList.toggle("dark-theme", isDark); document.body.classList.toggle("dark-theme", isDark);
@ -15,4 +16,7 @@ themeToggle.addEventListener("click", () => {
"theme", "theme",
document.body.classList.contains("dark-theme") ? "dark" : "light", document.body.classList.contains("dark-theme") ? "dark" : "light",
); );
document.body.classList.contains("dark-theme") ?
metaThemeColor.setAttribute("content", "#252627") : metaThemeColor.setAttribute("content", "#fafafa");
;
}); });

4
layouts/partials/favicons.html
View file

@ -2,6 +2,6 @@
<link rel="icon" type="image/png" sizes="32x32" href="{{"favicon-32x32.png" | relURL}}"> <link rel="icon" type="image/png" sizes="32x32" href="{{"favicon-32x32.png" | relURL}}">
<link rel="icon" type="image/png" sizes="16x16" href="{{"favicon-16x16.png" | relURL}}"> <link rel="icon" type="image/png" sizes="16x16" href="{{"favicon-16x16.png" | relURL}}">
<link rel="manifest" href="{{"site.webmanifest" | relURL}}"> <link rel="manifest" href="{{"site.webmanifest" | relURL}}">
<link rel="mask-icon" href="{{"safari-pinned-tab.svg" | relURL}}" color="{{.Site.Params.themeColor}}"> <link rel="mask-icon" href="{{"safari-pinned-tab.svg" | relURL}}" color="#252627">
<link rel="shortcut icon" href="{{"favicon.ico" | relURL}}"> <link rel="shortcut icon" href="{{"favicon.ico" | relURL}}">
<meta name="theme-color" content="{{.Site.Params.themeColor}}"> <meta name="theme-color" content="#252627">

23
layouts/partials/head.html
View file

@ -1,8 +1,10 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="ie=edge"> <meta http-equiv="X-UA-Compatible" content="ie=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="author" content="{{ if .Params.author }}{{ .Params.author }}{{ else }}{{ range .Site.Author }}{{ . }} {{ end }}{{ end }}"> <meta name="author"
<meta name="description" content="{{ if .IsHome }}{{ .Site.Params.Subtitle }}{{ else }}{{ .Summary | plainify }}{{ end }}"/> content="{{ if .Params.author }}{{ .Params.author }}{{ else }}{{ range .Site.Author }}{{ . }} {{ end }}{{ end }}">
<meta name="description"
content="{{ if .IsHome }}{{ .Site.Params.Subtitle }}{{ else }}{{ .Summary | plainify }}{{ end }}" />
<meta name="keywords" content="{{ .Site.Params.keywords }}" /> <meta name="keywords" content="{{ .Site.Params.keywords }}" />
<meta name="robots" content="noodp" /> <meta name="robots" content="noodp" />
<link rel="canonical" href="{{ .Permalink }}" /> <link rel="canonical" href="{{ .Permalink }}" />
@ -18,8 +20,10 @@
{{ end }} {{ end }}
<!-- CSS --> <!-- CSS -->
<link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700|Source+Code+Pro" rel="stylesheet" type="text/css"> <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700|Source+Code+Pro" rel="stylesheet"
<link href="https://cdnjs.cloudflare.com/ajax/libs/flag-icon-css/3.2.1/css/flag-icon.min.css" rel="stylesheet" type="text/css"> type="text/css">
<link href="https://cdnjs.cloudflare.com/ajax/libs/flag-icon-css/3.2.1/css/flag-icon.min.css" rel="stylesheet"
type="text/css">
{{ $style := resources.Get "scss/main.scss" | resources.ToCSS | resources.Minify | resources.Fingerprint }} {{ $style := resources.Get "scss/main.scss" | resources.ToCSS | resources.Minify | resources.Fingerprint }}
<link rel="stylesheet" href="{{ $style.Permalink }}"> <link rel="stylesheet" href="{{ $style.Permalink }}">
@ -34,8 +38,10 @@
{{- template "_internal/schema.html" . }} {{- template "_internal/schema.html" . }}
{{- template "_internal/twitter_cards.html" . }} {{- template "_internal/twitter_cards.html" . }}
{{ range .Params.categories }}<meta property="article:section" content="{{ . }}" />{{ end }} {{ range .Params.categories }}
{{ if isset .Params "date" }}<meta property="article:published_time" content="{{ time .Date }}" />{{ end }} <meta property="article:section" content="{{ . }}" />{{ end }}
{{ if isset .Params "date" }}
<meta property="article:published_time" content="{{ time .Date }}" />{{ end }}
<!-- RSS --> <!-- RSS -->
{{ if .RSSLink }} {{ if .RSSLink }}
@ -44,7 +50,8 @@
<!-- JSON Feed --> <!-- JSON Feed -->
{{ if .OutputFormats.Get "json" }} {{ if .OutputFormats.Get "json" }}
<link href="{{ if .OutputFormats.Get "json" }}{{ .Site.BaseURL }}feed.json{{ end }}" rel="alternate" type="application/json" title="{{ .Site.Title }}" /> <link href="{{ if .OutputFormats.Get "json" }}{{ .Site.BaseURL }}feed.json{{ end }}" rel="alternate"
type="application/json" title="{{ .Site.Title }}" />
{{ end }} {{ end }}
<!-- Custom head tags --> <!-- Custom head tags -->