switcher.less 695 B

12345678910111213141516171819202122232425262728293031323334353637
  1. .switcher-input {
  2. position: absolute;
  3. opacity: 0;
  4. pointer-events: none;
  5. }
  6. .switcher-label {
  7. border: 1px solid black;
  8. padding: 4px 16px;
  9. user-select: none;
  10. }
  11. .switcher-label:first-of-type {
  12. border-top-left-radius: 999px;
  13. border-bottom-left-radius: 999px;
  14. }
  15. .switcher-label:last-of-type {
  16. border-top-right-radius: 999px;
  17. border-bottom-right-radius: 999px;
  18. }
  19. .switcher-label:not(:first-of-type) {
  20. border-left-width: 0px;
  21. }
  22. .switcher-input:checked + .switcher-label {
  23. background-color: @neutral-20;
  24. }
  25. .switcher-input:disabled + .switcher-label {
  26. cursor: not-allowed;
  27. background-color: @neutral-20;
  28. border-color: @neutral-20;
  29. opacity: 1;
  30. color: @neutral-90;
  31. }