Lista de Tópicos do Discourse: Autores e Postadores

[Lilly]

	Resumo	Adiciona o autor do tópico à coluna esquerda das páginas de lista de tópicos, bem como uma opção para exibir apenas o último postador na coluna padrão de postadores. O avatar do autor também pode ser redimensionado e ajustado em formato.
	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
	Novo em Temas do Discourse?	Guia para iniciantes no uso de Temas do Discourse

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 o formato 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 a coluna de avatares dos postadores exibir apenas o último (mais recente) postador, mas apenas se houver mais de um participante no tópico. Assim, o avatar do autor só aparecerá 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 estão habilitadas (ou seja: Categorias com tópicos mais recentes), e também há opções de tamanho e formato de avatar.

Há também uma alternância para alinhar verticalmente o conteúdo da linha no topo ou no meio.

Em visualizações de viewport pequeno (tamanho móvel), o autor aparecerá onde o avatar do último postador está.

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

Configurações

Captura de tela das configurações com 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 de avatar do autor nas rotas da página de lista de tópicos - pequeno, médio ou grande.
Raio de borda do avatar do autor na lista de tópicos	Arredondamento do avatar nas rotas da página de lista de tópicos: 0% = quadrado → 50% = círculo. tab_style = cantos arredondados à esquerda
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 linha verticalmente no topo	Alternância 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 do tópico na página de categorias	Tamanho dos avatares na coluna de avatar do autor nas listas de tópicos da página de categorias - pequeno, médio ou grande.
Raio de borda do avatar na página de categorias	Arredondamento do avatar na página de categorias: 0% = quadrado → 50% = círculo. tab_style = cantos arredondados à esquerda

Capturas de Tela

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

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

Com configurações padrão:

Formato de avatar tab_style grande com resumos de gists expandidos:

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

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

Capturas de tela da Página de Categoria mostrando 2 tamanhos e formatos 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 tab_style de tamanho grande e Show_author_on_categories_page desativado:

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

Com avatares de autor 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 que o 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 alternância para desativar no móvel?
• Exceções para categorias e tags?
• Suporte para direção da esquerda para a direita?
• Arredondar avatares de postadores?

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

---

Confira meus outros materiais 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]

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]

@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]

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]

@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ê.