Показывать имена пользователей во всплывающем окне реакций

Есть ли возможность или планы добавить опцию для отображения полных имен пользователей вместо только аватаров во всплывающем окне с деталями реакции?

Особенно на мобильных устройствах это абсолютно бесполезно, если только вы не знаете все аватары наизусть — суперсила, которой я никогда не обладал в каком-либо сообществе, в котором участвовал.

На мой взгляд, в этом всплывающем окне не нужно быть особенно экономным с пространством, так как он открывается намеренно по клику.

1 лайк

Хочу отметить, что при клике на аватары во всплывающем окне с реакциями открывается полная карточка пользователя, где указано полное имя. Это решает вашу задачу?

3 лайка

Спасибо, но нет. По крайней мере, для меня вся суть всплывающего окна — получить быстрый обзор реакций. Я не хочу кликать на карточку каждого пользователя, чтобы узнать его имя. Открытие карточки также кажется довольно медленным из-за дополнительного времени загрузки.

Признаюсь, я забыл, что интерфейс «раскрывающихся» предварительных реакций, показывающий, кто лайкнул пост, тоже по умолчанию отображал только аватары. Я создал плагин для своего форума, чтобы изменить это, но забыл, что делал это, и подумал, что изменённый дизайн является стандартным! :see_no_evil: Поэтому всё это выглядело для меня скорее как регресс, чем было на самом деле.

В любом случае, спасибо за перенос этого в отдельную тему. Оно может остаться как призыв пересмотреть отображение только аватаров в местах, где вы действительно хотите видеть имена.

Интерфейс результатов опроса имеет похожую проблему.

2 лайка

На самом деле на рабочем столе при наведении на реакцию список пользователей отображается.

Sep-10-2023 21-26-13


Если кто-то ещё хочет это :arrow_down_small:

Общее / CSS

.discourse-reactions-counter {
  .discourse-reactions-state-panel {
    &.is-expanded {
      max-width: 500px;
    }
    .discourse-reactions-state-panel-reaction {
      margin-left: 0 !important;
      .list {
        display: flex;
        flex-wrap: wrap;
        gap: 0.25em;
        .trigger-user-card {
          margin-left: 0;
          width: max-content;
          height: auto;
          color: var(--primary-high);
          position: relative;
          &:before {
            // Установите имя пользователя из атрибута data-user-card
            // и добавьте запятую после имени пользователя
            content: attr(data-user-card) ",";
          }
          .avatar {
            opacity: 0;
            position: absolute;
          }
          &:last-child {
            &:before {
              // Уберите запятую у последнего имени пользователя
              content: attr(data-user-card);
            }
          }
        }
        button.show-users {
          order: 1; // Переместите стрелку в конец списка
        }
      }
    }
  }
}
8 лайков

Отличная публикация, спасибо!