Upstream/waveterm
1
0
Fork 0
mirror of https://github.com/wavetermdev/waveterm.git synced 2025-01-21 21:32:13 +01:00
Code Issues Packages Projects Releases Wiki Activity

Make terminal block scrollbar thumb slightly wider, closer to edge (#1007)

Browse Source 
I can't push the scrollbar all the way to the edge because XTerm.js is
doing some fancy calculations for their viewport width and when I try to
mess with the CSS too much everything breaks, but I was able to get the
scrollbar thumb to be slightly wider and slightly closer to the edge
without everything falling apart
This commit is contained in:
Evan Simkowitz 2024-10-10 17:02:58 -04:00 committed by GitHub
parent a109ccfec8
commit e92b388260
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 17 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
frontend/app/view/term/term.less
View File

@ -118,24 +118,35 @@
} }
.terminal { .terminal {
*::-webkit-scrollbar { .xterm-viewport {
width: 4px; right: -7px;
height: 4px; }
.xterm-viewport::-webkit-scrollbar {
width: 6px;
height: 6px;
} }
*::-webkit-scrollbar-track { .xterm-viewport::-webkit-scrollbar-track {
background-color: var(--scrollbar-background-color); background-color: var(--scrollbar-background-color);
} }
*::-webkit-scrollbar-thumb { .xterm-viewport::-webkit-scrollbar-thumb {
display: none; display: none;
background-color: var(--scrollbar-thumb-color); background-color: var(--scrollbar-thumb-color);
border-radius: 4px; border-radius: 4px;
margin: 0 1px 0 1px; margin: 0 1px 0 1px;
&:hover {
background-color: var(--scrollbar-thumb-hover-color);
}
&:active {
background-color: var(--scrollbar-thumb-active-color);
}
} }
&:hover { &:hover {
*::-webkit-scrollbar-thumb { .xterm-viewport::-webkit-scrollbar-thumb {
display: block; display: block;
} }
} }