From b354b2ed528830ff9f86bf031ea6d422e2345d39 Mon Sep 17 00:00:00 2001
From: Christopher <39032787+MrRobotjs@users.noreply.github.com>
Date: Fri, 2 May 2025 21:08:12 -0600
Subject: [PATCH] preference sidebar fix + badge center alignment

---
 .../preference-nav/preference-nav.component.html      |  2 +-
 UI/Web/src/theme/components/_sidenav.scss             | 11 ++++++++++-
 2 files changed, 11 insertions(+), 2 deletions(-)

diff --git a/UI/Web/src/app/sidenav/preference-nav/preference-nav.component.html b/UI/Web/src/app/sidenav/preference-nav/preference-nav.component.html
index 5e4f9b2cd..b8c1ec8af 100644
--- a/UI/Web/src/app/sidenav/preference-nav/preference-nav.component.html
+++ b/UI/Web/src/app/sidenav/preference-nav/preference-nav.component.html
@@ -9,7 +9,7 @@
 
           @for(section of sections; track section.title + section.children.length; let idx = $index;) {
             @if (hasAnyChildren(user, section)) {
-              <h5 class="side-nav-header mb-2 ms-3" [ngClass]="{'mt-4': idx > 0}">{{t(section.title)}}</h5>
+              <h5 class="side-nav-header mb-2" [ngClass]="{'mt-4': idx > 0}">{{t(section.title)}}</h5>
               @for(item of section.children; track item.fragment) {
                 @if (accountService.hasAnyRole(user, item.roles, item.restrictRoles)) {
                   <app-side-nav-item [id]="'nav-item-' + item.fragment" [noIcon]="true" link="/settings" [fragment]="item.fragment" [title]="item.fragment | settingFragment" [badgeCount]="item.badgeCount$ | async"></app-side-nav-item>
diff --git a/UI/Web/src/theme/components/_sidenav.scss b/UI/Web/src/theme/components/_sidenav.scss
index c724cec17..31a205edd 100644
--- a/UI/Web/src/theme/components/_sidenav.scss
+++ b/UI/Web/src/theme/components/_sidenav.scss
@@ -193,10 +193,12 @@
     .side-nav {
       overflow-x: hidden;
       padding-bottom: 0.625rem;
+      padding-left: 1.125rem;
 
       .side-nav-header {
         color: #ffffff;
         font-size: 1rem;
+        margin-left: unset;
 
         &:first-of-type {
           margin-top: 0.7rem;
@@ -207,7 +209,6 @@
         font-size: 1rem;
         min-height: 1.875rem;
         justify-content: unset;
-        margin-left: 1.125rem;
 
         &.active {
           .side-nav-text {
@@ -220,6 +221,14 @@
           margin-left: 0.75rem;
           font-size: 0.9rem;
           color: #999999;
+          
+          div {
+            display: flex;
+            
+            .badge {
+              align-self: center;
+            }
+          }
         }
 
         .card-actions {