hunk.code_window:             <ReactionListView
                   post={this.props.post}
                   currentUserId={this.props.currentUserId}
                   reactions={this.state.reactions}
               />
           );
       }
   }
hunk.labels: keep keep keep add keep keep keep keep
hunk.after_edit:                 emojis={this.state.emojis}
  
hunk.file_path: webapp/components/post_view/components/reaction_list_container.jsx
hunk.type: add
file: @charset 'UTF-8';
  
  .mention {
      @include border-radius(3px);
      background: $primary-color;
      color: $white;
      padding-bottom: 2px;
      position: relative;
      z-index: 10;
  }
  
  .mentions__name {
      @include clearfix;
      cursor: pointer;
      font-size: 13px;
      line-height: 20px;
      margin: 0;
      padding: 6px 10px;
      position: relative;
      white-space: nowrap;
      width: 100%;
      z-index: 101;
  
      .status {
          font-size: 15px;
          text-align: center;
          vertical-align: bottom;
          width: 20px;
      }
  
      .fa-user {
          position: relative;
          top: -1px;
      }
  
      .mention--align {
          @include clearfix;
          text-overflow: ellipsis;
          width: calc(100% - 50px);
      }
  }
  
  .mention__image {
      @include border-radius(20px);
      display: block;
      font-size: 15px;
      height: 20px;
      line-height: 20px;
      margin-right: 6px;
      text-align: center;
      width: 20px;
  
      .mention--align {
          display: inline-block;
          max-width: 80%;
          overflow: hidden;
          text-overflow: ellipsis;
          white-space: nowrap;
      }
  }
  
  .mention__fullname {
      @include opacity(.5);
  }
  
  .mention--highlight {
      background-color: $yellow;
  }
  
  .mention__purpose {
      @include opacity(.5);
      line-height: normal;
      margin-left: 5px;
  }
  
  .mention__channelname {
      @include opacity(.5);
  }
  