<commit_before>$user-size: 76px

.user
  +user-select(none)
  .peer
    position: absolute
    left: 50%
    bottom: 300px
    width: $user-size
    height: $user-size
    margin-left: -$user-size / 2
    text-align: center
    .avatar
      position: relative
      width: $user-size
      height: $user-size
      +transition(all .2s ease-in-out)
      svg
        top: 0
        bottom: 0
        z-index: -1
        fill: rgba($blue,.5)

    .gravatar
      position: absolute
      top: 5px
      left: 5px
      z-index: 1
      border: 1px solid #c0c0c0
      box-shadow: rgba(black, 0.2) 0 0 3px
      width: $user-size - 10
      height: $user-size - 10
      border-radius: 50%
      +animation(shadow .8s ease-in)
      +transition(all .2s ease-in-out)

    .user-info
      position: absolute
      top: $user-size
      left: 50%
      width: 140px
      margin-left: -70px
      .user-label, .user-email
        font-weight: bold
        color: #606060
        padding-bottom: 4px
      .user-email
        font-size: 10px
        +ellipsis
      .user-label
        font-size: 14px
      .user-id
        font-size: 10px
        color: #808080
      .user-connected
        display: inline-block
        background: rgba($blue,.5)
        width: 6px
        height: 6px
        vertical-align: middle
        border-radius: 50%

    &:nth-of-type(2)
      margin-left: -186px
      bottom: 225px
    &:nth-of-type(3)
      margin-left: 120px
      bottom: 225px
    &:nth-of-type(4)
      margin-left: -186px
      bottom: 365px
    &:nth-of-type(5)
      margin-left: 120px
      bottom: 365px
    &:nth-of-type(6)
      margin-left: -326px
      bottom: 180px
    &:nth-of-type(7)
      margin-left: 260px
      bottom: 180px
    &:nth-of-type(8)
      margin-left: -366px
      bottom: 320px
    &:nth-of-type(9)
      margin-left: 300px
      bottom: 320px
    &:nth-of-type(10)
      margin-left: -436px
      bottom: 90px
    &:nth-of-type(11)
      margin-left: 370px
      bottom: 90px
    &:nth-of-type(12)
      bottom: 400px
    &:nth-of-type(13)
      margin-left: -236px
      bottom: 90px
    &:nth-of-type(14)
      margin-left: 170px
      bottom: 90px

  &.you
    .peer
      bottom: 90px

  &.others
    .peer
      .avatar
        cursor: pointer
        &:hover
          +scale(1.1)
          .gravatar
            border-color: rgba($blue,.8)

+keyframes(shadow)
  0%
    opacity: 0
  50%
    opacity: 1
    box-shadow: rgba(0, 0, 0, 0.3) 0 0 15px<commit_msg>Add hover style when dragging file over avatar<commit_after>$user-size: 76px

.user
  +user-select(none)
  .peer
    position: absolute
    left: 50%
    bottom: 300px
    width: $user-size
    height: $user-size
    margin-left: -$user-size / 2
    text-align: center
    .avatar
      position: relative
      width: $user-size
      height: $user-size
      +transition(all .2s ease-in-out)
      svg
        top: 0
        bottom: 0
        z-index: -1
        fill: rgba($blue,.5)

    .gravatar
      position: absolute
      top: 5px
      left: 5px
      z-index: 1
      border: 1px solid #c0c0c0
      box-shadow: rgba(black, 0.2) 0 0 3px
      width: $user-size - 10
      height: $user-size - 10
      border-radius: 50%
      +animation(shadow .8s ease-in)
      +transition(all .2s ease-in-out)

    .user-info
      position: absolute
      top: $user-size
      left: 50%
      width: 140px
      margin-left: -70px
      .user-label, .user-email
        font-weight: bold
        color: #606060
        padding-bottom: 4px
      .user-email
        font-size: 10px
        +ellipsis
      .user-label
        font-size: 14px
      .user-id
        font-size: 10px
        color: #808080
      .user-connected
        display: inline-block
        background: rgba($blue,.5)
        width: 6px
        height: 6px
        vertical-align: middle
        border-radius: 50%

    &:nth-of-type(2)
      margin-left: -186px
      bottom: 225px
    &:nth-of-type(3)
      margin-left: 120px
      bottom: 225px
    &:nth-of-type(4)
      margin-left: -186px
      bottom: 365px
    &:nth-of-type(5)
      margin-left: 120px
      bottom: 365px
    &:nth-of-type(6)
      margin-left: -326px
      bottom: 180px
    &:nth-of-type(7)
      margin-left: 260px
      bottom: 180px
    &:nth-of-type(8)
      margin-left: -366px
      bottom: 320px
    &:nth-of-type(9)
      margin-left: 300px
      bottom: 320px
    &:nth-of-type(10)
      margin-left: -436px
      bottom: 90px
    &:nth-of-type(11)
      margin-left: 370px
      bottom: 90px
    &:nth-of-type(12)
      bottom: 400px
    &:nth-of-type(13)
      margin-left: -236px
      bottom: 90px
    &:nth-of-type(14)
      margin-left: 170px
      bottom: 90px

  &.you
    .peer
      bottom: 90px

  &.others
    .peer
      .avatar
        cursor: pointer
        &:hover, &.hover
          +scale(1.1)
          .gravatar
            border-color: rgba($blue,.8)

+keyframes(shadow)
  0%
    opacity: 0
  50%
    opacity: 1
    box-shadow: rgba(0, 0, 0, 0.3) 0 0 15px
{'fraction_non_alphanumeric': 0.12172359015091343, 'fraction_numerical': 0.06830818109610802, 'mean_word_length': 1.593717816683831, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5965354', 'n_tokens_mistral': 2136, 'n_tokens_neox': 1839, 'n_words': 423}