Switch by anonithrax
#212121
1/* The switch - the box around the slider */ 2.switch { 3 position: relative; 4 display: inline-block; 5 width: 60px; 6 height: 34px; 7} 8 9/* Hide default HTML checkbox */ 10.switch input { 11 display: none; 12} 13 14/* The slider */ 15.switch label { 16 position: absolute; 17 cursor: pointer; 18 top: 0; 19 left: 0; 20 right: 0; 21 bottom: 0; 22 background-color: #ccc; 23 transition: .3s; 24} 25 26.switch label::before { 27 position: absolute; 28 content: ""; 29 height: 30px; 30 width: 30px; 31 left: 2px; 32 bottom: 2px; 33 background-color: white; 34 transition: .3s; 35} 36 37.switch input:checked + label { 38 background-color: #4c71f2; 39} 40 41.switch input:checked + label::before { 42 transform: translateX(26px); 43} 44
445 views
445 views
MIT License