64 lines
1.8 KiB
SCSS
64 lines
1.8 KiB
SCSS
@use "@configured-variables" as variables;
|
||
|
||
/* ℹ️ This styles extends the existing layout package's styles for handling cases that aren't related to layouts package */
|
||
|
||
/*
|
||
ℹ️ When we use v-layout as immediate first child of `.page-content-container`, it adds display:flex and page doesn't get contained height
|
||
*/
|
||
// .layout-wrapper.layout-nav-type-vertical {
|
||
// &.layout-content-height-fixed {
|
||
// .page-content-container {
|
||
// > .v-layout:first-child > :not(.v-navigation-drawer):first-child {
|
||
// flex-grow: 1;
|
||
// block-size: 100%;
|
||
// }
|
||
// }
|
||
// }
|
||
// }
|
||
.layout-wrapper.layout-nav-type-vertical {
|
||
&.layout-content-height-fixed {
|
||
.page-content-container {
|
||
> .v-layout:first-child {
|
||
overflow: hidden;
|
||
min-block-size: 100%;
|
||
|
||
> .v-main {
|
||
// overflow-y: auto;
|
||
|
||
.v-main__wrap > :first-child {
|
||
block-size: 100%;
|
||
overflow-y: auto;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
// ℹ️ Let div/v-layout take full height. E.g. Email App
|
||
.layout-wrapper.layout-nav-type-horizontal {
|
||
&.layout-content-height-fixed {
|
||
> .layout-page-content {
|
||
display: flex;
|
||
}
|
||
}
|
||
}
|
||
|
||
// 👉 Floating navbar styles
|
||
@if variables.$vertical-nav-navbar-style == "floating" {
|
||
// ℹ️ Add spacing above navbar if navbar is floating (was in %layout-navbar-sticky placeholder)
|
||
.layout-wrapper.layout-nav-type-vertical.layout-navbar-sticky {
|
||
.layout-navbar {
|
||
inset-block-start: variables.$vertical-nav-floating-navbar-top;
|
||
}
|
||
|
||
/*
|
||
ℹ️ If it's floating navbar
|
||
Add `vertical-nav-floating-navbar-top` as margin top to .layout-page-content
|
||
*/
|
||
.layout-page-content {
|
||
margin-block-start: variables.$vertical-nav-floating-navbar-top;
|
||
}
|
||
}
|
||
}
|