Como inverter a posição do avatar para ficar na frente do texto do tópico?

Suporte
2

Olá e bem-vindo ao Discourse!

Esta é uma coisa enganosamente difícil de fazer: usa um elemento de tabela e não é simples mudar a ordem sem alterar a estrutura real do HTML. E mudar a estrutura significaria essencialmente substituir o componente pelo seu próprio template, o que eu não recomendo tentar de forma alguma.

Eu dei uma olhada rápida e é um tanto possível com CSS puro, mas não é uma implementação muito robusta.

Caso queira tentar:

.topic-list-item {
    position:relative;
}

.topic-list .posters {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    max-width: 150px;
    overflow: hidden;
    display: block;
    box-sizing: border-box;
    height: auto;
}

.topic-list .topic-list-data:first-of-type {
    padding-inline-start: 150px;
}

Sugiro que você limite o escopo para desktop!

1 curtida