hummingbird-me/kitsu-web

/* Painting and performance;
 * Browsers can paint handles in their own layer.
 */
.noUi-base {
  transform: translate3d(0,0,0);
  background-color: #383D48;
  border-radius: 999em;
  left: 0;
}

/* Slider size and handle placement;
 */
.noUi-horizontal {
  height: 18px;
}
.noUi-horizontal .noUi-handle {
  width: 14px;
  height: 14px;
  border-radius: 999em;
  top: -5px;
  border: none;
  box-shadow: none;
  background-color: #1ABC9C;
}

.noUi-handle:before, .noUi-handle:after {
  display: none;
}

/* Styling;
 */
.noUi-background {
  background: #FAFAFA;
  box-shadow: inset 0 1px 1px #f0f0f0;
}
.noUi-connect {
  background: #2EA291;
  box-shadow: none;
  transition: background 450ms;
  border-radius: 999em;
}
.noUi-origin {
  border-radius: 2px;
  margin-right: 14px;
}
.noUi-target {
  @if $theme == 'kitsu-light' {
    background: $white;
  }
  @if $theme == 'kitsu-dark' {
    background: $background-color;
  }
  border-radius: 4px;
  border: none;
  box-shadow: none;
}
.noUi-target.noUi-connect {
  box-shadow: inset 0 0 3px rgba(51,51,51,0.45), 0 3px 6px -5px #BBB;
}