mirror of
https://github.com/Ellpeck/TinyLifeWeb.git
synced 2024-11-22 11:23:29 +01:00
script cleanup
This commit is contained in:
parent
953cfc4cc0
commit
9fc989d9a6
3 changed files with 18 additions and 15 deletions
|
@ -17,6 +17,10 @@
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
<div class="collapse navbar-collapse" id="navbar-content">
|
<div class="collapse navbar-collapse" id="navbar-content">
|
||||||
|
<script>
|
||||||
|
$(".navbar-collapse a").on("click", () => $(".navbar-collapse").collapse("hide"));
|
||||||
|
</script>
|
||||||
|
|
||||||
<div class="navbar-nav mr-auto" id="nav-items">
|
<div class="navbar-nav mr-auto" id="nav-items">
|
||||||
{% if page.nav %}
|
{% if page.nav %}
|
||||||
{% include {{ page.nav }} %}
|
{% include {{ page.nav }} %}
|
||||||
|
@ -28,6 +32,15 @@
|
||||||
<span class="navbar-text custom-control custom-checkbox">
|
<span class="navbar-text custom-control custom-checkbox">
|
||||||
<input type="checkbox" class="custom-control-input" id="dark-mode">
|
<input type="checkbox" class="custom-control-input" id="dark-mode">
|
||||||
<label class="custom-control-label" for="dark-mode">🌙 Dark</label>
|
<label class="custom-control-label" for="dark-mode">🌙 Dark</label>
|
||||||
|
<script>
|
||||||
|
let mode = $("#dark-mode");
|
||||||
|
mode.prop("checked", darkTheme);
|
||||||
|
mode.on("click", function () {
|
||||||
|
localStorage.setItem("dark", $(this).prop("checked"));
|
||||||
|
location.hash = "";
|
||||||
|
location.reload();
|
||||||
|
});
|
||||||
|
</script>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -29,7 +29,11 @@
|
||||||
|
|
||||||
<script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"></script>
|
||||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/js/bootstrap.bundle.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/js/bootstrap.bundle.min.js"></script>
|
||||||
<script src="/main.js"></script>
|
|
||||||
|
<script>
|
||||||
|
const darkStorage = localStorage.getItem("dark");
|
||||||
|
const darkTheme = darkStorage === null ? window.matchMedia("(prefers-color-scheme: dark)").matches : darkStorage === "true";
|
||||||
|
</script>
|
||||||
|
|
||||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/css/bootstrap.min.css">
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/css/bootstrap.min.css">
|
||||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lato&display=swap">
|
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lato&display=swap">
|
||||||
|
|
14
web/main.js
14
web/main.js
|
@ -1,14 +0,0 @@
|
||||||
const darkStorage = localStorage.getItem("dark");
|
|
||||||
const darkTheme = darkStorage === null ? window.matchMedia("(prefers-color-scheme: dark)").matches : darkStorage === "true";
|
|
||||||
|
|
||||||
$(function () {
|
|
||||||
$(".navbar-collapse a").on("click", () => $(".navbar-collapse").collapse("hide"));
|
|
||||||
|
|
||||||
let mode = $("#dark-mode");
|
|
||||||
mode.prop("checked", darkTheme);
|
|
||||||
mode.on("click", function () {
|
|
||||||
localStorage.setItem("dark", $(this).prop("checked"));
|
|
||||||
location.hash = "";
|
|
||||||
location.reload();
|
|
||||||
});
|
|
||||||
});
|
|
Loading…
Reference in a new issue