@import compass
@import 'colors'

.tags-controller
  .search
    width: 195px
  width: 210px
  .tags-div
    overflow-y: auto
    overflow-x: hidden
    margin-right: -15px
  .tags-list
    max-height: 250px
    li
      padding: 2px 2px 4px
      .icon-pencil
        color: rgba(0, 0, 0, 0.1)
      &:hover
        .icon-pencil
          color: rgba(0, 0, 0, 0.8)

      .icon-pencil
        cursor: pointer

  .tag-item
    cursor: pointer

  .buttons
    +border-bottom-radius(4px)
    background: $grayLighter
    text-align: center
    padding: 6px 4px
    margin: 0px -15px -10px

#tag-editor
  .control-group
    float: left
    margin-right: 4px
  .tag-colors
    list-style: none
    margin: 10px 0px 0px
    padding: 0px
    li
      margin: 0px
      padding: 0px
      width: 30px
      height: 30px
      float: left
      cursor: pointer

  .tag-preview
    clear: both
  #tag-name-input
    width: 170px
  #tag-bgcolor-input
    width: 70px


.tag, .tag-item
  +border-radius(2px)
  +box-shadow(0px 1px 2px gray)
  display: inline-block
  padding: 0px 4px
  font-weight: bold
  font-size: 12px

.tags-for
  margin-top: 2px
  .tag
    margin-right: 6px
    margin-top: 4px
    //line-height: 18px

