@insaic/neon/lib/switch/style.css

A Mobile UI Components built on Vue

.sq-switch {
  height: 1em;
  width: 1.6em;
  display: inline-block;
  position: relative;
  background: #fff;
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 1em;
  -webkit-transition: .3s;
  -o-transition: .3s;
  transition: .3s;
}
.sq-switch-checked {
    -webkit-transition: .3s;
    -o-transition: .3s;
    transition: .3s;
    background-color: #4A90E2;
}
.sq-switch-checked .sq-switch-circle {
      -webkit-transform: translateX(0.6em);
          -ms-transform: translateX(0.6em);
              transform: translateX(0.6em);
}
.sq-switch-disabled {
    opacity: .4;
}
.sq-switch-circle {
    top: 0;
    left: 0;
    z-index: 1;
    width: 1em;
    height: 1em;
    -webkit-transition: .3s;
    -o-transition: .3s;
    transition: .3s;
    position: absolute;
    border-radius: 100%;
    background-color: #fff;
    -webkit-box-shadow: 0 3px 1px 0 rgba(0, 0, 0, 0.05), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 3px 3px 0 rgba(0, 0, 0, 0.05);
            box-shadow: 0 3px 1px 0 rgba(0, 0, 0, 0.05), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 3px 3px 0 rgba(0, 0, 0, 0.05);
}