117 lines
6.1 KiB
CSS
117 lines
6.1 KiB
CSS
html{
|
|
overflow: scroll;
|
|
scrollbar-track-color: #eee;
|
|
scrollbar-face-color: #f7f7f7;
|
|
scrollbar-highlight-color: #eee;
|
|
scrollbar-darkshadow-color: #cbcbcb;
|
|
scrollbar-arrow-color: #adadad;
|
|
scrollbar-color: #f7f7f7 #eee;
|
|
}
|
|
|
|
::-webkit-scrollbar {
|
|
height: 14px;
|
|
width: 14px;
|
|
background: #eee;
|
|
}
|
|
|
|
::-webkit-scrollbar-corner {
|
|
background: #eee;
|
|
}
|
|
|
|
/* thimb*/
|
|
::-webkit-scrollbar-thumb {
|
|
box-shadow: inset 0px 0px 0px 1px #cbcbcb;
|
|
background: #f7f7f7;
|
|
-webkit-border-radius: 0.1ex;
|
|
border: #eee 1px solid;
|
|
background-position: center;
|
|
background-repeat: no-repeat;
|
|
}
|
|
::-webkit-scrollbar-thumb:hover {
|
|
background: #c0c0c0;
|
|
background-position: center;
|
|
background-repeat: no-repeat;
|
|
}
|
|
::-webkit-scrollbar-thumb:active {
|
|
background: #adadad;
|
|
background-position: center;
|
|
background-repeat: no-repeat;
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb:vertical
|
|
{
|
|
border-width: 0 2px 0 0;
|
|
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='13px' width='4px' fill='rgb(192,192,192)'%3E%3Crect width = '4' height = '1' x='0' y='0'/%3E%3Crect width = '4' height = '1' x='0' y='2'/%3E%3Crect width = '4' height = '1' x='0' y='4'/%3E%3Crect width = '4' height = '1' x='0' y='6'/%3E%3Crect width = '4' height = '1' x='0' y='8'/%3E%3Crect width = '4' height = '1' x='0' y='10'/%3E%3Crect width = '4' height = '1' x='0' y='12'/%3E%3C/svg%3E");
|
|
}
|
|
::-webkit-scrollbar-thumb:vertical:hover, ::-webkit-scrollbar-thumb:vertical:active
|
|
{
|
|
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='13px' width='4px' fill='rgb(236,236,236)'%3E%3Crect width = '4' height = '1' x='0' y='0'/%3E%3Crect width = '4' height = '1' x='0' y='2'/%3E%3Crect width = '4' height = '1' x='0' y='4'/%3E%3Crect width = '4' height = '1' x='0' y='6'/%3E%3Crect width = '4' height = '1' x='0' y='8'/%3E%3Crect width = '4' height = '1' x='0' y='10'/%3E%3Crect width = '4' height = '1' x='0' y='12'/%3E%3C/svg%3E");
|
|
}
|
|
::-webkit-scrollbar-thumb:horizontal
|
|
{
|
|
border-width: 0 0 2px 0;
|
|
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13px' height='4px' fill='rgb(192,192,192)'%3E%3Crect width = '1' height = '4' y='0' x='0'/%3E%3Crect width = '1' height = '4' y='0' x='2'/%3E%3Crect width = '1' height = '4' y='0' x='4'/%3E%3Crect width = '1' height = '4' y='0' x='6'/%3E%3Crect width = '1' height = '4' y='0' x='8'/%3E%3Crect width = '1' height = '4' y='0' x='10'/%3E%3Crect width = '1' height = '4' y='0' x='12'/%3E%3C/svg%3E");
|
|
}
|
|
::-webkit-scrollbar-thumb:horizontal:hover, ::-webkit-scrollbar-thumb:horizontal:active
|
|
{
|
|
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13px' height='4px' fill='rgb(236,236,236)'%3E%3Crect width = '1' height = '4' y='0' x='0'/%3E%3Crect width = '1' height = '4' y='0' x='2'/%3E%3Crect width = '1' height = '4' y='0' x='4'/%3E%3Crect width = '1' height = '4' y='0' x='6'/%3E%3Crect width = '1' height = '4' y='0' x='8'/%3E%3Crect width = '1' height = '4' y='0' x='10'/%3E%3Crect width = '1' height = '4' y='0' x='12'/%3E%3C/svg%3E");
|
|
}
|
|
|
|
/* buttons*/
|
|
::-webkit-scrollbar-button:single-button {
|
|
height: 14px;
|
|
width: 14px;
|
|
box-shadow: inset 0px 0px 0px 1px #cbcbcb;
|
|
border: #eee 1px solid;
|
|
background-color: #f7f7f7;
|
|
background-position: center;
|
|
background-repeat: no-repeat;
|
|
}
|
|
|
|
::-webkit-scrollbar-button:single-button:hover {
|
|
background-color: #c0c0c0;
|
|
background-position: center;
|
|
background-repeat: no-repeat;
|
|
}
|
|
::-webkit-scrollbar-button:single-button:active {
|
|
background-color: #adadad;
|
|
background-position: center;
|
|
background-repeat: no-repeat;
|
|
}
|
|
|
|
::-webkit-scrollbar-button:single-button:vertical {
|
|
border-right-width: 2px;
|
|
border-left-width: 0;
|
|
}
|
|
|
|
::-webkit-scrollbar-button:single-button:horizontal {
|
|
border-bottom-width: 2px;
|
|
border-top-width: 0px;
|
|
}
|
|
::-webkit-scrollbar-button:single-button:vertical:decrement{
|
|
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='8' height='4px' fill='rgb(173, 173, 173)'><polygon points='4,0 0,4 8,4'/></svg>");
|
|
}
|
|
::-webkit-scrollbar-button:single-button:vertical:decrement:hover, ::-webkit-scrollbar-button:single-button:vertical:decrement:active{
|
|
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='8' height='4px' fill='rgb(247, 247, 247)'><polygon points='4,0 0,4 8,4'/></svg>");
|
|
}
|
|
|
|
::-webkit-scrollbar-button:single-button:vertical:increment{
|
|
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='8' height='4px' fill='rgb(173, 173, 173)'><polygon points='4,4 0,0 8,0'/></svg>");
|
|
}
|
|
::-webkit-scrollbar-button:single-button:vertical:increment:hover, ::-webkit-scrollbar-button:single-button:vertical:increment:active{
|
|
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='8' height='4px' fill='rgb(247, 274, 247)'><polygon points='4,4 0,0 8,0'/></svg>");
|
|
}
|
|
|
|
::-webkit-scrollbar-button:single-button:horizontal:increment{
|
|
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='4' height='8px' fill='rgb(173, 173, 173)'><polygon points='0,0 0,8 4,4'/></svg>");
|
|
}
|
|
::-webkit-scrollbar-button:single-button:horizontal:increment:hover, ::-webkit-scrollbar-button:single-button:horizontal:increment:active{
|
|
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='4' height='8px' fill='rgb(247, 247, 247)'><polygon points='0,0 0,8 4,4'/></svg>");
|
|
}
|
|
::-webkit-scrollbar-button:single-button:horizontal:decrement{
|
|
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='4' height='8px' fill='rgb(173, 173, 173)'><polygon points='0,4 4,8 4,0'/></svg>");
|
|
}
|
|
::-webkit-scrollbar-button:single-button:horizontal:decrement:hover, ::-webkit-scrollbar-button:single-button:horizontal:decrement:active {
|
|
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='4' height='8px' fill='rgb(247, 247, 247)'><polygon points='0,4 4,8 4,0'/></svg>");
|
|
}
|