slider experiments

2021-03-12 11:54:05 +01:00
parent 857eee185e
commit b7356c7cf1
3 changed files with 89 additions and 1 deletions
@@ -86,3 +86,40 @@ input:focus,
  vertical-align: middle;
  margin-left: 5px;
 }
+
+.slidecontainer {
+  width: 100%;
+  margin-top: 10px;
+  margin-bottom: 10px;
+}
+
+.slider {
+  -webkit-appearance: none;
+  width: 100%;
+  height: 15px;
+  border-radius: 5px;  
+  background: #d3d3d3;
+  outline: none;
+  opacity: 0.7;
+  -webkit-transition: .2s;
+  transition: opacity .2s;
+  padding: 0 0;
+}
+
+.slider::-webkit-slider-thumb {
+  -webkit-appearance: none;
+  appearance: none;
+  width: 25px;
+  height: 25px;
+  border-radius: 50%; 
+  background: #4CAF50;
+  cursor: pointer;
+}
+
+.slider::-moz-range-thumb {
+  width: 25px;
+  height: 25px;
+  border-radius: 50%;
+  background: #4CAF50;
+  cursor: pointer;
+}