Creepso/p-stream
1
0
Fork 0
mirror of https://github.com/p-stream/p-stream.git synced 2026-04-13 22:40:21 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Update global scrollbar styles to be cleaner

Browse source 
Introduces custom scrollbar styling for a thinner, rounded appearance with smooth color transitions and improved aesthetics. Applies consistent scrollbar styles across browsers and enhances user experience.
This commit is contained in:
Pas 2025-11-07 23:04:33 -07:00
parent f7c1125327
commit 3d23a50a2c
1 changed files with 25 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

32
src/assets/css/index.css
View file

@ -218,20 +218,38 @@ input[type="range"].styled-slider.slider-progress::-ms-fill-lower {
border-right-width: 0;
}
/* Modern thin rounded scrollbar */
* {
scrollbar-width: thin;
scrollbar-color: theme("colors.video.context.border") transparent;
}
::-webkit-scrollbar {
width: 6px;
height: 6px;
}
::-webkit-scrollbar-track {
background-color: transparent;
background: transparent;
border-radius: 10px;
}
::-webkit-scrollbar-thumb {
background-color: theme("colors.video.context.border");
border: 5px solid transparent;
border-left: 0;
background-clip: content-box;
border-radius: 10px;
transition: background-color 0.2s ease;
}
::-webkit-scrollbar {
/* For some reason the styles don't get applied without the width */
width: 13px;
::-webkit-scrollbar-thumb:hover {
background-color: rgba(134, 82, 187, 0.8);
}
::-webkit-scrollbar-thumb:active {
background-color: rgba(134, 82, 187, 1);
}
::-webkit-scrollbar-corner {
background: transparent;
}
.grecaptcha-badge {