Switch by Lmickk2
#e8e8e8
1.switch { 2 font-size: 17px; 3 position: relative; 4 display: inline-block; 5 width: 4.5em; 6 height: 2em; 7} 8 9.switch input { 10 opacity: 0; 11 width: 0; 12 height: 0; 13} 14 15.slider { 16 position: absolute; 17 cursor: pointer; 18 top: 0; 19 left: 0; 20 right: 0; 21 bottom: 0; 22 box-shadow: inset 1px 2px 5px 1px rgba(0, 0, 0, 0.329); 23 transition: .4s; 24 border-radius: 30px; 25} 26 27.slider:before { 28 position: absolute; 29 content: ""; 30 height: 1.4em; 31 width: 1.4em; 32 border-radius: 20px; 33 left: 0.3em; 34 bottom: 0.3em; 35 background-color: rgb(255, 255, 255); 36 transition: .4s; 37} 38 39.switch input:checked + .slider { 40 background-color: #59c76b; 41} 42 43.switch input:focus + .slider { 44 box-shadow: inset 3px 2px 4px rgba(22, 22, 22, 0.253); 45} 46 47.switch input:checked + .slider:before { 48 transform: translateX(2.5em); 49}
695 views
695 views
MIT License