dynamic theme color based on accent

nkoexe · Sep 28, 2024 · 9d7257f · 9d7257f
1 parent 413800b
commit 9d7257f
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 3 deletions.
diff --git a/sostituzioni/view/static/scripts/ui.js b/sostituzioni/view/static/scripts/ui.js
@@ -15,6 +15,9 @@ const ui_conferma_elimina_storico_container = document.querySelector("#dialog-co
 const ui_conferma_elimina_storico = document.querySelector("#dialog-conferma-elimina-storico")
 const ui_conferma_elimina_per_reale = document.querySelector("#dialog-conferma-elimina-per-reale")
 
+// set theme color
+document.head.querySelector("meta[name=theme-color]").content = getComputedStyle(document.body).getPropertyValue('--color-accent')
+
 
 // ----------------------------------
 

diff --git a/sostituzioni/view/templates/gestione_impostazioni/base.html b/sostituzioni/view/templates/gestione_impostazioni/base.html
@@ -3,7 +3,7 @@
 
 <head>
   <meta charset="UTF-8" />
-  <meta name="theme-color" content="#C00F19" />
+  <!-- <meta name="theme-color" content="#C00F19" /> -->
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <meta name="view-transition" content="same-origin" />
   <title>{% block title %}{% endblock %}</title>

diff --git a/sostituzioni/view/templates/impostazioni.html b/sostituzioni/view/templates/impostazioni.html
@@ -12,7 +12,7 @@
 
 <head>
   <meta charset="UTF-8" />
-  <meta name="theme-color" content="#C00F19" />
+  <!-- <meta name="theme-color" content="#C00F19" /> -->
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <meta name="view-transition" content="same-origin" />
   <title>Impostazioni</title>

diff --git a/sostituzioni/view/templates/login.html b/sostituzioni/view/templates/login.html
@@ -12,7 +12,7 @@
   <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Gabarito:wght@400..900&display=swap">
   <link rel="stylesheet" href="{{ url_for('static', filename='style/colori.css') }}">
   <link rel="stylesheet" href="{{ url_for('static', filename='style/login.css') }}">
-  <link rel="stylesheet" href="{{ url_for('static', filename='style/theme/'+configurazione.get('colortheme').scelta.lower()+'.css') }}">
+  <link rel="stylesheet" id="colortheme_css" href="{{ url_for('static', filename='style/theme/'~configurazione.get('colortheme')~'.css') }}">
   {% for theme in configurazione.extra_themes %}
   <link rel="stylesheet" href="{{ url_for('static', filename='style/theme/'~theme~'.css') }}">
   {% endfor %}
@@ -57,6 +57,10 @@ <h1 id="title"><span>Scuola</span><span id="title-hidden-s">S</span><svg id="tit
       </div>
     </div>
   </div>
+  <script>
+    // set theme color
+    document.head.querySelector("meta[name=theme-color]").content = getComputedStyle(document.body).getPropertyValue('--color-accent')
+  </script>
 </body>
 
 </html>