Add selector for site theme
This commit is contained in:
parent
f68060aed5
commit
aabd31ff90
|
|
@ -12,6 +12,7 @@ module.exports = {
|
||||||
title: "SuperMinimalCSS",
|
title: "SuperMinimalCSS",
|
||||||
description: "Superminimal Superminimal",
|
description: "Superminimal Superminimal",
|
||||||
lang: "fr",
|
lang: "fr",
|
||||||
|
theme: "auto", // "light", "dark" or "auto"
|
||||||
feed: "feed.xml",
|
feed: "feed.xml",
|
||||||
url: "http://localhost:8080"
|
url: "http://localhost:8080"
|
||||||
}
|
}
|
||||||
|
|
@ -53,9 +53,12 @@
|
||||||
<link rel="icon" href="/images/meta/favicon.ico" sizes="any">
|
<link rel="icon" href="/images/meta/favicon.ico" sizes="any">
|
||||||
<link rel="icon" href="/images/meta/favicon.svg" type="image/svg+xml">
|
<link rel="icon" href="/images/meta/favicon.svg" type="image/svg+xml">
|
||||||
|
|
||||||
|
{% if site.theme == "auto" %}
|
||||||
<meta name="color-scheme" content="light dark">
|
<meta name="color-scheme" content="light dark">
|
||||||
|
|
||||||
<script>{% include "js/theme-toggle.js" %}</script>
|
<script>{% include "js/theme-toggle.js" %}</script>
|
||||||
|
{% else %}
|
||||||
|
<meta name="color-scheme" content={{site.theme}}>
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
{% fetch "https://cdn.jsdelivr.net/npm/theme-toggles@4.10.1/css/around.min.css", "css" %}
|
{% fetch "https://cdn.jsdelivr.net/npm/theme-toggles@4.10.1/css/around.min.css", "css" %}
|
||||||
|
|
|
||||||
|
|
@ -1,3 +1,4 @@
|
||||||
|
{% if site.theme == "auto" %}
|
||||||
<button
|
<button
|
||||||
class="theme-toggle"
|
class="theme-toggle"
|
||||||
type="button"
|
type="button"
|
||||||
|
|
@ -29,3 +30,4 @@
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
</button>
|
</button>
|
||||||
|
{% endif %}
|
||||||
Loading…
Reference in a new issue