Skip to content

Commit 9d52f0d

Browse files
committed
Style scrollbar for supported browsers
1 parent df28c3f commit 9d52f0d

File tree

1 file changed

+21
-3
lines changed

1 file changed

+21
-3
lines changed

assets/css/main.scss

Lines changed: 21 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -9,15 +9,33 @@ $csh-pink: #b0197e;
99

1010

1111
body {
12+
position: relative;
1213
width: 100%;
1314
height: 100%;
1415
padding: 0;
1516
margin: 0;
17+
overflow: overlay; // For transparent scrollbar
18+
background: white;
1619
}
1720

18-
body {
19-
position: relative;
20-
background: white;
21+
/* Scrollbar (only supported by some browsers) */
22+
::-webkit-scrollbar {
23+
width: 12px;
24+
}
25+
26+
::-webkit-scrollbar-track {
27+
background: transparent;
28+
}
29+
30+
::-webkit-scrollbar-thumb {
31+
box-shadow: inset 0px 0px 10px 10px rgba(0,0,0,0.2);
32+
border: 3px solid transparent;
33+
border-radius: 5px;
34+
}
35+
36+
::-webkit-scrollbar-thumb:hover {
37+
box-shadow: inset 0px 0px 10px 10px rgba(0, 0, 0, 0.4);
38+
border: 2px solid transparent;
2139
}
2240

2341
.container.spaced {

0 commit comments

Comments
 (0)