mirror of
https://github.com/naturalcrit/homebrewery.git
synced 2025-12-28 17:52:38 +00:00
Extra padding on the sides of a range slider extends the length of the slider, such that you can't move the thumb all the way to the end.
84 lines
1.8 KiB
Plaintext
84 lines
1.8 KiB
Plaintext
.toolBar {
|
|
position : relative;
|
|
z-index : 1;
|
|
display : flex;
|
|
flex-wrap : wrap;
|
|
gap : 5px;
|
|
align-items : center;
|
|
justify-content : center;
|
|
box-sizing : border-box;
|
|
width : 100%;
|
|
height : 29px;
|
|
padding : 2px 0;
|
|
font-family : 'Open Sans', sans-serif;
|
|
color : #CCCCCC;
|
|
background-color : #555555;
|
|
|
|
input {
|
|
position : relative;
|
|
height : 1.5em;
|
|
padding : 2px 5px;
|
|
font-family : 'Open Sans', sans-serif;
|
|
color : #000000;
|
|
background : #EEEEEE;
|
|
border : 1px solid gray;
|
|
&:focus { outline : 1px solid #d3d3d3; }
|
|
|
|
&.slider {
|
|
color: #D3D3D3;
|
|
accent-color: #d3d3d3;
|
|
padding: 2px 0;
|
|
|
|
&::-webkit-slider-thumb, &::-moz-slider-thumb {
|
|
cursor : pointer;
|
|
width: 5px;
|
|
height: 5px;
|
|
outline: none;
|
|
}
|
|
|
|
&:hover::after {
|
|
position : absolute;
|
|
bottom : -30px;
|
|
left : 50%;
|
|
z-index : 1;
|
|
display : grid;
|
|
place-items : center;
|
|
width : 4ch;
|
|
height : 1.2lh;
|
|
pointer-events : none;
|
|
content : attr(value);
|
|
background-color : #555555;
|
|
border : 1px solid #A1A1A1;
|
|
transform : translate(-50%, 50%);
|
|
}
|
|
}
|
|
}
|
|
|
|
.tool {
|
|
display : flex;
|
|
align-items : center;
|
|
padding : 0;
|
|
height: 100%;
|
|
width: auto;
|
|
box-sizing: content-box;
|
|
|
|
&:hover { background-color : #444444; }
|
|
|
|
button {
|
|
height : 100%;
|
|
width : auto;
|
|
min-width : 46px;
|
|
padding : 0 8px;
|
|
font-weight : unset;
|
|
color : inherit;
|
|
background-color : unset;
|
|
|
|
&:focus { outline : 1px solid #d3d3d3; }
|
|
|
|
&:disabled {
|
|
color : #777777;
|
|
background-color : unset !important;
|
|
}
|
|
}
|
|
}
|
|
} |