gilest/briefly

// jquery.Jcrop.css v0.9.12 - MIT License
//
// *  The outer-most container in a typical Jcrop instance
// *  If you are having difficulty with formatting related to styles
// *  on a parent element, place any fixes here or in a like selector
// *
// *  You can also style this element if you want to add a border, etc
// *  A better method for styling can be seen below with .jcrop-light
// *  (Add a class to the holder and style elements for that extended class)

.jcrop-holder
  direction: ltr
  text-align: left

// Selection Border

.jcrop-vline, .jcrop-hline
  background: white asset-url("Jcrop.gif")
  font-size: 0
  position: absolute

.jcrop-vline
  height: 100%
  width: 1px !important
  &.right
    right: 0

.jcrop-hline
  height: 1px !important
  width: 100%
  &.bottom
    bottom: 0

// Invisible click targets

.jcrop-tracker
  height: 100%
  width: 100%
  // "turn off" link highlight
  -webkit-tap-highlight-color: transparent
  // disable callout, image save panel
  -webkit-touch-callout: none
  // disable cut copy paste
  -webkit-user-select: none

// Selection Handles

.jcrop-handle
  background-color: #333333
  border: 1px #eeeeee solid
  width: 7px
  height: 7px
  font-size: 1px
  &.ord-n
    left: 50%
    margin-left: -4px
    margin-top: -4px
    top: 0
  &.ord-s
    bottom: 0
    left: 50%
    margin-bottom: -4px
    margin-left: -4px
  &.ord-e
    margin-right: -4px
    margin-top: -4px
    right: 0
    top: 50%
  &.ord-w
    left: 0
    margin-left: -4px
    margin-top: -4px
    top: 50%
  &.ord-nw
    left: 0
    margin-left: -4px
    margin-top: -4px
    top: 0
  &.ord-ne
    margin-right: -4px
    margin-top: -4px
    right: 0
    top: 0
  &.ord-se
    bottom: 0
    margin-bottom: -4px
    margin-right: -4px
    right: 0
  &.ord-sw
    bottom: 0
    left: 0
    margin-bottom: -4px
    margin-left: -4px

// Dragbars

.jcrop-dragbar
  &.ord-n, &.ord-s
    height: 7px
    width: 100%
  &.ord-e, &.ord-w
    height: 100%
    width: 7px
  &.ord-n
    margin-top: -4px
  &.ord-s
    bottom: 0
    margin-bottom: -4px
  &.ord-e
    margin-right: -4px
    right: 0
  &.ord-w
    margin-left: -4px

// The "jcrop-light" class/extension

.jcrop-light
  .jcrop-vline, .jcrop-hline
    background: #ffffff
    filter: alpha(opacity = 70) !important
    opacity: .70!important
  .jcrop-handle
    -moz-border-radius: 3px
    -webkit-border-radius: 3px
    background-color: #000000
    border-color: #ffffff
    border-radius: 3px

// The "jcrop-dark" class/extension

.jcrop-dark
  .jcrop-vline, .jcrop-hline
    background: #000000
    filter: alpha(opacity = 70) !important
    opacity: 0.7 !important
  .jcrop-handle
    -moz-border-radius: 3px
    -webkit-border-radius: 3px
    background-color: #ffffff
    border-color: #000000
    border-radius: 3px

// Simple macro to turn off the antlines

.solid-line
  .jcrop-vline, .jcrop-hline
    background: #ffffff

// Fix for twitter bootstrap et al.

.jcrop-holder img, img.jcrop-preview
  max-width: none