@import "_mixins/all"

pre#log
  position: relative
  clear: left
  min-height: 12px
  margin-top: 25px
  margin-top: 1em
  padding: 15px 0
  color: $color-text-log
  font-family: monospace
  font-size: $font-size-log
  line-height: $line-height-log
  white-space: pre-wrap
  word-wrap: break-word
  background-color: $color-bg-log
  border: 1px solid $color-border-log
  @include border-radius(4px)
  overflow-x: scroll
  counter-reset: line-numbering

  .cut
    padding: 20px 15px 0 55px

  p
    padding: 0 15px 0 55px
    margin: 0
    min-height: 16px
    &:hover
      background-color: $color-bg-log-hover !important
    &.highlight
      background-color: $color-bg-log-highlight
      a
        color: white
    a
      // display: inline-block
      // min-width: 30px
      margin-left: -33px
      cursor: pointer
      text-decoration: none

      &::before
        content: counter(line-numbering)
        counter-increment: line-numbering
        padding-right: 1em
        text-align: right

  .fold
    height: 16px
    overflow: hidden
    cursor: pointer
    &.open
      height: auto

    p:first-of-type
      padding-right: 130px

    // &.active
    p:first-of-type
      background: $color-bg-log-fold inline-image('ui/log.fold.open.2.png') no-repeat 8px 3px

    &:not(.open) p:first-of-type
      visibility: visible
      height: auto
      min-height: 16px
      background-image: inline-image('ui/log.fold.closed.3.png')

    .fold-name
      position: absolute
      display: block
      right: 12px
      margin-top: 2px
      padding: 0px 7px 2px 7px
      line-height: 10px
      font-size: 10px
      background-color: #666
      border-radius: 6px
      color: #bbb

  .fold-start:not(.fold),
  .fold-end
    display: none

#log.loading
  padding: 25px 0 0 10px

#log-container
  position: relative

#log-container #tail
  z-index: 99
  position: absolute
  display: block
  top: 0
  right: 2px
  margin: 13px 10px 0 0
  padding: 0 2px 0 3px
  color: #666
  text-shadow: 0px 1px 0px #fff
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif
  font-size: $font-size-tiny
  line-height: 14px
  text-decoration: none
  white-space: nowrap
  border: 1px solid #bbb
  border-top-color: #ddd
  border-bottom-color: #bbb
  @include border-radius(8px)
  @include background(linear-gradient(#fff, #e0e0e0))

  label
    display: none
    cursor: pointer

  &:hover
    padding: 1px 4px 1px 6px
    label
      display: inline

  .status
    display: inline-block
    margin-right: 1px
    width: 8px
    height: 8px
    background-color: #aaa
    @include border-radius(4px)
    @include box-shadow(white 1px 1px 2px)

  &.active .status
    background-color: #6b0
