gistfile1.scss

<div class="quality switch white">
                      <input type="radio" name="switch" id="switch-off"<% if (this.model.get('quality') === '720p') { %> checked<% } %>>
                      <input type="radio" name="switch" id="switch-on"<% if (this.model.get('quality') === '1080p') { %> checked<% } %>>
                      <label for="switch-off">720p</label>
                      <label for="switch-on">1080p</label>
                      <span class="toggle"></span>
                    </div>

.switch {
            background: transparent;
            border-radius: 32px;
            display: block;
            height: 12px;
            position: absolute;
            width: 25px;
            border: 2px solid #FFF;
            left: 48px;
            top: 28px;
            cursor: pointer;

            label {
              @include transition(color .2s ease);
              color: #fff;
              font-size: 12px;
              font-weight: bold;
              text-transform: uppercase;
              width: 20px;
              cursor: pointer;

              &:nth-of-type(1) {
                left: -38px;
                position: absolute;
                text-align: right;
              }

              &:nth-of-type(2) {
                position: absolute;
                right: -30px;
                text-align: left;
              }
            }

            input {
              height: 12px;
              left: 0;
              opacity: 0;
              position: absolute;
              top: 0;
              width: 60px;
              z-index: 2;
              cursor: pointer;

              &:checked {
                z-index: 0;

                ~ label {
                  &:nth-of-type(1) { color: $popcorn-blue; }
                  &:nth-of-type(2) { color: #FFF; }
                }

                ~ .toggle { left: 2px; }
              }

              ~ :checked ~ label {
                &:nth-of-type(1) { color: #FFF; }
                &:nth-of-type(2) { color: $popcorn-blue; }
              }

              ~ :checked ~ .toggle { left: 13px; }
            }
          }

          .toggle {
            @include transition(left .2s ease);
            background: $popcorn-blue;
            border-radius: 50%;
            height: 10px;
            left: 0;
            position: absolute;
            top: 1px;
            width: 10px;
            z-index: 1;
          }
        }