<commit_before>/**
 *    Copyright (c) ppy Pty Ltd <<EMAIL>>.
 *
 *    This file is part of osu!web. osu!web is distributed with the hope of
 *    attracting more community contributions to the core ecosystem of osu!.
 *
 *    osu!web is free software: you can redistribute it and/or modify
 *    it under the terms of the Affero GNU General Public License version 3
 *    as published by the Free Software Foundation.
 *
 *    osu!web is distributed WITHOUT ANY WARRANTY; without even the implied
 *    warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
 *    See the GNU Affero General Public License for more details.
 *
 *    You should have received a copy of the GNU Affero General Public License
 *    along with osu!web.  If not, see <http://www.gnu.org/licenses/>.
 */

 .chat-conversation-list-item {
  @top: chat-conversation-list-item;
  height: 40px;
  color: white;
  display: flex;
  align-items: center;
  margin-left: 10px;
  padding-left: 10px;

  @media @desktop {
    &:hover {
      background: linear-gradient(to right, @osu-colour-b5 5%, @osu-colour-b3 33%, @osu-colour-b3 100%);
    }
  }

  @media @mobile {
    margin-left: 0px;
    padding-left: 0px;
    flex-shrink: 0;
  }

  &--selected {
    color: white;
    background: linear-gradient(to right, @osu-colour-b5 5%, @osu-colour-b4 33%, @osu-colour-b4 100%);
    @media @mobile {
      background: @osu-colour-b4;
    }
  }

  &__close-button {
    .reset-input();
    padding: 5px;
    color: fade(white, 50%);

    &:hover {
      color: white;
    }

    @media @desktop {
      opacity: 0;
      margin-left: -10px;
      .@{top}:hover & {
        opacity: 1;
      }
    }

    @media @mobile {
      display: none;
      .@{top}--selected & {
        display: block;
        margin-left: 5px;
      }
    }
  }

  &__tile {
    .reset-input();
    display: flex;
    align-items: center;
    align-self: stretch;
    flex: 1;
  }

  &__unread-indicator {
    background: @green;
    width: 2px;
    height: 10px;
    border-radius: 1px;

    opacity: 0;
    .@{top}--unread & {
      opacity: 1;
      &::after {
        opacity: 0.5;
        .full-size();
        border-radius: 1px;
        content: '';
        box-shadow: 0 0 5px lighten(@green, 10%);
        animation: glow-pulse 2s infinite;
      }
    }

    @media @desktop {
      margin-left: -10px;
      margin-right: 10px;
      .@{top}:hover & {
        opacity: 0;<commit_msg>Fix invisible unread indicator blocking close button in chat<commit_after>/**
 *    Copyright (c) ppy Pty Ltd <<EMAIL>>.
 *
 *    This file is part of osu!web. osu!web is distributed with the hope of
 *    attracting more community contributions to the core ecosystem of osu!.
 *
 *    osu!web is free software: you can redistribute it and/or modify
 *    it under the terms of the Affero GNU General Public License version 3
 *    as published by the Free Software Foundation.
 *
 *    osu!web is distributed WITHOUT ANY WARRANTY; without even the implied
 *    warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
 *    See the GNU Affero General Public License for more details.
 *
 *    You should have received a copy of the GNU Affero General Public License
 *    along with osu!web.  If not, see <http://www.gnu.org/licenses/>.
 */

 .chat-conversation-list-item {
  @top: chat-conversation-list-item;
  height: 40px;
  color: white;
  display: flex;
  align-items: center;
  margin-left: 10px;
  padding-left: 10px;

  @media @desktop {
    &:hover {
      background: linear-gradient(to right, @osu-colour-b5 5%, @osu-colour-b3 33%, @osu-colour-b3 100%);
    }
  }

  @media @mobile {
    margin-left: 0px;
    padding-left: 0px;
    flex-shrink: 0;
  }

  &--selected {
    color: white;
    background: linear-gradient(to right, @osu-colour-b5 5%, @osu-colour-b4 33%, @osu-colour-b4 100%);
    @media @mobile {
      background: @osu-colour-b4;
    }
  }

  &__close-button {
    .reset-input();
    padding: 5px;
    color: fade(white, 50%);

    &:hover {
      color: white;
    }

    @media @desktop {
      opacity: 0;
      margin-left: -10px;
      .@{top}:hover & {
        opacity: 1;
      }
    }

    @media @mobile {
      display: none;
      .@{top}--selected & {
        display: block;
        margin-left: 5px;
      }
    }
  }

  &__tile {
    .reset-input();
    display: flex;
    align-items: center;
    align-self: stretch;
    flex: 1;
  }

  &__unread-indicator {
    background: @green;
    width: 2px;
    height: 10px;
    border-radius: 1px;
    pointer-events: none;

    opacity: 0;
    .@{top}--unread & {
      opacity: 1;
      &::after {
        opacity: 0.5;
        .full-size();
        border-radius: 1px;
        content: '';
        box-shadow: 0 0 5px lighten(@green, 10%);
        animation: glow-pulse 2s infinite;
      }
    }

    @media @desktop {
      margin-left: -10px;
      margin-right: 10px;
      .@{top}:hover & {
        opacity: 0;
{'fraction_non_alphanumeric': 0.12799838742189074, 'fraction_numerical': 0.02338238258415642, 'mean_word_length': 2.205426356589147, 'pattern_counts': {'":': 0, '<': 9, '<?xml version=': 0, '>': 9, 'https://': 0, 'lorem ipsum': 0, 'www.': 2, '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': '6343416', 'n_tokens_mistral': 1800, 'n_tokens_neox': 1642, 'n_words': 485}