Contents

$zoom-height: 30px;
$dragger-size: 14px;
$dragger-color: #234051;
$track-height: 3px;
$track-color: #CCCCCC;

.zoom-container {
  position: relative;
  .icon-zoom-out {
    float: left;
    color: #000;
  }
  .icon-zoom-in {
    float: right;
    color: #000;
  }
  .slider-container {
    position: absolute;
    width: 100%;
  }
  .zoom-icon {
    cursor: pointer;
    background: none;
    border: none;
    outline: none;
    i {
      width: 16px;
      height: 16px;
      color: #CCCCCC;
    }
  }
  .zoom-out {
    position: relative;
    z-index: 101;
    float: left;
  }
  .zoom-in {
    position: relative;
    z-index: 101;
    float: right;
  }
}


.slider {
  height: $zoom-height;
  z-index: 100;
  .dragger {
    border-radius: 50%;
    background: $dragger-color;
    width: $dragger-size;
    height: $dragger-size;
  }
  .track {
    top: 0;
    padding: ($zoom-height / 2) 0;
    &:after {
      content: " ";
      position: absolute;
      background: $track-color;
      height: $track-height;
      width: 100%;
      margin-top: $track-height / -2;
    }
  }
}

.cropit-container {
  display: inline-block;
  *zoom: 1;

  &:before, &:after {
    content: " ";
    display: table;
  }

  &:after {
    clear: both;
  }
}

.cropit-preview {
  cursor: move;
}

.cropit-preview-background-container {
  overflow: hidden;
}

.cropit-preview-background {
  transition: opacity 600ms;
  cursor: move;
  opacity: .4;
}

.cropit-zoom {
  position: relative;
}

Version data entries

2 entries across 2 versions & 1 rubygems

Version	Path
voltron-crop-0.1.4	app/assets/stylesheets/voltron-crop.scss
voltron-crop-0.1.3	app/assets/stylesheets/voltron-crop.scss