bert.hausmans/crewli
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: impersonation banner still overlapping navbar

Browse Source 
The previous :deep() overrides had equal specificity to Vuexy's
unscoped styles in VerticalNavLayout.vue. Since child component
styles are injected after parent styles, Vuexy's inset-block-start: 0
won by source order. Add !important and simplify the navbar selector
to target .layout-navbar directly.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
bert.hausmans
2026-04-16 03:14:01 +02:00
parent 89645eab60
commit dc886fed46
1 changed files with 10 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
apps/app/src/layouts/components/DefaultLayoutWithVerticalNav.vue
View File

@@ -101,13 +101,18 @@ import { VerticalNavLayout } from '@layouts'
</template>
<style scoped>
/* Push sidebar, navbar, and content below the fixed 48px impersonation banner */
/*
* Push sidebar, navbar, and content below the fixed 48px impersonation banner.
* !important is needed because VerticalNavLayout's unscoped styles are injected
* after this component's scoped styles (child renders after parent), so equal-
* specificity rules from Vuexy win without it.
*/
.impersonation-active :deep(.layout-vertical-nav) {
inset-block-start: 48px;
block-size: calc(100% - 48px);
inset-block-start: 48px !important;
block-size: calc(100% - 48px) !important;
}
.impersonation-active :deep(.layout-navbar-sticky .layout-navbar) {
inset-block-start: 48px;
.impersonation-active :deep(.layout-navbar) {
inset-block-start: 48px !important;
}
</style>