ui/sidebar: max-width of section, scroll within sections

This commit is contained in:
Johannes Kirschbauer
2025-09-03 14:31:05 +02:00
parent 04001ff178
commit c370598564
2 changed files with 13 additions and 7 deletions

View File

@@ -1,3 +1,3 @@
.sidebar {
@apply w-60 border-none z-10 h-full flex flex-col;
@apply w-60 border-none z-10 h-full flex flex-col rounded-b-md overflow-hidden;
}

View File

@@ -1,14 +1,15 @@
div.sidebar-body {
@apply py-4 px-2 h-full;
@apply py-4 px-2;
/* full - (y padding) */
height: calc(100% - 2rem);
@apply border border-inv-3 rounded-bl-md rounded-br-md;
/* TODO: This is weird, we shouldn't disable native browser features, a11y impacts incomming */
&::-webkit-scrollbar {
display: none;
}
overflow-y: auto;
scrollbar-width: none;
background:
linear-gradient(0deg, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.1) 100%),
linear-gradient(
@@ -20,13 +21,14 @@ div.sidebar-body {
@apply backdrop-blur-sm;
.accordion {
@apply w-full mb-4;
@apply w-full mb-4 h-full flex flex-col justify-start gap-4;
&:last-child {
@apply mb-0;
}
& > .item {
max-height: 50%;
&:last-child {
@apply mb-0;
}
@@ -58,9 +60,13 @@ div.sidebar-body {
}
& > .content {
@apply overflow-hidden flex flex-col;
@apply flex flex-col;
@apply py-3 px-1.5 bg-inv-4 rounded-md mb-4;
max-height: calc(100% - 24px);
overflow-y: auto;
scrollbar-width: none;
animation: slideAccordionUp 300ms cubic-bezier(0.87, 0, 0.13, 1);
&[data-expanded] {