Radio by Ratinax
#e8e8e8
1.container { 2 scale: 0.7; 3} 4 5.fire { 6 width: 2em; 7 height: 6.5em; 8 background-color: black; 9 border-radius: 1em; 10 display: flex; 11 justify-content: center; 12 align-items: center; 13 flex-direction: column; 14} 15 16.label { 17 width: 1.5em; 18 height: 1.5em; 19 border-radius: 50%; 20 margin-top: .25em; 21 margin-bottom: .25em; 22 border-top: .2em solid black; 23 cursor: pointer; 24} 25 26.input { 27 display: none; 28} 29 30.label.red { 31 background-color: #990000; 32 box-shadow: 0 0 2em #990000; 33} 34 35.label.orange { 36 background-color: #999900; 37 box-shadow: 0 0 2em #999900; 38} 39 40.label.green { 41 background-color: #009900; 42 box-shadow: 0 0 2em #009900; 43} 44 45.label.red:hover { 46 background-color: red; 47} 48 49.label.orange:hover { 50 background-color: orange; 51} 52 53.label.green:hover { 54 background-color: lime; 55} 56 57.label.red:has(input:checked) { 58 background-color: red; 59 box-shadow: 0 0 2em red; 60} 61 62.label.orange:has(input:checked) { 63 background-color: orange; 64 box-shadow: 0 0 2em orange; 65} 66 67.label.green:has(input:checked) { 68 background-color: lime; 69 box-shadow: 0 0 2em lime; 70}
1.1K views
1.1K views
MIT License