barrettruth.com/styles/graph.css

70 lines
1 KiB
CSS

.graph {
height: 50vh;
width: 100%;
display: flex;
justify-content: center;
margin: 50px 0;
}
.graph div {
height: 100%;
width: 60%;
}
.slider {
display: flex;
align-items: center;
justify-content: space-between;
}
.slider label {
margin-right: 10px;
}
.slider input {
margin-left: 20px;
-webkit-appearance: none;
appearance: none;
width: 100%;
height: 2px;
background: black;
cursor: pointer;
outline: none;
transform: translateY(-50%);
width: 150px;
}
.slider input::-webkit-slider-thumb {
-webkit-appearance: none;
width: 2px;
height: 15px;
background: black;
cursor: col-resize;
position: relative;
}
.slider input::-moz-range-thumb {
width: 2px;
height: 15px;
background: black;
cursor: col-resize;
position: relative;
}
.slider input::-webkit-slider-runnable-track,
.slider input::-moz-range-track {
width: 100%;
height: 2px;
background: black;
border: none;
}
.sliders {
display: flex;
justify-content: center;
}
ul {
list-style: none;
margin: 0;
}