]> source.dussan.org Git - rspamd.git/commitdiff
projects / rspamd.git / commitdiff
? search:
summary | shortlog | log | commit | commitdiff | tree
raw | patch | inline | side by side (parent: 48583c4)
[WebUI] Prevent navbar layout shift 4927/head
authormoisseev <moiseev@mezonplus.ru>
Sat, 13 Apr 2024 08:15:46 +0000 (11:15 +0300)
committermoisseev <moiseev@mezonplus.ru>
Sat, 13 Apr 2024 08:15:46 +0000 (11:15 +0300)
caused by buttons hiding and scroll bar

interface/css/rspamd.css patch | blob | history
interface/index.html patch | blob | history
interface/js/app/rspamd.js patch | blob | history

diff --git a/interface/css/rspamd.css b/interface/css/rspamd.css
index 4885e6d7f01ce0ae09b88837efa38248c90dff4d..a8ab277b85f59d7340fb7a7ad489fde75e834916 100644 (file)
--- a/interface/css/rspamd.css
+++ b/interface/css/rspamd.css
@@ -136,8 +136,8 @@ textarea {
     height: 50px;
 }
 .btn-group > .btn.radius-right {
-    border-top-right-radius: .25rem !important;
-    border-bottom-right-radius: .25rem !important;
+    border-top-right-radius: var(--bs-btn-border-radius) !important;
+    border-bottom-right-radius: var(--bs-btn-border-radius) !important;
 }
 
 input.form-control[type="number"] {
diff --git a/interface/index.html b/interface/index.html
index 5b3187309181535115d341370ca9af44152229d7..dc1a5eaacd720017bdf935607e4dc71e8720351e 100644 (file)
--- a/interface/index.html
+++ b/interface/index.html
@@ -28,13 +28,13 @@
 </head>
 
 <body>
-
-<nav class="navbar navbar-light bg-light navbar-expand-xl d-none" id="navBar">
+<!-- .vw-100 and .pe-3 prevent navbar layout shift caused by scrollbar -->
+<nav class="navbar navbar-light bg-light navbar-expand-xl vw-100 pe-3 d-none" id="navBar">
        <div class="container-fluid">
                <div class="navbar-header navbar-brand p-0">
                        <img src="./img/rspamd_logo_navbar.png" alt="Rspamd">
                </div>
-               <div class="collapse navbar-collapse order-3 order-xl-2">
+               <div class="collapse navbar-collapse order-3 order-xl-2 flex-grow-0">
                        <form class="my-2 me-auto">
                                <select id="selSrv" class="form-select"></select>
                        </form>
@@ -57,7 +57,7 @@
                <div class="d-flex flex-row order-2 order-xl-4">
                        <form class="ms-auto">
                                <div class="btn-group">
-                                       <button class="btn btn-outline-secondary" id="refresh" style="display: none;"><i class="fas fa-sync-alt"></i> Refresh</button>
+                                       <button class="btn btn-outline-secondary invisible" id="refresh"><i class="fas fa-sync-alt"></i> Refresh</button>
                                        <button class="btn btn-outline-secondary dropdown-toggle dropdown-toggle-split" data-bs-toggle="dropdown" id="autoRefresh" title="Auto-refresh time interval">
                                                <span id="countdown">--:--</span>
                                        </button>
diff --git a/interface/js/app/rspamd.js b/interface/js/app/rspamd.js
index 75743ac0cee4d94133d0ac003c3f0ba8b9ab7241..61b7cf1554c023214c2b83fa7f6cfa687af44f30 100644 (file)
--- a/interface/js/app/rspamd.js
+++ b/interface/js/app/rspamd.js
@@ -92,7 +92,7 @@ define(["jquery", "app/common", "stickytabs", "visibility",
             tab_id = "#" + $(".nav-link.active").attr("id");
         }
 
-        $("#autoRefresh").hide();
+        $("#autoRefresh").addClass("invisible");
         $("#refresh").addClass("radius-right");
 
         function setAutoRefresh(refreshInterval, timer, callback) {
@@ -113,7 +113,7 @@ define(["jquery", "app/common", "stickytabs", "visibility",
             }
 
             $("#refresh").removeClass("radius-right");
-            $("#autoRefresh").show();
+            $("#autoRefresh").removeClass("invisible");
 
             countdown(refreshInterval);
             if (!refreshInterval) return;
@@ -126,9 +126,9 @@ define(["jquery", "app/common", "stickytabs", "visibility",
         }
 
         if (["#scan_nav", "#selectors_nav", "#disconnect"].indexOf(tab_id) !== -1) {
-            $("#refresh").hide();
+            $("#refresh").addClass("invisible");
         } else {
-            $("#refresh").show();
+            $("#refresh").removeClass("invisible");
         }
 
         switch (tab_id) {
Rapid spam filtering system: https://github.com/rspamd/rspamd