Updated scrollbar styles.

This commit is contained in:
Mike Cao 2023-04-01 20:40:01 -07:00
parent 8397102bac
commit 2411aeae8d
3 changed files with 15 additions and 24 deletions

View File

@ -19,7 +19,3 @@
height: calc(100vh - 60px);
overflow-y: auto;
}
.body::-webkit-scrollbar-track {
border: 0;
}

View File

@ -6,7 +6,7 @@ export default function ShareLayout({ children }) {
return (
<Container>
<Header />
{children}
<main>{children}</main>
<Footer />
</Container>
);

View File

@ -62,34 +62,29 @@ svg {
}
::-webkit-scrollbar {
width: 16px;
height: 16px;
background: transparent;
width: 15px;
background: var(--base50);
}
::-webkit-scrollbar-track {
background: transparent;
border-right: 2px solid var(--base200);
border: 7px solid rgba(0, 0, 0, 0);
background-color: var(--base300);
background-clip: padding-box;
}
::-webkit-scrollbar-track:hover {
border-right: 2px solid var(--base300);
body::-webkit-scrollbar-track,
main::-webkit-scrollbar-track {
background-color: var(--base50);
}
::-webkit-scrollbar-thumb {
position: relative;
border-right: 2px solid var(--base600);
border: 7px solid rgba(0, 0, 0, 0);
background-color: var(--base600);
background-clip: padding-box;
}
::-webkit-scrollbar-thumb:hover {
border-right: 8px solid var(--base700);
}
::-webkit-scrollbar-thumb:horizontal {
position: relative;
border-bottom: 2px solid var(--base600);
}
::-webkit-scrollbar-thumb:horizontal:hover {
border-bottom: 8px solid var(--base700);
border: 4px solid rgba(0, 0, 0, 0);
background-color: var(--base800);
background-clip: padding-box;
}