Contents

@import "../tokens/colors";
@import "../tokens/spacing";
@import "../pb_body/body";
@import "../tokens/transition";

[class^=pb_radio_kit] {
  display: inline-flex;

  .pb_radio_button {
    width: 22px;
    height: 22px;
    border-radius: 1000px;
    border: 2px solid $border_light;
    margin-right: $space_xs;
    transition-property: border-color, border;
    transition-duration: $transition_short;
    transition-timing-function: $easeIn;
  }

  &:hover .pb_radio_button {
    border-color: $primary_action;
  }

  input {
    position: relative;
    display: none;
    &:checked ~ .pb_radio_button {
      border: 6px solid $primary;
    }
  }
  &[class*=_dark] {
      input:checked ~ .pb_radio_button {
        border: 6px solid $primary;
      }

      &:hover .pb_radio_button {
        border-color: $primary_action;
      }
    }
}

Version data entries

2 entries across 2 versions & 1 rubygems

Version	Path
playbook_ui-3.4.0	app/pb_kits/playbook/pb_radio/_radio.scss
playbook_ui-3.3.0	app/pb_kits/playbook/pb_radio/_radio.scss