thesis

%thesis-content-modified-before
  opacity     : 1
  height      : 16px
  width       : auto
  line-height : 16px
  font-size   : 12px

body.thesis-editing .thesis-content
  position   : relative // set these dynamically
  z-index    : 1039
  min-width  : 40px
  display    : block // set these dynamically
  cursor     : crosshair
  min-height : 1em
  padding    : 5px
  box-shadow : none
  outline    : none

  &.thesis-content-raw_html
    > *
      pointer-events: none

    &:empty
      padding: 20px 0px

  &, *
    color: #1E1E1E !important

    a
      text-decoration: underline

  &:before
    +transition(opacity .2s ease-in-out)
    height         : 0px
    width          : 0px
    display        : block
    opacity        : 0
    position       : absolute
    content        : "MODIFIED"
    background     : darken($green, 10%)
    right          : 0
    bottom         : -16px
    line-height    : 0
    font-size      : 0
    color          : white
    font-weight    : bold
    text-transform : uppercase
    font-family    : $raleway
    padding        : 0 10px
    pointer-events : none

  &:after
    +transition(border-color .2s ease-in-out)
    box-sizing       : border-box
    position         : absolute
    width            : 100%
    height           : 100%
    content          : ""
    top              : 0
    left             : 0
    background-color : rgba(white, .6)
    z-index          : -1
    border           : dotted 3px white

  &:focus
    box-shadow : none
    outline    : none
    cursor     : text

    &:after
      +barber_pole(rgba(white, .6), rgba(white, .15), 4s)

  &.modified
    &:before
      @extend %thesis-content-modified-before

    &:after
      border-color: darken($green, 10%)

  &[data-thesis-content-global='true']
    &:before
      @extend %thesis-content-modified-before
      content    : "GLOBAL"
      background : rgba(white, .5)
      box-shadow : 1.5px 0 0 white inset, 0 -1.5px 0 white inset, -1.5px 0 0 white inset

    &.modified:before
      content    : "MODIFIED GLOBALLY"
      background : darken($green, 10%)
      box-shadow : none