54 lines
1.1 KiB
SCSS
54 lines
1.1 KiB
SCSS
// placeholders
|
||
@use "@configured-variables" as variables;
|
||
|
||
%boxed-content {
|
||
@at-root #{&}-spacing {
|
||
// TODO: Use grid gutter variable here
|
||
padding-inline: 1.5rem;
|
||
}
|
||
|
||
inline-size: 100%;
|
||
margin-inline: auto;
|
||
max-inline-size: variables.$layout-boxed-content-width;
|
||
}
|
||
|
||
%layout-navbar-hidden {
|
||
display: none;
|
||
}
|
||
|
||
// ℹ️ We created this placeholder even it is being used in just layout w/ vertical nav because in future we might apply style to both navbar & horizontal nav separately
|
||
%layout-navbar-sticky {
|
||
position: sticky;
|
||
inset-block-start: 0;
|
||
|
||
// will-change: transform;
|
||
// inline-size: 100%;
|
||
}
|
||
|
||
%style-scroll-bar {
|
||
/* width */
|
||
|
||
&::-webkit-scrollbar {
|
||
background: rgb(var(--v-theme-surface));
|
||
block-size: 8px;
|
||
border-end-end-radius: 14px;
|
||
border-start-end-radius: 14px;
|
||
inline-size: 4px;
|
||
}
|
||
|
||
/* Track */
|
||
&::-webkit-scrollbar-track {
|
||
background: transparent;
|
||
}
|
||
|
||
/* Handle */
|
||
&::-webkit-scrollbar-thumb {
|
||
border-radius: 0.5rem;
|
||
background: rgb(var(--v-theme-perfect-scrollbar-thumb));
|
||
}
|
||
|
||
&::-webkit-scrollbar-corner {
|
||
display: none;
|
||
}
|
||
}
|