#212121
1.radio-input .label input { 2 display: none; 3} 4 5.radio-input { 6 display: flex; 7 gap: 20px; 8} 9 10.radio-input .label { 11 display: flex; 12} 13 14.radio-input .label .check { 15 width: 30px; 16 height: 30px; 17 display: flex; 18 justify-content: center; 19 align-items: center; 20 border-radius: 50%; 21 cursor: pointer; 22 transition: 0.3s; 23 border: 3px solid transparent; 24 box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.5), 25 -1px -1px 4px rgba(255, 255, 255, 0.5); 26} 27 28.radio-input .label input:checked + .check { 29 box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.5), 30 -1px -1px 4px rgba(255, 255, 255, 0.5), 31 inset 3px 3px 6px rgba(0, 0, 0, 0.5), 32 inset -1px -1px 4px rgba(255, 255, 255, 0.5); 33 transform: scale(1.1); 34}
Comments
MIT License