Lista de Tópicos do Discourse: Autores e Participantes

[Lilly (Lillian)]

	Resumo	Adiciona o autor do tópico à coluna esquerda das páginas de lista de tópicos, além de uma opção para exibir apenas o último postador na coluna de postadores padrão. O avatar do autor também pode ser redimensionado e ter sua forma alterada.
	Pré-visualização	https://discourse.theme-creator.io/theme/Lilly/discourse-topic-list-author-posters
	Repositório	https://github.com/Lillinator/discourse-topic-list-author-posters
	Guia de Instalação	Como instalar um tema ou componente de tema

Instale este componente de tema

Visão Geral

Este componente de tema do Discourse insere o avatar do autor do tópico na primeira coluna de todas as rotas de lista de tópicos e possui configurações que permitem ao administrador especificar a forma e o tamanho do avatar. Além disso, o avatar do autor não aparecerá como o primeiro avatar na lista de postadores.

Há também uma configuração para fazer com que a coluna de avatares dos postadores exiba apenas o último (mais recente) postador, mas apenas se houver mais de um participante no tópico. Assim, o avatar do autor só será exibido se houver outros postadores no tópico.

Além disso, os administradores podem optar por exibir o autor do tópico na página de categorias quando as visualizações de lista de tópicos mais recentes estiverem habilitadas (ou seja: „Categorias com tópicos mais recentes“), e também há opções de tamanho e forma para os avatares.

Existe também um interruptor para alinhar verticalmente o conteúdo da linha no topo ou no meio.

Em telas pequenas (tamanho móvel), o autor aparecerá onde normalmente estaria o avatar do último postador.

Este componente funciona bem com Resumos da Lista de Tópicos e Resumos de Gists com IA do Discourse.

Configurações

Captura de tela das configurações com as opções padrão na página de administração do componente

Configurações	Descrição
Tamanho do avatar do autor na lista de tópicos	Tamanho dos avatares na coluna do autor na página de lista de tópicos - pequeno, médio ou grande.
Raio da borda do avatar do autor na lista de tópicos	Arredondamento dos avatares na página de lista de tópicos: 0% = quadrado → 50% = círculo. tab_style = cantos esquerdos arredondados
Mostrar apenas o último postador na lista de tópicos	Mostrar apenas o avatar do último postador na coluna de postadores, mas apenas se houver mais de um participante no tópico.
Alinhar verticalmente a linha no topo	Interruptor para alinhar as linhas no topo ou no meio
Mostrar autor na página de categorias	Mostrar o avatar do autor em vez do último postador nas listas de tópicos na página de categorias.
Tamanho do avatar na página de categorias	Tamanho dos avatares na coluna do autor nas listas de tópicos da página de categorias - pequeno, médio ou grande.
Raio da borda do avatar na página de categorias	Arredondamento dos avatares na página de categorias: 0% = quadrado → 50% = círculo. tab_style = cantos esquerdos arredondados

Capturas de Tela

Aqui estão algumas capturas de tela com diferentes configurações de tamanho e forma de avatar, também mostrando com resumos de gists expandidos.

Capturas de tela de várias páginas de lista de tópicos com diferentes configurações de componente ativadas, mostrando os modos de gists compactos e expandidos, e barra lateral expandida/recolhida

Com as configurações padrão:

Forma de avatar tab_style grande com resumos de gists expandidos:

Avatares pequenos com forma de raio de borda de 15% e Topic_list_show_last_poster_only ativado:

Avatares médios com raio de borda de 0% (quadrado) com Topic_list_show_last_poster_only ativado e resumos de gists expandidos:

Capturas de tela da Página de Categorias mostrando 2 tamanhos e formas diferentes de avatares com autor ou último postador.

Configurações padrão do componente, com avatares redondos de tamanho médio e Show_author_on_categories_page ativado:

Avatares grandes com estilo tab_style e Show_author_on_categories_page desativado:

Captura de tela da visualização em tamanho móvel

Com avatares de autor no estilo tab_style:

---

Observações

• Insere o avatar do autor e altera a coluna de postadores onde esperado nas abas da página de perfil.
• O comportamento móvel é o mesmo do padrão nas listas de rodapé de tópicos (tópicos sugeridos/relacionados) e nas páginas de abas de perfil e caixa de entrada.
• Não é realmente compatível com o tema horizon.

---

Possíveis tarefas futuras

• Adicionar um interruptor para desativar no modo móvel?
• Isenções para categorias e tags?
• Suporte para direção da esquerda para a direita?
• Arredondar os avatares dos postadores?

Como sempre, obrigado a @Moin pela ideia, feedback e ajuda na depuração.

---

Confira meu outro conteúdo do Discourse

[jordanjay29]

Obrigado por criar isto, resolveu instantaneamente um problema potencial para mim!

@Lilly

Melhorias adicionais de estilo

Talvez isso já esteja planejado, mas queria mencionar que notei que o preenchimento e o alinhamento da coluna do avatar do autor à esquerda têm um recuo estranho (que não está presente no celular com o componente desativado, para comparação). Parece que o atributo text-align do td.posters também está afetando a imagem.
O alinhamento da lista de avatares dos autores também muda quando ativado, e parece que o alinhamento de td.topic-list-data está substituindo o padrão. É fácil fazer alterações de folha de estilo por minha conta, se você estiver satisfeito com estes, de qualquer forma.
Componente fantástico, obrigado novamente.

[Lilly (Lillian)]

obrigado pelo relatório, acabei de enviar uma correção. atualize o componente e me avise se isso ajuda.

[jordanjay29]

O alinhamento do avatar à esquerda é melhor no desktop. Adicionei este CSS para ajustar a coluna do pôster do meio às minhas preferências:

td.posters.topic-list-data {
    vertical-align: middle !important;
}

Acho que sua futura desativação móvel também ajudará, porque o estilo usa um pouco mais de espaço em branco do que o necessário.

[Lilly (Lillian)]

@jordanjay29

O alinhamento esquerdo do avatar é melhor no desktop. Adicionei este CSS para ajustar a coluna do pôster do meio às minhas preferências:\n\n

o alinhamento vertical superior é intencional para ser consistente com o restante do cartão do tópico e não será alterado.

Eu não fiz nenhuma alteração no celular, mas vou verificar.

[jordanjay29]

O alinhamento vertical pode ter sido aplicado de forma muito ampla no seu CSS e provavelmente só precisa ter como alvo a custom-author-column onde você está usando td.topic-list-data. Suspeito que mudar o alvo para td.custom-author-column.topic-list-data resolverá e removerá a necessidade de estilização personalizada para corrigir por minha parte.

[Lilly (Lillian)]

não, eu pretendia que a coluna de pôsteres estivesse alinhada verticalmente no topo, juntamente com todos os outros elementos da linha. Ela parece deslocada alinhada ao meio (especialmente se você ativar trechos ou ai-gists), mas suponho que seja uma questão de gosto, então você pode ajustar como preferir.

Enviei uma pequena alteração para dispositivos móveis.

[jordanjay29]

Como meu fórum não usa trechos, gists ou resumos de IA, a aparência padrão do Discourse é a preferida. Essa mudança parece fazer mais sentido em um componente de tema dedicado para mim, mas discordamos e eu corrigi no meu lado, então sem ressentimentos.

O visual no celular está um pouco melhor, obrigado!

[Lilly (Lillian)]

@jordanjay29 depois de pensar mais sobre isso, decidi adicionar uma opção de alternância de alinhamento (fácil o suficiente).

aqui está

há uma nova configuração Alinhar verticalmente a linha superior que você pode desativar para obter o padrão central. me avise se isso funciona para você.