mirror of https://github.com/portainer/portainer
65 lines
1.5 KiB
CSS
65 lines
1.5 KiB
CSS
:global(#page-wrapper) {
|
|
padding-left: var(--sidebar-closed-width);
|
|
transition: all 0.4s ease 0s;
|
|
}
|
|
|
|
@media only screen and (min-width: 561px) {
|
|
:global(#page-wrapper.open) {
|
|
padding-left: var(--sidebar-width);
|
|
}
|
|
}
|
|
@media only screen and (max-width: 560px) {
|
|
:global(#page-wrapper.open) {
|
|
padding-left: var(--sidebar-closed-width);
|
|
}
|
|
}
|
|
|
|
:global(#page-wrapper) {
|
|
--sidebar-width: 300px;
|
|
/* 32px for collapsed items + 20px padding on each side */
|
|
--sidebar-closed-width: 72px;
|
|
}
|
|
|
|
:global(#page-wrapper.open) .root {
|
|
width: var(--sidebar-width);
|
|
}
|
|
|
|
.root {
|
|
width: var(--sidebar-closed-width);
|
|
height: 100%;
|
|
|
|
position: fixed;
|
|
left: 0;
|
|
|
|
z-index: 10;
|
|
transition: all 0.4s ease 0s;
|
|
}
|
|
|
|
.nav {
|
|
background-color: var(--bg-sidebar-color);
|
|
}
|
|
|
|
.root ul {
|
|
top: 0;
|
|
bottom: 0;
|
|
padding: 0;
|
|
margin: 0;
|
|
list-style: none;
|
|
}
|
|
|
|
/* make the scrollbar track background transparent */
|
|
.nav-list-container::-webkit-scrollbar {
|
|
@apply !w-4 !h-4 bg-transparent;
|
|
}
|
|
|
|
.nav-list-container::-webkit-scrollbar-thumb {
|
|
@apply !bg-gray-3/40 hover:!bg-gray-3/50 th-dark:!bg-gray-3/40 th-dark:hover:!bg-gray-3/50 !rounded-full;
|
|
/* adding this border gives some gap between the right edge of the box and the scrollbar thumb for webkit browsers,
|
|
while giving right no right gap from the scrollbar to the box edge for non-webkit browsers (firefox) */
|
|
@apply !border-4 !border-solid !border-transparent bg-clip-content;
|
|
}
|
|
|
|
.nav-list-container::-webkit-scrollbar-track {
|
|
@apply !bg-transparent;
|
|
}
|