@mixin overflow-ellipsis
  overflow: hidden
  white-space: nowrap
  text-overflow: ellipsis

@mixin line-limit($num_lines: 3)
  display: -webkit-box
  -webkit-line-clamp: $num_lines
  -webkit-box-orient: vertical
  overflow: hidden
  text-overflow: ellipsis

@mixin masonry-block($num_columns: 3, $column_width: 140px, $column_gap: 7px)
  -moz-column-count: $num_columns
  -webkit-column-count: $num_columns
  column-count: $num_columns
  -moz-column-gap: $column_gap
  -webkit-column-gap: $column_gap
  column-gap: $column_gap
  width: $num_columns * ($column_width + $column_gap)

@mixin person-block($avatar_size: 30px, $padding: 5px, $img_border_radius: 2px, $max_width: 95px, $font_size: 11px)
  border-top: 1px solid #ddd
  padding: $padding
  overflow: hidden

  img
    border-radius: $img_border_radius
    float: left
    width: $avatar_size
    height: $avatar_size
    margin-right: $padding

  .sr-person-name,
  .sr-date
    @include overflow-ellipsis
    font-size: $font_size
    -webkit-font-smoothing: antialiased
    line-height: $font_size + 3px
    max-width: $max_width

  .sr-person-name
    font-weight: bold
    clear: right

