From c50802917ea162b1dfa386d09ba7169a1f148158 Mon Sep 17 00:00:00 2001
From: Jadowyne Ulve <mechserom@gmail.com>
Date: Sat, 9 Aug 2025 17:34:19 -0500
Subject: [PATCH] Implemented darkmode in shopping lists module

---
 .../static/js/shoppingListEditHandler.js          | 15 ---------------
 .../static/js/shoppingListViewHandler.js          | 15 ---------------
 .../static/js/shoppingListsHandler.js             | 15 ---------------
 application/shoppinglists/templates/edit.html     |  8 +++++++-
 application/shoppinglists/templates/lists.html    |  8 +++++++-
 application/shoppinglists/templates/view.html     |  8 +++++++-
 6 files changed, 21 insertions(+), 48 deletions(-)

diff --git a/application/shoppinglists/static/js/shoppingListEditHandler.js b/application/shoppinglists/static/js/shoppingListEditHandler.js
index b390ab8..b1c86dc 100644
--- a/application/shoppinglists/static/js/shoppingListEditHandler.js
+++ b/application/shoppinglists/static/js/shoppingListEditHandler.js
@@ -1,18 +1,3 @@
-var mode = false
-async function toggleDarkMode() {
-    let darkMode = document.getElementById("dark-mode");    
-    darkMode.disabled = !darkMode.disabled;
-    mode = !mode;
-    if(mode){
-        document.getElementById('modeToggle').innerHTML = "light_mode"
-        document.getElementById('main_html').classList.add('uk-light')
-    } else {
-        document.getElementById('modeToggle').innerHTML = "dark_mode"
-        document.getElementById('main_html').classList.remove('uk-light')
-
-    }
-}
-
 document.addEventListener('DOMContentLoaded', async function() {
     let shopping_list = await fetchShoppingList()
     await replenishForm(shopping_list)
diff --git a/application/shoppinglists/static/js/shoppingListViewHandler.js b/application/shoppinglists/static/js/shoppingListViewHandler.js
index b2cf155..d1c33be 100644
--- a/application/shoppinglists/static/js/shoppingListViewHandler.js
+++ b/application/shoppinglists/static/js/shoppingListViewHandler.js
@@ -1,18 +1,3 @@
-var mode = false
-async function toggleDarkMode() {
-    let darkMode = document.getElementById("dark-mode");    
-    darkMode.disabled = !darkMode.disabled;
-    mode = !mode;
-    if(mode){
-        document.getElementById('modeToggle').innerHTML = "light_mode"
-        document.getElementById('main_html').classList.add('uk-light')
-    } else {
-        document.getElementById('modeToggle').innerHTML = "dark_mode"
-        document.getElementById('main_html').classList.remove('uk-light')
-
-    }
-}
-
 document.addEventListener('DOMContentLoaded', async function() {
     let shopping_list = await fetchShoppingList()
     await replenishForm(shopping_list)
diff --git a/application/shoppinglists/static/js/shoppingListsHandler.js b/application/shoppinglists/static/js/shoppingListsHandler.js
index a4e4603..b711a3b 100644
--- a/application/shoppinglists/static/js/shoppingListsHandler.js
+++ b/application/shoppinglists/static/js/shoppingListsHandler.js
@@ -229,18 +229,3 @@ async function setPage(pageNumber){
     await replenishShoppingListCards(lists)
     await updatePaginationElement()
 }
-
-var mode = false
-async function toggleDarkMode() {
-    let darkMode = document.getElementById("dark-mode");    
-    darkMode.disabled = !darkMode.disabled;
-    mode = !mode;
-    if(mode){
-        document.getElementById('modeToggle').innerHTML = "light_mode"
-        document.getElementById('main_html').classList.add('uk-light')
-    } else {
-        document.getElementById('modeToggle').innerHTML = "dark_mode"
-        document.getElementById('main_html').classList.remove('uk-light')
-
-    }
-}
diff --git a/application/shoppinglists/templates/edit.html b/application/shoppinglists/templates/edit.html
index b8662da..ce0cede 100644
--- a/application/shoppinglists/templates/edit.html
+++ b/application/shoppinglists/templates/edit.html
@@ -15,14 +15,20 @@
         <link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp" rel="stylesheet" />
         
         <link rel="stylesheet" href="{{ url_for('static', filename='css/uikit.min.css') }}"/>
-        <link id="dark-mode" rel="stylesheet" href="{{ url_for('static', filename='css/dark-mode.css') }}" disabled/>
+        {% if session['user']['flags']['darkmode'] %}
+        <link id="dark-mode" rel="stylesheet" href="{{ url_for('static', filename='css/dark-mode.css') }}"/>
+        {% endif %}
 
 
         <script src="{{ url_for('static', filename='js/uikit.min.js') }}"></script>
         <script src="{{ url_for('static', filename='js/uikit-icons.min.js') }}"></script>
 
     </head>
+    {% if session['user']['flags']['darkmode'] %}
+    <body class="uk-light">
+    {% else %}
     <body>
+    {% endif %}
         <nav class="uk-navbar-container">
             <div class="uk-container uk-container-expand">
                 <div class="uk-navbar uk-navbar-primary">
diff --git a/application/shoppinglists/templates/lists.html b/application/shoppinglists/templates/lists.html
index bd49499..0f66219 100644
--- a/application/shoppinglists/templates/lists.html
+++ b/application/shoppinglists/templates/lists.html
@@ -15,14 +15,20 @@
         <link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp" rel="stylesheet" />
         
         <link rel="stylesheet" href="{{ url_for('static', filename='css/uikit.min.css') }}"/>
-        <link id="dark-mode" rel="stylesheet" href="{{ url_for('static', filename='css/dark-mode.css') }}" disabled/>
+        {% if session['user']['flags']['darkmode'] %}
+        <link id="dark-mode" rel="stylesheet" href="{{ url_for('static', filename='css/dark-mode.css') }}"/>
+        {% endif %}
 
 
         <script src="{{ url_for('static', filename='js/uikit.min.js') }}"></script>
         <script src="{{ url_for('static', filename='js/uikit-icons.min.js') }}"></script>
 
     </head>
+    {% if session['user']['flags']['darkmode'] %}
+    <body class="uk-light">
+    {% else %}
     <body>
+    {% endif %}
         <nav class="uk-navbar-container">
             <div class="uk-container uk-container-expand">
                 <div class="uk-navbar uk-navbar-primary">
diff --git a/application/shoppinglists/templates/view.html b/application/shoppinglists/templates/view.html
index 723c110..b610437 100644
--- a/application/shoppinglists/templates/view.html
+++ b/application/shoppinglists/templates/view.html
@@ -15,14 +15,20 @@
         <link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp" rel="stylesheet" />
         
         <link rel="stylesheet" href="{{ url_for('static', filename='css/uikit.min.css') }}"/>
-        <link id="dark-mode" rel="stylesheet" href="{{ url_for('static', filename='css/dark-mode.css') }}" disabled/>
+        {% if session['user']['flags']['darkmode'] %}
+        <link id="dark-mode" rel="stylesheet" href="{{ url_for('static', filename='css/dark-mode.css') }}"/>
+        {% endif %}
 
 
         <script src="{{ url_for('static', filename='js/uikit.min.js') }}"></script>
         <script src="{{ url_for('static', filename='js/uikit-icons.min.js') }}"></script>
 
     </head>
+    {% if session['user']['flags']['darkmode'] %}
+    <body class="uk-light">
+    {% else %}
     <body>
+    {% endif %}
         <nav class="uk-navbar-container">
             <div class="uk-container uk-container-expand">
                 <div class="uk-navbar uk-navbar-primary">