70 lines
2.1 KiB
HTML
70 lines
2.1 KiB
HTML
{% load static %}
|
|
{% load i18n %}
|
|
|
|
|
|
<!--/
|
|
Je suis spécialisé en python, pas en js...
|
|
Don't judge me
|
|
/-->
|
|
|
|
{#<script src="{% static 'javascripts/uikit/uikit.min.js' %}"></script>#}
|
|
{#<script src="{% static 'javascripts/uikit/uikit-icons.min.js' %}"></script>#}
|
|
|
|
<!-- theme -->
|
|
<script>
|
|
window.themeCheckboxes = ["theme", "themeSidebar"];
|
|
|
|
themeCheckboxes.forEach(checkbox => {
|
|
const theme = document.querySelector(`input[name=${checkbox}]`);
|
|
|
|
theme.addEventListener('change', function () {
|
|
applyTheme(theme.checked ? 'dark' : 'light');
|
|
console.log(theme)
|
|
})
|
|
|
|
theme.checked = document.documentElement.getAttribute('data-theme') === 'dark';
|
|
})
|
|
window.applyTheme = function (theme) {
|
|
document.documentElement.setAttribute('data-theme', theme);
|
|
|
|
let cards = document.querySelectorAll(".uk-card.uk-card-default,.uk-card.uk-card-secondary");
|
|
cards.forEach(card => {
|
|
if (theme === 'dark') {
|
|
card.classList.replace("uk-card-default", `uk-card-secondary`)
|
|
} else {
|
|
card.classList.replace("uk-card-secondary", `uk-card-default`)
|
|
}
|
|
})
|
|
|
|
window.sessionStorage.setItem('theme', theme)
|
|
}
|
|
</script>
|
|
|
|
<!-- sidebar -->
|
|
<script>
|
|
offcanvas_nav = document.getElementById("offcanvas-nav");
|
|
trigger = document.querySelector("a.uk-navbar-toggle")
|
|
|
|
trigger.addEventListener("click", e => {
|
|
offcanvas_nav.classList.add("uk-offcanvas", "uk-offcanvas-overlay", "uk-open")
|
|
})
|
|
|
|
offcanvas_nav.querySelector("button.uk-close").addEventListener("click", e => {
|
|
offcanvas_nav.classList.remove("uk-offcanvas-overlay", "uk-open")
|
|
})
|
|
</script>
|
|
|
|
<!-- save theme -->
|
|
<script>
|
|
theme_session = window.sessionStorage.getItem('theme')
|
|
if (theme_session !== null) {
|
|
applyTheme(theme_session);
|
|
|
|
themeCheckboxes.forEach(checkbox => {
|
|
document.querySelector(`input[name=${checkbox}]`).checked = theme_session === 'dark'
|
|
})
|
|
}
|
|
</script>
|
|
|
|
<!-- status page -->
|
|
<script src="https://qgdzfv56ntr8.statuspage.io/embed/script.js"></script>
|