Radio by BiliBC034
#212121
1.input { 2 display: flex; 3 flex-direction: row; 4 width: auto; 5 background-color: #0d1117; 6 justify-content: center; 7 border-radius: 5px; 8 align-items: center; 9} 10 11.value { 12 background-color: transparent; 13 border: none; 14 padding: 10px; 15 color: white; 16 display: flex; 17 position: relative; 18 gap: 5px; 19 cursor: pointer; 20 border-radius: 4px; 21 margin: 0 10px 0 10px; 22} 23 24.value:not(:active):hover, 25.value:focus { 26 background-color: #21262c; 27} 28 29.value:focus, 30.value:active { 31 background-color: #1a1f24; 32 outline: none; 33} 34 35.value::before { 36 content: ""; 37 position: absolute; 38 top: 5px; 39 left: -10px; 40 width: 5px; 41 height: 80%; 42 background-color: #2f81f7; 43 border-radius: 5px; 44 opacity: 0; 45} 46 47.value:focus::before, 48.value:active::before { 49 opacity: 1; 50} 51 52.value svg { 53 width: 15px; 54} 55
848 views
Variation of aradio
MIT License