MaysWind
545 lines
18 KiB
CSS
545 lines
18 KiB
CSS
/** Layout class **/
|
|
/** reference: https://github.com/themeselection/materio-vuetify-vuejs-admin-template-free **/
|
|
|
|
html,
|
|
body {
|
|
min-block-size: 100%;
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-section-title,
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-link > :first-child,
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-group > :first-child {
|
|
margin-block: 0;
|
|
margin-inline: 0 1.125rem;
|
|
padding-block: 0;
|
|
padding-inline: 1.375rem 1rem;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-link > :first-child,
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-group > :first-child {
|
|
border-radius: .4rem;
|
|
block-size: 2.75rem;
|
|
margin-block-end: .375rem;
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-link .nav-item-icon,
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-group .nav-item-icon {
|
|
flex-shrink: 0;
|
|
font-size: 1.5rem;
|
|
margin-inline-end: .625rem;
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-group .nav-group .nav-item-icon,
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-group .nav-link .nav-item-icon {
|
|
font-size: .9rem;
|
|
margin-inline-end: .925rem;
|
|
margin-inline-start: .3rem;
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-group .nav-group .nav-link .nav-item-icon,
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-group .nav-group .nav-group .nav-item-icon {
|
|
visibility: hidden;
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-group.active > :first-child:before,
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-group.open > :first-child:before {
|
|
opacity: calc(var(--v-selected-opacity) * var(--v-theme-overlay-multiplier));
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-group.active > :hover:first-child .nav-group.active > :first-child:before,
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-group.open > :hover:first-child .nav-group.active > :first-child:before,
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-group.active > :hover:first-child .nav-group.open > :first-child:before,
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-group.open > :hover:first-child .nav-group.open > :first-child:before {
|
|
opacity: calc(var(--v-selected-opacity) + var(--v-hover-opacity) * var(--v-theme-overlay-multiplier));
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-group.active > :focus-visible:first-child .nav-group.active > :first-child:before,
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-group.open > :focus-visible:first-child .nav-group.active > :first-child:before,
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-group.active > :focus-visible:first-child .nav-group.open > :first-child:before,
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-group.open > :focus-visible:first-child .nav-group.open > :first-child:before {
|
|
opacity: calc(var(--v-selected-opacity) + var(--v-focus-opacity) * var(--v-theme-overlay-multiplier));
|
|
}
|
|
|
|
@supports not selector(:focus-visible) {
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-group.active > :focus:first-child:before,
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-group.open > :focus:first-child:before {
|
|
opacity: calc(var(--v-selected-opacity) + var(--v-focus-opacity) * var(--v-theme-overlay-multiplier));
|
|
}
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-section-title {
|
|
block-size: 1.5rem;
|
|
color: rgba(var(--v-theme-on-surface), var(--v-disabled-opacity));
|
|
font-size: .75rem;
|
|
text-transform: uppercase;
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-item-badge {
|
|
display: inline-block;
|
|
border-radius: 1.5rem;
|
|
font-size: .8em;
|
|
font-weight: 500;
|
|
line-height: 1;
|
|
padding-block: .25em;
|
|
padding-inline: .55em;
|
|
text-align: center;
|
|
vertical-align: baseline;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav {
|
|
color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity));
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-item-title {
|
|
letter-spacing: .15px;
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-section-title {
|
|
letter-spacing: .4px;
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-link > .router-link-exact-active {
|
|
background-color: rgb(var(--v-theme-primary));
|
|
color: rgb(var(--v-theme-on-primary));
|
|
box-shadow: 0 4px 14px -4px var(--v-shadow-key-umbra-opacity), 0 4px 8px -4px var(--v-shadow-key-penumbra-opacity), 0 4px 8px -4px var(--v-shadow-key-ambient-opacity);
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-link a {
|
|
color: inherit;
|
|
}
|
|
|
|
.layout-navbar {
|
|
color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity));
|
|
}
|
|
|
|
html.v-overlay-scroll-blocked:not([style*="--v-body-scroll-y: 0px;"]) .layout-navbar-sticky .navbar-blur.layout-navbar .navbar-content-container,
|
|
.layout-wrapper.layout-nav-type-vertical.window-scrolled.layout-navbar-sticky .navbar-blur.layout-navbar .navbar-content-container {
|
|
-webkit-backdrop-filter: blur(6px);
|
|
backdrop-filter: blur(6px);
|
|
background-color: rgb(var(--v-theme-surface), .9);
|
|
}
|
|
|
|
html.v-overlay-scroll-blocked:not([style*="--v-body-scroll-y: 0px;"]) .layout-navbar-sticky .layout-navbar .navbar-content-container,
|
|
.layout-wrapper.layout-nav-type-vertical.window-scrolled.layout-navbar-sticky .layout-navbar .navbar-content-container {
|
|
background-color: rgb(var(--v-theme-surface));
|
|
}
|
|
|
|
html.v-overlay-scroll-blocked:not([style*="--v-body-scroll-y: 0px;"]) .layout-navbar-sticky .layout-navbar .navbar-content-container,
|
|
.layout-wrapper.layout-nav-type-vertical.window-scrolled.layout-navbar-sticky .layout-navbar .navbar-content-container {
|
|
box-shadow: 0 4px 14px -4px var(--v-shadow-key-umbra-opacity), 0 4px 8px -4px var(--v-shadow-key-penumbra-opacity), 0 4px 8px -4px var(--v-shadow-key-ambient-opacity);
|
|
padding-inline: 1.2rem;
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-link > .router-link-exact-active {
|
|
background: linear-gradient(-72.47deg, rgb(var(--v-theme-primary)) 22.16%, rgba(var(--v-theme-primary), .7) 76.47%) !important;
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-section-title .title-text {
|
|
display: flex;
|
|
flex-wrap: nowrap;
|
|
align-items: center;
|
|
justify-content: flex-start;
|
|
column-gap: .625rem;
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-section-title .title-text:before,
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-section-title .title-text:after {
|
|
border-block-end: 1px solid rgba(var(--v-border-color), var(--v-border-opacity));
|
|
content: "";
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-section-title .title-text:after {
|
|
flex: 1 1 auto;
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-section-title .title-text:before {
|
|
flex: 0 1 .75rem;
|
|
margin-inline-start: -1.375rem;
|
|
}
|
|
|
|
.layout-nav-type-vertical.layout-vertical-nav-collapsed .layout-vertical-nav:not(.hovered) .nav-section-title {
|
|
margin-inline: 4px 0;
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-link > :first-child,
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-group > :first-child {
|
|
block-size: 2.625rem !important;
|
|
border-end-end-radius: 3.125rem !important;
|
|
border-end-start-radius: 0 !important;
|
|
border-start-end-radius: 3.125rem !important;
|
|
border-start-start-radius: 0 !important;
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-link > :first-child,
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-group > :first-child {
|
|
transition: margin-inline .15s ease-in-out;
|
|
will-change: margin-inline;
|
|
}
|
|
|
|
.layout-nav-type-vertical.layout-vertical-nav-collapsed .layout-vertical-nav:not(.hovered) .nav-link > :first-child,
|
|
.layout-nav-type-vertical.layout-vertical-nav-collapsed .layout-vertical-nav:not(.hovered) .nav-group > :first-child {
|
|
margin-inline: 0 5px;
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav {
|
|
background-color: rgb(var(--v-theme-background));
|
|
}
|
|
|
|
.layout-vertical-nav-collapsed.layout-nav-type-vertical .layout-vertical-nav.hovered {
|
|
box-shadow: 0 4px 5px -2px var(--v-shadow-key-umbra-opacity), 0 2px 10px 1px var(--v-shadow-key-penumbra-opacity), 0 2px 16px 1px var(--v-shadow-key-ambient-opacity);
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-header {
|
|
overflow: hidden;
|
|
padding: 1rem .25rem 1rem 1.375rem;
|
|
margin-inline: 0 1.125rem;
|
|
min-block-size: 64px;
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-header .app-logo {
|
|
flex-shrink: 0;
|
|
transition: transform .25s ease-in-out;
|
|
}
|
|
|
|
.layout-vertical-nav-collapsed.layout-nav-type-vertical .layout-vertical-nav:not(.hovered) .nav-header .app-logo {
|
|
transform: translate(-4px);
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-header .app-title {
|
|
margin-inline-start: .9rem;
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .vertical-nav-items-shadow {
|
|
position: absolute;
|
|
z-index: 1;
|
|
background: linear-gradient(rgb(var(--v-theme-background)) 5%, rgba(var(--v-theme-background), 75%) 45%, rgba(var(--v-theme-background), 20%) 80%, transparent);
|
|
block-size: 55px;
|
|
inline-size: 100%;
|
|
inset-block-start: 62px;
|
|
opacity: 0;
|
|
pointer-events: none;
|
|
transition: opacity .15s ease-in-out;
|
|
will-change: opacity;
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav.scrolled .vertical-nav-items-shadow {
|
|
opacity: 1;
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .ps__rail-y {
|
|
z-index: 1;
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-section-title {
|
|
margin-block-end: .5rem;
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-section-title:not(:first-child) {
|
|
margin-block-start: 1.5rem;
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-section-title .placeholder-icon {
|
|
margin-inline: auto;
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-link,
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-group {
|
|
overflow: hidden;
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-link.disabled,
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-group.disabled {
|
|
opacity: var(--v-disabled-opacity);
|
|
pointer-events: none;
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-link > a {
|
|
position: relative;
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-link > a:before {
|
|
position: absolute;
|
|
border-radius: inherit;
|
|
background: currentcolor;
|
|
block-size: 100%;
|
|
content: "";
|
|
inline-size: 100%;
|
|
inset: 0;
|
|
opacity: 0;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-link > a:hover:before {
|
|
opacity: calc(var(--v-hover-opacity) * var(--v-theme-overlay-multiplier));
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-link > a:focus-visible:before {
|
|
opacity: calc(var(--v-focus-opacity) * var(--v-theme-overlay-multiplier));
|
|
}
|
|
|
|
@supports not selector(:focus-visible) {
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-link > a:focus:before {
|
|
opacity: calc(var(--v-focus-opacity) * var(--v-theme-overlay-multiplier));
|
|
}
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-group .nav-group-arrow {
|
|
flex-shrink: 0;
|
|
transform-origin: center;
|
|
transition: transform .15s ease-in-out;
|
|
will-change: transform;
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-group.open > .nav-group-label .nav-group-arrow {
|
|
transform: rotate(90deg);
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-group > :first-child {
|
|
position: relative;
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-group > :first-child:before {
|
|
position: absolute;
|
|
border-radius: inherit;
|
|
background: currentcolor;
|
|
block-size: 100%;
|
|
content: "";
|
|
inline-size: 100%;
|
|
inset: 0;
|
|
opacity: 0;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-group > :first-child:hover:before {
|
|
opacity: calc(var(--v-hover-opacity) * var(--v-theme-overlay-multiplier));
|
|
}
|
|
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-group > :first-child:focus-visible:before {
|
|
opacity: calc(var(--v-focus-opacity) * var(--v-theme-overlay-multiplier));
|
|
}
|
|
|
|
@supports not selector(:focus-visible) {
|
|
.layout-nav-type-vertical .layout-vertical-nav .nav-group > :first-child:focus:before {
|
|
opacity: calc(var(--v-focus-opacity) * var(--v-theme-overlay-multiplier));
|
|
}
|
|
}
|
|
|
|
.vertical-nav-section-title-enter-active,
|
|
.vertical-nav-section-title-leave-active {
|
|
transition: opacity .1s ease-in-out, transform .1s ease-in-out;
|
|
}
|
|
|
|
.vertical-nav-section-title-enter-from,
|
|
.vertical-nav-section-title-leave-to {
|
|
opacity: 0;
|
|
transform: translate(15px);
|
|
}
|
|
|
|
.transition-slide-x-enter-active,
|
|
.transition-slide-x-leave-active {
|
|
transition: opacity .1s ease-in-out, transform .12s ease-in-out;
|
|
}
|
|
|
|
.transition-slide-x-enter-from,
|
|
.transition-slide-x-leave-to {
|
|
opacity: 0;
|
|
transform: translate(-15px);
|
|
}
|
|
|
|
.vertical-nav-app-title-enter-active,
|
|
.vertical-nav-app-title-leave-active {
|
|
transition: opacity .1s ease-in-out, transform .12s ease-in-out;
|
|
}
|
|
|
|
.vertical-nav-app-title-enter-from,
|
|
.vertical-nav-app-title-leave-to {
|
|
opacity: 0;
|
|
transform: translate(-15px);
|
|
}
|
|
|
|
.layout-vertical-nav ol, .layout-vertical-nav ul,
|
|
.layout-horizontal-nav ol, .layout-horizontal-nav ul {
|
|
list-style: none;
|
|
}
|
|
|
|
.scrollable-content.v-navigation-drawer .v-navigation-drawer__content {
|
|
display: flex;
|
|
overflow: hidden;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.layout-wrapper.layout-nav-type-vertical .layout-navbar .navbar-content-container {
|
|
transition: padding .2s ease, background-color .18s ease;
|
|
}
|
|
|
|
.layout-wrapper.layout-nav-type-vertical .layout-navbar .navbar-content-container {
|
|
border-radius: 0 0 10px 10px;
|
|
}
|
|
|
|
.layout-wrapper.layout-nav-type-vertical .layout-footer .footer-content-container {
|
|
border-radius: 10px 10px 0 0;
|
|
}
|
|
|
|
.layout-footer-sticky.layout-wrapper.layout-nav-type-vertical .layout-footer .footer-content-container {
|
|
background-color: rgb(var(--v-theme-surface));
|
|
padding-block: 0;
|
|
padding-inline: 1.2rem;
|
|
box-shadow: 0 4px 14px -4px var(--v-shadow-key-umbra-opacity), 0 4px 8px -4px var(--v-shadow-key-penumbra-opacity), 0 4px 8px -4px var(--v-shadow-key-ambient-opacity);
|
|
}
|
|
|
|
.layout-wrapper.layout-nav-type-vertical.layout-content-height-fixed .page-content-container > .v-layout:first-child {
|
|
overflow: hidden;
|
|
min-block-size: 100%;
|
|
}
|
|
|
|
.layout-wrapper.layout-nav-type-vertical.layout-content-height-fixed .page-content-container > .v-layout:first-child > .v-main .v-main__wrap > :first-child {
|
|
block-size: 100%;
|
|
overflow-y: auto;
|
|
}
|
|
|
|
.layout-wrapper.layout-nav-type-horizontal.layout-content-height-fixed > .layout-page-content {
|
|
display: flex;
|
|
}
|
|
|
|
.layout-vertical-nav {
|
|
position: fixed;
|
|
z-index: 1004;
|
|
display: flex;
|
|
flex-direction: column;
|
|
block-size: 100%;
|
|
inline-size: 260px;
|
|
inset-block-start: 0;
|
|
inset-inline-start: 0;
|
|
transition: transform .25s ease-in-out, inline-size .25s ease-in-out, box-shadow .25s ease-in-out;
|
|
will-change: transform, inline-size;
|
|
}
|
|
|
|
.layout-vertical-nav .nav-header {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.layout-vertical-nav .app-title-wrapper {
|
|
margin-inline-end: auto;
|
|
}
|
|
|
|
.layout-vertical-nav .nav-items {
|
|
block-size: 100%;
|
|
}
|
|
|
|
.layout-vertical-nav .nav-item-title {
|
|
overflow: hidden;
|
|
margin-inline-end: auto;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.layout-vertical-nav-collapsed .layout-vertical-nav:not(.hovered) {
|
|
inline-size: 68px
|
|
}
|
|
|
|
.layout-vertical-nav.overlay-nav:not(.visible) {
|
|
transform: translate(-260px);
|
|
}
|
|
|
|
.layout-content-width-boxed.layout-wrapper.layout-nav-type-vertical .layout-navbar {
|
|
inline-size: 100%;
|
|
margin-inline: auto;
|
|
max-inline-size: 1440px;
|
|
}
|
|
|
|
.layout-wrapper.layout-nav-type-vertical .layout-navbar {
|
|
padding-inline: 1.5rem;
|
|
}
|
|
|
|
.layout-wrapper.layout-nav-type-vertical.layout-navbar-hidden .layout-navbar {
|
|
display: none;
|
|
}
|
|
|
|
.layout-wrapper.layout-nav-type-vertical.layout-navbar-sticky .layout-navbar {
|
|
position: sticky;
|
|
inset-block-start: 0;
|
|
}
|
|
|
|
.layout-wrapper.layout-nav-type-vertical {
|
|
block-size: 100%;
|
|
}
|
|
|
|
.layout-wrapper.layout-nav-type-vertical .layout-content-wrapper {
|
|
display: flex;
|
|
flex-direction: column;
|
|
flex-grow: 1;
|
|
min-block-size: calc(var(--vh, 1vh) * 100);
|
|
transition: padding-inline-start .2s ease-in-out;
|
|
will-change: padding-inline-start;
|
|
}
|
|
|
|
.layout-wrapper.layout-nav-type-vertical .layout-navbar {
|
|
z-index: 11;
|
|
}
|
|
|
|
.layout-wrapper.layout-nav-type-vertical .layout-navbar .navbar-content-container {
|
|
block-size: 64px;
|
|
}
|
|
|
|
.layout-wrapper.layout-nav-type-vertical .layout-overlay {
|
|
position: fixed;
|
|
z-index: 1003;
|
|
background-color: #0009;
|
|
cursor: pointer;
|
|
inset: 0;
|
|
opacity: 0;
|
|
pointer-events: none;
|
|
transition: opacity .25s ease-in-out;
|
|
will-change: transform;
|
|
}
|
|
|
|
.layout-wrapper.layout-nav-type-vertical .layout-overlay.visible {
|
|
opacity: 1;
|
|
pointer-events: auto;
|
|
}
|
|
|
|
.layout-wrapper.layout-nav-type-vertical:not(.layout-overlay-nav) .layout-content-wrapper {
|
|
padding-inline-start: 260px;
|
|
}
|
|
|
|
.layout-wrapper.layout-nav-type-vertical.layout-vertical-nav-collapsed .layout-content-wrapper {
|
|
padding-inline-start: 68px;
|
|
}
|
|
|
|
.layout-wrapper.layout-nav-type-vertical.layout-content-height-fixed .layout-content-wrapper {
|
|
max-block-size: calc(var(--vh) * 100);
|
|
}
|
|
|
|
.layout-wrapper.layout-nav-type-vertical.layout-content-height-fixed .layout-page-content {
|
|
display: flex;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.layout-wrapper.layout-nav-type-vertical.layout-content-height-fixed .layout-page-content .page-content-container {
|
|
inline-size: 100%;
|
|
}
|
|
|
|
.layout-wrapper.layout-nav-type-vertical.layout-content-height-fixed .layout-page-content .page-content-container > :first-child {
|
|
max-block-size: 100%;
|
|
overflow-y: auto;
|
|
}
|
|
|
|
.layout-vertical-nav .nav-link a {
|
|
display: flex;
|
|
align-items: center;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.layout-page-content {
|
|
flex-grow: 1;
|
|
padding-block: 1.5rem;
|
|
}
|
|
|
|
.layout-page-content {
|
|
padding-inline: 1.5rem;
|
|
}
|
|
|