From 4d9f9091d5c1056391244ff11a435d749ff62890 Mon Sep 17 00:00:00 2001
From: Giorgio Ravera <giorgio.ravera@gmail.com>
Date: Thu, 6 Aug 2026 12:32:36 +0200
Subject: [PATCH] Removed style inline

---
 backend/settings/config.py |  2 +-
 frontend/aliases.html      |  2 +-
 frontend/css/layout.css    | 13 +++++++++++++
 frontend/devices.html      |  2 +-
 frontend/hosts.html        |  2 +-
 frontend/js/aliases.js     |  9 +++++----
 frontend/js/common.js      |  3 ++-
 frontend/js/devices.js     |  9 +++++----
 frontend/js/hosts.js       |  9 +++++----
 frontend/js/leases.js      |  8 ++++----
 frontend/js/logs.js        |  6 ++++--
 frontend/js/settings.js    |  9 +++++----
 frontend/leases.html       |  2 +-
 frontend/logs.html         |  2 +-
 frontend/modals.html       |  7 +++----
 frontend/settings.html     |  2 +-
 16 files changed, 53 insertions(+), 34 deletions(-)

diff --git a/backend/settings/config.py b/backend/settings/config.py
index 49897ff..303d109 100644
--- a/backend/settings/config.py
+++ b/backend/settings/config.py
@@ -4,7 +4,7 @@
 # APP
 # ---------------------------------------------------------
 APP_NAME = "network-manager"
-APP_VERSION = "0.0.2"
+APP_VERSION = "0.0.3"
 
 # ---------------------------------------------------------
 # Backup System
diff --git a/frontend/aliases.html b/frontend/aliases.html
index 911160e..c694ce3 100644
--- a/frontend/aliases.html
+++ b/frontend/aliases.html
@@ -267,7 +267,7 @@
     </div>
 
     <!-- Loader -->
-    <div id="loader" class="text-center my-3" style="display: none;">
+    <div id="loader" class="text-center my-3 d-none">
         <div class="spinner-border text-primary" role="status">
             <span class="visually-hidden" data-i18n="common.loading">Loading...</span>
         </div>
diff --git a/frontend/css/layout.css b/frontend/css/layout.css
index cb61317..4dcfd4b 100644
--- a/frontend/css/layout.css
+++ b/frontend/css/layout.css
@@ -426,6 +426,19 @@ i.bi {
     cursor: pointer;
 }
 
+.modal-table-scroll {
+    max-height: 250px;
+    overflow-y: auto;
+}
+
+.backup-icon-column {
+    width: 40px;
+}
+
+.backup-actions-column {
+    width: 130px;
+}
+
 /* Sort arrows */
 .sort-arrow {
     display: inline-block;
diff --git a/frontend/devices.html b/frontend/devices.html
index bbe6273..25d1999 100644
--- a/frontend/devices.html
+++ b/frontend/devices.html
@@ -277,7 +277,7 @@
     </div>
 
     <!-- Loader -->
-    <div id="loader" class="text-center my-3" style="display: none;">
+    <div id="loader" class="text-center my-3 d-none">
         <div class="spinner-border text-primary" role="status">
             <span class="visually-hidden" data-i18n="common.loading">Loading...</span>
         </div>
diff --git a/frontend/hosts.html b/frontend/hosts.html
index 7e5696e..1f180a5 100644
--- a/frontend/hosts.html
+++ b/frontend/hosts.html
@@ -272,7 +272,7 @@
     </div>
 
     <!-- Loader -->
-    <div id="loader" class="text-center my-3" style="display: none;">
+    <div id="loader" class="text-center my-3 d-none">
         <div class="spinner-border text-primary" role="status">
             <span class="visually-hidden" data-i18n="common.loading">Loading...</span>
         </div>
diff --git a/frontend/js/aliases.js b/frontend/js/aliases.js
index ee1bcc5..befaa51 100644
--- a/frontend/js/aliases.js
+++ b/frontend/js/aliases.js
@@ -26,7 +26,7 @@ async function fetchAliases () {
 
     try {
         // Show loader
-        loader.style.display = "block";
+        loader.classList.remove("d-none");
 
         // Fetch aliases
         allAliases = await serviceGetAliases();
@@ -41,7 +41,8 @@ async function fetchAliases () {
         tableWrapper.classList.remove("d-none");
     }
     finally {
-        loader.style.display = "none";
+        // Hide loader
+        loader.classList.add("d-none");
     }
 }
 
@@ -72,7 +73,7 @@ function updateTable () {
         trEmpty.appendChild(tdEmpty);
         tbody.appendChild(trEmpty);
         // hide loader and show table
-        loader.style.display = "none";
+        loader.classList.add("d-none");
         tableWrapper.classList.remove("d-none");
         return;
     }
@@ -237,7 +238,7 @@ function updateTable () {
     }
 
     // hide loader and show table
-    loader.style.display = "none";
+    loader.classList.add("d-none");
     tableWrapper.classList.remove("d-none");
 
     // apply current search filter
diff --git a/frontend/js/common.js b/frontend/js/common.js
index 97d5d34..32acb05 100644
--- a/frontend/js/common.js
+++ b/frontend/js/common.js
@@ -396,9 +396,10 @@ export function showConfirmModal(message = "Are you sure?") {
         };
 
         const onConfirm = () => {
+            document.activeElement?.blur();
             cleanUp();
-            resolve(true);
             modal.hide();
+            resolve(true);
         };
 
         const onCancel = () => {
diff --git a/frontend/js/devices.js b/frontend/js/devices.js
index c36c984..1fcd3f7 100644
--- a/frontend/js/devices.js
+++ b/frontend/js/devices.js
@@ -26,7 +26,7 @@ async function fetchDevices () {
 
     try {
         // Show loader
-        loader.style.display = "block";
+        loader.classList.remove("d-none");
 
         // Fetch devices
         allDevices  = await serviceGetDevices();
@@ -41,7 +41,8 @@ async function fetchDevices () {
         tableWrapper.classList.remove("d-none");
     }
     finally {
-        loader.style.display = "none";
+        // Hide loader
+        loader.classList.add("d-none");
     }
 }
 
@@ -72,7 +73,7 @@ function updateTable () {
         trEmpty.appendChild(tdEmpty);
         tbody.appendChild(trEmpty);
         // hide loader and show table
-        loader.style.display = "none";
+        loader.classList.add("d-none");
         tableWrapper.classList.remove("d-none");
         return;
     }
@@ -296,7 +297,7 @@ function updateTable () {
     }
 
     // hide loader and show table
-    loader.style.display = "none";
+    loader.classList.add("d-none");
     tableWrapper.classList.remove("d-none");
 
     // apply current search filter
diff --git a/frontend/js/hosts.js b/frontend/js/hosts.js
index 5dda214..345f372 100644
--- a/frontend/js/hosts.js
+++ b/frontend/js/hosts.js
@@ -26,7 +26,7 @@ async function fetchHosts () {
 
     try {
         // Show loader
-        loader.style.display = "block";
+        loader.classList.remove("d-none");
 
         // Fetch hosts
         allHosts = await serviceGetHosts();
@@ -41,7 +41,8 @@ async function fetchHosts () {
         tableWrapper.classList.remove("d-none");
     }
     finally {
-        loader.style.display = "none";
+        // Hide loader
+        loader.classList.add("d-none");
     }
 }
 
@@ -72,7 +73,7 @@ function updateTable () {
         trEmpty.appendChild(tdEmpty);
         tbody.appendChild(trEmpty);
         // hide loader and show table
-        loader.style.display = "none";
+        loader.classList.add("d-none");
         tableWrapper.classList.remove("d-none");
         return;
     }
@@ -247,7 +248,7 @@ function updateTable () {
     }
 
     // hide loader and show table
-    loader.style.display = "none";
+    loader.classList.add("d-none");
     tableWrapper.classList.remove("d-none");
 
     // apply current search filter
diff --git a/frontend/js/leases.js b/frontend/js/leases.js
index 8d3e5bc..83f5bd6 100644
--- a/frontend/js/leases.js
+++ b/frontend/js/leases.js
@@ -25,7 +25,7 @@ async function fetchLeases () {
 
     try {
         // Show loader
-        loader.style.display = "block";
+        loader.classList.remove("d-none");
 
         // Fetch leases
         allLeases = await serviceGetDHCPLeases();
@@ -40,7 +40,7 @@ async function fetchLeases () {
         tableWrapper.classList.remove("d-none");
     }
     finally {
-        loader.style.display = "none";
+        loader.classList.add("d-none");
     }
 }
 
@@ -71,7 +71,7 @@ function updateTable () {
         trEmpty.appendChild(tdEmpty);
         tbody.appendChild(trEmpty);
         // hide loader and show table
-        loader.style.display = "none";
+        loader.classList.add("d-none");
         tableWrapper.classList.remove("d-none");
         return;
     }
@@ -259,7 +259,7 @@ function updateTable () {
     }
 
     // hide loader and show table
-    loader.style.display = "none";
+    loader.classList.add("d-none");
     tableWrapper.classList.remove("d-none");
 
     // apply current search filter
diff --git a/frontend/js/logs.js b/frontend/js/logs.js
index 0cad8e1..89d2e45 100644
--- a/frontend/js/logs.js
+++ b/frontend/js/logs.js
@@ -131,7 +131,8 @@ async function loadLogs() {
     loading = true;
     const currentRequest = ++requestId;
 
-    loader.style.display = "block";
+    // Show loader
+    loader.classList.remove("d-none");
 
     try {
         const data = await serviceGetLogs(type);
@@ -145,7 +146,8 @@ async function loadLogs() {
     } catch (err) {
         logViewer.textContent = err.message || "Errore loading logs";
     } finally {
-        loader.style.display = "none";
+        // Hide loader
+        loader.classList.add("d-none");
         loading = false;
     }
 }
diff --git a/frontend/js/settings.js b/frontend/js/settings.js
index 0fa8c44..aefb7ed 100644
--- a/frontend/js/settings.js
+++ b/frontend/js/settings.js
@@ -67,7 +67,7 @@ async function fetchConfigs () {
 
     try {
         // Show loader
-        loader.style.display = "block";
+        loader.classList.remove("d-none");
 
         // Fetch configs
         allConfigs = await serviceGetConfigs();
@@ -82,7 +82,8 @@ async function fetchConfigs () {
         tableWrapper.classList.remove("d-none");
     }
     finally {
-        loader.style.display = "none";
+        // Hide loader
+        loader.classList.add("d-none");
     }
 }
 
@@ -256,7 +257,7 @@ function updateTable (filter = null) {
         trEmpty.appendChild(tdEmpty);
         tbody.appendChild(trEmpty);
         // hide loader and show table
-        loader.style.display = "none";
+        loader.classList.add("d-none");
         tableWrapper.classList.remove("d-none");
         return;
     }
@@ -405,7 +406,7 @@ function updateTable (filter = null) {
     tbody.appendChild(frag);
 
     // hide loader and show table
-    loader.style.display = "none";
+    loader.classList.add("d-none");
     tableWrapper.classList.remove("d-none");
 }
 
diff --git a/frontend/leases.html b/frontend/leases.html
index db2b2af..cbaee0b 100644
--- a/frontend/leases.html
+++ b/frontend/leases.html
@@ -277,7 +277,7 @@
     </div>
 
     <!-- Loader -->
-    <div id="loader" class="text-center my-3" style="display: none;">
+    <div id="loader" class="text-center my-3 d-none">
         <div class="spinner-border text-primary" role="status">
             <span class="visually-hidden" data-i18n="common.loading">Loading...</span>
         </div>
diff --git a/frontend/logs.html b/frontend/logs.html
index 83c186b..354fcd3 100644
--- a/frontend/logs.html
+++ b/frontend/logs.html
@@ -283,7 +283,7 @@
     <div id="logViewer" class="log-viewer mobile-scroll mb-0"></div>
 
     <!-- Loader -->
-    <div id="loader" class="text-center my-3" style="display: none;">
+    <div id="loader" class="text-center my-3 d-none">
         <div class="spinner-border text-primary" role="status">
             <span class="visually-hidden" data-i18n="common.loading">Loading...</span>
         </div>
diff --git a/frontend/modals.html b/frontend/modals.html
index 6730470..b1595b7 100644
--- a/frontend/modals.html
+++ b/frontend/modals.html
@@ -180,16 +180,15 @@
         <div class="modal-body">
             <label class="form-label" data-i18n="backup.available">Available backups</label>
 
-            <div class="table-responsive" style="max-height: 250px; overflow-y: auto;">
+            <div class="table-responsive modal-table-scroll">
                 <table class="table table-hover table-sm align-middle">
                     <thead class="table-light sticky-top">
                         <tr>
-                            <th style="width: 40px;"></th>
+                            <th class="backup-icon-column"></th>
                             <th data-i18n="backup.name">Name</th>
                             <th data-i18n="backup.date">Date</th>
                             <th data-i18n="backup.size">Size</th>
-                            <th style="width: 130px;"
-                                class="text-center"
+                            <th class="backup-actions-column text-center"
                                 data-i18n="backup.actions">
                                 Actions
                             </th>
diff --git a/frontend/settings.html b/frontend/settings.html
index 9c6d133..9afbe3a 100644
--- a/frontend/settings.html
+++ b/frontend/settings.html
@@ -330,7 +330,7 @@
     </div>
 
     <!-- Loader -->
-    <div id="loader" class="text-center my-3" style="display: none;">
+    <div id="loader" class="text-center my-3 d-none">
         <div class="spinner-border text-primary" role="status">
             <span class="visually-hidden" data-i18n="common.loading">Loading...</span>
         </div>
-- 
2.47.3