@import '010_mixins.css.sass'

#sr-boards-show

  #sr-board-header
    margin-bottom: 0

    #sr-board-title,
    #sr-board-description,
    #sr-board-meta ul
      margin: 0 auto

    #sr-board-title
      padding: 10px

      img
        float: left
        width: 35px
        height: 35px
        border-radius: 4px
        vertical-align: top

      h2
        float: left
        margin-left: 8px
        margin-top: 0
        width: 80%
        vertical-align: top

    #sr-board-description
      padding: 10px 10px 0 10px
      clear: both
      font-size: 12px

    #sr-board-meta
      border-top: 1px solid #ddd

      ul
        list-style: none
        overflow: hidden
        padding-left: 0

        li
          float: left
          font-size: 11px
          padding: 12px 16px
          text-align: center
          white-space: nowrap
          overflow: hidden

        &.sr-one-column li
          width: 100%

        &.sr-two-column li
          width: 50%

        &.sr-three-column li
          width: 33%
          box-sizing: border-box



  #sr-board-entries
    margin: 4px

    .entries-deckgrid > .column > .ng-scope
      // This margin was set on .sr-board-entry, but needs to be on the parent
      // for layout to pad properly. Is there a better way to target this?
      margin: 8px 4px 0 4px

    .sr-board-entry
      display: inline-block
      margin: 0
      width: 100%

      a
        .sr-entry-image
          display: block
          position: relative

          img
            width: 100%
            display: block

        .sr-entry-name
          text-align: left
          padding: 2px 4px 0 4px
          margin: 0

          p
            @include line-limit(3)
            padding: 0 4px 0 4px
            padding-top: 0
            margin-top: 4px
            margin-bottom: 0

        .sr-entry-story
          padding: 0 4px 0 4px

          p
            @include line-limit(5)
            padding: 2px 4px
            margin-bottom: 0

      .sr-meta-wrapper
        text-align: left
        padding: 0 4px 4px 4px

        .sr-meta-item
          font-size: 11px
          padding: 0 2px

      .sr-entry-author
        @include person-block

        .sr-person-name,
        .sr-date
          text-align: left