#212121
1.input { 2 display: flex; 3 flex-direction: column; 4 width: 200px; 5 background-color: #0D1117; 6 justify-content: center; 7 border-radius: 5px 8} 9 10.value { 11 background-color: transparent; 12 border: none; 13 padding: 10px; 14 color: white; 15 display: flex; 16 position: relative; 17 gap: 5px; 18 cursor: pointer; 19 border-radius: 4px; 20} 21 22.value:not(:active):hover, 23.value:focus { 24 background-color: #21262C; 25} 26 27.value:focus, 28.value:active { 29 background-color: #1A1F24; 30 outline: none; 31} 32 33.value::before { 34 content: ""; 35 position: absolute; 36 top: 5px; 37 left: -10px; 38 width: 5px; 39 height: 80%; 40 background-color: #2F81F7; 41 border-radius: 5px; 42 opacity: 0; 43} 44 45.value:focus::before, 46.value:active::before { 47 opacity: 1; 48} 49 50.value svg { 51 width: 15px 52}
5.5K views
5.5K views
Comments
1azebkiller 15. October at 21:23
15. October at 21:23
Very Nice
Variations
2Yaroslav205728
650 views
MIT License