mirror of
https://github.com/rvtr/wiki.git
synced 2025-10-31 06:31:13 -04:00
Add manual theme selector
This commit is contained in:
Pk11
parent
13a5c8f483
commit
519d832852
@ -1,16 +1,28 @@
|
||||
<footer class="bg-dark">
|
||||
<div class="container">
|
||||
<p class="text-light">
|
||||
{{ site.data[page.collection].strings.by | replace: "$1", '<a href="https://github.com/DS-Homebrew/" class="link">DS-Homebrew</a>'}} •
|
||||
<a href="https://ds-homebrew.com/discord" title="{{ site.data[page.collection].strings.discord-server }}" class="clean">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-discord" viewBox="0 0 16 16">
|
||||
<path d="M6.552 6.712c-.456 0-.816.4-.816.888s.368.888.816.888c.456 0 .816-.4.816-.888.008-.488-.36-.888-.816-.888zm2.92 0c-.456 0-.816.4-.816.888s.368.888.816.888c.456 0 .816-.4.816-.888s-.36-.888-.816-.888z"/>
|
||||
<path d="M13.36 0H2.64C1.736 0 1 .736 1 1.648v10.816c0 .912.736 1.648 1.64 1.648h9.072l-.424-1.48 1.024.952.968.896L15 16V1.648C15 .736 14.264 0 13.36 0zm-3.088 10.448s-.288-.344-.528-.648c1.048-.296 1.448-.952 1.448-.952-.328.216-.64.368-.92.472-.4.168-.784.28-1.16.344a5.604 5.604 0 0 1-2.072-.008 6.716 6.716 0 0 1-1.176-.344 4.688 4.688 0 0 1-.584-.272c-.024-.016-.048-.024-.072-.04-.016-.008-.024-.016-.032-.024-.144-.08-.224-.136-.224-.136s.384.64 1.4.944c-.24.304-.536.664-.536.664-1.768-.056-2.44-1.216-2.44-1.216 0-2.576 1.152-4.664 1.152-4.664 1.152-.864 2.248-.84 2.248-.84l.08.096c-1.44.416-2.104 1.048-2.104 1.048s.176-.096.472-.232c.856-.376 1.536-.48 1.816-.504.048-.008.088-.016.136-.016a6.521 6.521 0 0 1 4.024.752s-.632-.6-1.992-1.016l.112-.128s1.096-.024 2.248.84c0 0 1.152 2.088 1.152 4.664 0 0-.68 1.16-2.448 1.216z"/>
|
||||
</svg>
|
||||
</a>
|
||||
<br>
|
||||
|
||||
{{ site.data[page.collection].strings.published-with | replace: "$1", site.repo }}
|
||||
</p>
|
||||
<div class="row mb-3">
|
||||
<div class="col-sm-10">
|
||||
<p class="text-light">
|
||||
{{ site.data[page.collection].strings.by | replace: "$1", '<a href="https://github.com/DS-Homebrew/" class="link">DS-Homebrew</a>'}} •
|
||||
<a href="https://ds-homebrew.com/discord" title="{{ site.data[page.collection].strings.discord-server }}" class="clean">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-discord" viewBox="0 0 16 16">
|
||||
<path d="M6.552 6.712c-.456 0-.816.4-.816.888s.368.888.816.888c.456 0 .816-.4.816-.888.008-.488-.36-.888-.816-.888zm2.92 0c-.456 0-.816.4-.816.888s.368.888.816.888c.456 0 .816-.4.816-.888s-.36-.888-.816-.888z"/>
|
||||
<path d="M13.36 0H2.64C1.736 0 1 .736 1 1.648v10.816c0 .912.736 1.648 1.64 1.648h9.072l-.424-1.48 1.024.952.968.896L15 16V1.648C15 .736 14.264 0 13.36 0zm-3.088 10.448s-.288-.344-.528-.648c1.048-.296 1.448-.952 1.448-.952-.328.216-.64.368-.92.472-.4.168-.784.28-1.16.344a5.604 5.604 0 0 1-2.072-.008 6.716 6.716 0 0 1-1.176-.344 4.688 4.688 0 0 1-.584-.272c-.024-.016-.048-.024-.072-.04-.016-.008-.024-.016-.032-.024-.144-.08-.224-.136-.224-.136s.384.64 1.4.944c-.24.304-.536.664-.536.664-1.768-.056-2.44-1.216-2.44-1.216 0-2.576 1.152-4.664 1.152-4.664 1.152-.864 2.248-.84 2.248-.84l.08.096c-1.44.416-2.104 1.048-2.104 1.048s.176-.096.472-.232c.856-.376 1.536-.48 1.816-.504.048-.008.088-.016.136-.016a6.521 6.521 0 0 1 4.024.752s-.632-.6-1.992-1.016l.112-.128s1.096-.024 2.248.84c0 0 1.152 2.088 1.152 4.664 0 0-.68 1.16-2.448 1.216z"/>
|
||||
</svg>
|
||||
</a>
|
||||
<br>
|
||||
|
||||
{{ site.data[page.collection].strings.published-with | replace: "$1", site.repo }}
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-sm-2">
|
||||
<label for="themeSelector" class="text-light">Color scheme:</label>
|
||||
<select id="themeSelector" class="form-select form-select-dark text-light" onchange="setTheme(value)">
|
||||
<option value="default">Default</option>
|
||||
<option value="dark">Dark</option>
|
||||
<option value="light">Light</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@ -17,6 +17,7 @@
|
||||
{% endif %}
|
||||
|
||||
<link rel="stylesheet" type="text/css" media="screen" href="/assets/css/style.css">
|
||||
<script src="/assets/js/theme.js"></script>
|
||||
|
||||
{% include favicon.html %}
|
||||
{% include seo.html %}
|
||||
|
||||
@ -480,6 +480,12 @@ input:checked+label.btn-outline-secondary:hover, input:checked+label.btn-outline
|
||||
border-color: #565e64;
|
||||
}
|
||||
|
||||
// Select
|
||||
.form-select-dark {
|
||||
background-color: #444;
|
||||
border: 1px solid #333;
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 576px) {
|
||||
// Version of .position-absolute that only triggers for sm+
|
||||
.position-absolute-sm {
|
||||
|
||||
34
assets/js/theme.js
Normal file
34
assets/js/theme.js
Normal file
@ -0,0 +1,34 @@
|
||||
function loadTheme() {
|
||||
if(!localStorage.theme || localStorage.theme == "default") {
|
||||
document.getElementById("themeCSS")?.remove();
|
||||
} else {
|
||||
if(document.getElementById("themeCSS")) {
|
||||
document.getElementById("themeCSS").href = `/assets/css/${localStorage.theme}.css`;
|
||||
} else {
|
||||
let l = document.createElement("link");
|
||||
l.rel = "stylesheet";
|
||||
l.type = "text/css";
|
||||
l.media = "screen";
|
||||
l.href = `/assets/css/${localStorage.theme}.css`
|
||||
l.id = "themeCSS";
|
||||
|
||||
document.head.appendChild(l);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function setTheme(theme) {
|
||||
if(theme == "default")
|
||||
delete localStorage.theme;
|
||||
else
|
||||
localStorage.theme = theme;
|
||||
loadTheme();
|
||||
}
|
||||
|
||||
loadTheme();
|
||||
|
||||
window.onload = () => {
|
||||
if(localStorage.theme)
|
||||
document.getElementById("themeSelector").value = localStorage.theme;
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user