Adding css rules to center card headers and badges vertically;

Removing datatables rules; Only running submit_url updates on the admin page;
elixir-luxembourg · Nov 20, 2023 · 1985fdd · 1985fdd
1 parent 4ba1d22
commit 1985fdd
Show file tree

Hide file tree

Showing 5 changed files with 19 additions and 155 deletions.
diff --git a/notification/static/notification/css/datatables.css b/notification/static/notification/css/datatables.css
diff --git a/notification/static/notification/css/notification.css b/notification/static/notification/css/notification.css
@@ -1,15 +1,20 @@
-.card-badge {
-    position: absolute;
-    right: -25px;
-    bottom: 35%;
-}
-
 #react-notifications {
   .table {
     & td {
       vertical-align: middle;
     }
   }
+
+  .card-title {
+      margin-bottom: 0px;
+  }
+
+  .card-badge {
+      position: absolute;
+      right: -25px;
+      bottom: 35%;
+  }
+
 }
 
 .accordion-toggle {

diff --git a/notification/static/notification/js/datatables.js b/notification/static/notification/js/datatables.js
diff --git a/notification/static/notification/js/notifications.js b/notification/static/notification/js/notifications.js
@@ -2,10 +2,12 @@ $(document).ready(function (){
     const notifFilterForm = $("#admin-notifications-filter")[0];
     const showDismissedSwitch = $("#showDismissedNotifications")[0];
 
-    const baseAction = notifFilterForm.action;
-    const showDismissedParamPrefix = notifFilterForm.action.includes("?") ? "&" : "?";
-    notifFilterForm.action = baseAction + `${showDismissedParamPrefix}show_dismissed=${showDismissedSwitch.checked}`;
-    showDismissedSwitch.addEventListener("click", () => {
+    if (notifFilterForm && showDismissedSwitch) {
+        const baseAction = notifFilterForm.action;
+        const showDismissedParamPrefix = notifFilterForm.action.includes("?") ? "&" : "?";
         notifFilterForm.action = baseAction + `${showDismissedParamPrefix}show_dismissed=${showDismissedSwitch.checked}`;
-    })
+        showDismissedSwitch.addEventListener("click", () => {
+            notifFilterForm.action = baseAction + `${showDismissedParamPrefix}show_dismissed=${showDismissedSwitch.checked}`;
+        })
+    }
 })
diff --git a/web/static/vendor/components/notification/notification_card.tsx b/web/static/vendor/components/notification/notification_card.tsx
@@ -36,7 +36,7 @@ const NotificationHeader = ({className, category, newNotifications, showDismissN
             <div className={"position-relative"}>
                 <h2 className={"card-title"}>{title}</h2>
                 {showDismissNumber && newNotifications > 0 &&
-                    <h5 className={"badge badge-danger card-badge"}>{newNotifications}</h5>
+                    <span className={"badge badge-danger card-badge"}>{newNotifications}</span>
                 }
             </div>
             <div className={"accordion-toggle"}>