mirror of
https://github.com/wavetermdev/waveterm
synced 2026-05-05 22:48:48 +00:00
Make terminal block scrollbar thumb slightly wider, closer to edge (#1007)
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:
parent
a109ccfec8
commit
e92b388260
1 changed files with 17 additions and 6 deletions
|
|
@ -118,24 +118,35 @@
|
|||
}
|
||||
|
||||
.terminal {
|
||||
*::-webkit-scrollbar {
|
||||
width: 4px;
|
||||
height: 4px;
|
||||
.xterm-viewport {
|
||||
right: -7px;
|
||||
}
|
||||
.xterm-viewport::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
}
|
||||
|
||||
*::-webkit-scrollbar-track {
|
||||
.xterm-viewport::-webkit-scrollbar-track {
|
||||
background-color: var(--scrollbar-background-color);
|
||||
}
|
||||
|
||||
*::-webkit-scrollbar-thumb {
|
||||
.xterm-viewport::-webkit-scrollbar-thumb {
|
||||
display: none;
|
||||
background-color: var(--scrollbar-thumb-color);
|
||||
border-radius: 4px;
|
||||
margin: 0 1px 0 1px;
|
||||
|
||||
&:hover {
|
||||
background-color: var(--scrollbar-thumb-hover-color);
|
||||
}
|
||||
|
||||
&:active {
|
||||
background-color: var(--scrollbar-thumb-active-color);
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
*::-webkit-scrollbar-thumb {
|
||||
.xterm-viewport::-webkit-scrollbar-thumb {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue