preference sidebar fix + badge center alignment

This commit is contained in:
Christopher 2025-05-02 21:08:12 -06:00
parent 3a0d33ca13
commit b354b2ed52
2 changed files with 11 additions and 2 deletions

View file

@ -9,7 +9,7 @@
@for(section of sections; track section.title + section.children.length; let idx = $index;) { @for(section of sections; track section.title + section.children.length; let idx = $index;) {
@if (hasAnyChildren(user, section)) { @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) { @for(item of section.children; track item.fragment) {
@if (accountService.hasAnyRole(user, item.roles, item.restrictRoles)) { @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> <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>

View file

@ -193,10 +193,12 @@
.side-nav { .side-nav {
overflow-x: hidden; overflow-x: hidden;
padding-bottom: 0.625rem; padding-bottom: 0.625rem;
padding-left: 1.125rem;
.side-nav-header { .side-nav-header {
color: #ffffff; color: #ffffff;
font-size: 1rem; font-size: 1rem;
margin-left: unset;
&:first-of-type { &:first-of-type {
margin-top: 0.7rem; margin-top: 0.7rem;
@ -207,7 +209,6 @@
font-size: 1rem; font-size: 1rem;
min-height: 1.875rem; min-height: 1.875rem;
justify-content: unset; justify-content: unset;
margin-left: 1.125rem;
&.active { &.active {
.side-nav-text { .side-nav-text {
@ -220,6 +221,14 @@
margin-left: 0.75rem; margin-left: 0.75rem;
font-size: 0.9rem; font-size: 0.9rem;
color: #999999; color: #999999;
div {
display: flex;
.badge {
align-self: center;
}
}
} }
.card-actions { .card-actions {