init theme toggle

This commit is contained in:
gws 2024-11-08 12:53:41 +01:00
parent 653185b60f
commit e28058040c
3 changed files with 50 additions and 3 deletions

View file

@ -33,9 +33,10 @@
{% endfor %}
{% if lang == "en"%}
<a class="nav-item subtitle-text" href="/sv{{ path }}"><img class="flag" src="/flag-for-sweden-svgrepo-com.svg"></a>
<a class="nav-item subtitle-text" href="/sv{{ path }}"><img alt="swedish" class="flag"
src="/flag-for-sweden-svgrepo-com.svg"></a>
{% else %}
<a class="nav-item subtitle-text" href="{{ path }}"><img class="flag"
<a class="nav-item subtitle-text" href="{{ path }}"><img alt="english" class="flag"
src="/flag-for-united-kingdom-svgrepo-com.svg"></a>
{% endif %}

43
templates/_variables.html Normal file
View file

@ -0,0 +1,43 @@
<style>
:not(.dark) {
/* Primary theme color */
--primary-color: #FED43F;
/* Primary theme text color */
--primary-text-color: #543631;
--primary-text-color-over: #000;
/* Primary theme link color */
--primary-link-color: #F9BB2D;
/* Secondary color: the background body color */
--secondary-color: #fcfaf6;
--secondary-text-color: #303030;
/* Highlight text color of table of content */
--toc-highlight-text-color: #d46e13;
--toc-background-color: white;
--code-color: #4a4a4a;
--code-background-color: white;
--shadow-color: #ddd;
/* Font used for headers (h1 & h2) */
--header-font-family: "Fira Sans", sans-serif;
/* Font used for text */
--text-font-family: "Fira Sans", sans-serif;
}
.dark {
--primary-color: #382929;
--primary-text-color: #d7d7d7;
--primary-text-color-over: #FFF;
--primary-link-color: #9b9b9b;
--secondary-color: #282828;
--secondary-text-color: #f2f2f2;
--toc-highlight-text-color: #f2f2f2;
--toc-background-color: #3a3a3a;
--code-color: white;
--code-background-color: #4a4a4a;
--shadow-color: #202020;
--header-font-family: "Fira Sans", sans-serif;
--text-font-family: "Fira Sans", sans-serif;
}
</style>

View file

@ -26,9 +26,12 @@
<script src="https://unpkg.com/htmx.org@2.0.3"
integrity="sha384-0895/pl2MU10Hqc6jd4RvrthNlDiE9U1tWmX7WRESftEDRosgxNsQG/Ze9YMRzHq" crossorigin="anonymous"></script>
<title>Software, Product Developement and IT consulting</title>
<meta charset="UTF-8">
{% endblock head %}
<body hx-boost="false">
<body hx-boost="false" class="dark">
{% block header %}
<header class="pos-absolute" style="background-color: transparent">