Mostrar nomes de usuário no popover de Reagiu

Existe uma opção ou planos para adicionar uma opção para mostrar nomes completos de usuários em vez de apenas avatares no popover de detalhes de reações?

Especialmente no celular, é espetacularmente inútil, a menos que você conheça todos os avatares de cor, um superpoder que nunca possuí em nenhuma comunidade da qual fiz parte.

Na minha opinião, você também não precisa ser especialmente eficiente em termos de espaço nesse popover, pois ele só é aberto intencionalmente ao clicar.

1 curtida

Gostaria apenas de observar que clicar nos avatares no pop-up de reação abre o cartão completo do usuário, que inclui o nome completo do usuário. Isso atende à sua necessidade aqui?

3 curtidas

Obrigado, mas não. Pelo menos para mim, todo o propósito do popover é ter uma visão geral rápida das reações dadas. Não quero ter que clicar no cartão de cada usuário para descobrir o nome dele. Abrir o cartão também parece bastante lento devido ao tempo extra de carregamento.

Tenho que admitir que esqueci que a interface de “desdobramento” de pré-reações para mostrar quem curtiu uma postagem também mostrava apenas avatares por padrão. Criei um plugin para o meu fórum para mudar isso, mas esqueci que o fiz e pensei que o design alterado era o padrão! :see_no_evil: Então, tudo parecia mais uma regressão para mim do que realmente era.

De qualquer forma, obrigado por mover isso para um tópico próprio. Pode permanecer como um apelo para reconsiderar mostrar apenas avatares em lugares onde você realmente quer ler nomes.

A interface de resultados da enquete tem um problema semelhante.

2 curtidas

Na verdade, no desktop, quando você passa o mouse sobre a reação, ela lista os usuários.

Sep-10-2023 21-26-13


Se mais alguém quiser isso :arrow_down_small:

Common / 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 {
            // Define o nome de usuário do atributo data-user-card
            // e adiciona uma vírgula ao lado do nome de usuário
            content: attr(data-user-card) ",";
          }
          .avatar {
            opacity: 0;
            position: absolute;
          }
          &:last-child {
            &:before {
              // Remove a vírgula do último nome de usuário
              content: attr(data-user-card);
            }
          }
        }
        button.show-users {
          order: 1; // Ordena a seta para o final da lista
        }
      }
    }
  }
}
8 curtidas

Ótima partilha Obrigado!