Olá, comunidade!
Recentemente instalei o Discourse e quero personalizar a aparência.
Mas não sei como selecionar grupos de seções com recuos em relação a outras seções, nem como criar uma lista de subseções em uma única coluna.
Verifiquei as configurações no painel de administração, mas não encontrei nada semelhante que pudesse me ajudar.
Ficarei grato por qualquer ajuda.
Recentemente comecei a estudar esta plataforma.
Obrigado!
Por exemplo, para transformar uma lista de subseções em uma única coluna, preciso alterar os valores aqui (category-list.scss)
Para estes valores
Mas como posso fazer isso corretamente pelo painel de administração, sem alterar os arquivos diretamente no servidor?
display: block;
align-items: baseline;
margin-right: 0;
Essa é a CSS padrão para subcategorias. Basta atribuir uma “Categoria Pai” no diálogo de edição da categoria e definir a subcategoria e a categoria pai com a mesma cor.
Não entendo muito bem o que a cor tem a ver com isso.
Por padrão, as subcategorias são exibidas da seguinte forma: uma após a outra, horizontalmente
Após aplicar o CSS que especifiquei acima, as subseções se alinham em posição vertical, como eu queria.
Eu só queria saber: adicionar CSS na forma que indiquei — por meio do painel de administração — é o caminho correto?
E a segunda pergunta principal é: como fazer com que as próprias seções fiquem separadas umas das outras por recuos, como no exemplo da captura de tela do fórum da Amazon?
Ah, entendi.
O correto é colocar esse CSS em um componente de tema, o que é apenas ligeiramente diferente do que você está fazendo!
Se você editar o tema Claro, as alterações não serão visíveis no tema Escuro.
Crie um único componente de tema para todas as suas customizações locais do site!
Obrigado pelo conselho sobre o que é melhor alocar como componentes.
Se falarmos de um exemplo específico Amazon - não se trata apenas de CSS, a marcação deles também difere da padrão (HTML).
Como organizar rapidamente a mesma exibição?
Infelizmente, tenho um conhecimento superficial de layout, pois sou desenvolvedor backend, então layout é difícil para mim.
Posso transferir esse layout sem alterar o código dos próprios arquivos de origem?
Olhei por muitas temas prontos diferentes
Mas a maioria deles é semelhante entre si, e um tão conciso quanto o Amazon não foi encontrado. Talvez possamos fazer isso juntos com a comunidade? Parece mais conciso com recuos entre as seções
A marcação deles é diferente parcialmente porque parece que não atualizaram o site há bastante tempo.
Adicionar este CSS te leva grande parte do caminho em relação ao estilo de subcategoria…
.category-list .subcategories .subcategory {
display: flex;
}
Se você quiser fazer alterações na marcação, terá que começar a investigar como funcionam as substituições de modelo no Discourse… isso está na seção avançada do Guia do Desenvolvedor para Temas do Discourse