Os temas e componentes de tema estão se tornando cada vez mais poderosos, e os desenvolvedores estão ficando cada vez mais ambiciosos. Para facilitar as coisas para os desenvolvedores, os temas agora podem dividir seu SCSS em vários arquivos.
Ao criar um novo tema com o theme CLI, ou compartilhar um tema no github, simplesmente crie uma nova pasta chamada scss. Preencha-a com seus arquivos .scss, seguindo qualquer estrutura de pasta, e todos os arquivos estarão disponíveis para você importar nas seções SCSS comuns / desktop / mobile do seu tema.
Por exemplo, se você quiser ter uma variável comum disponível tanto para o SCSS móvel quanto para o de desktop, você pode fazer algo como isto:
scss/my-folder/variables.scss
$favourite-color = red;
desktop/desktop.scss
@import "my-folder/variables";
body {
background-color: $favourite-color;
}
mobile/mobile.scss
@import "my-folder/variables";
body {
color: $favourite-color;
}
Este recurso foi adicionado no v2.3.0.beta8, então não use esses recursos ainda se precisar manter a compatibilidade com versões anteriores do Discourse. Você pode usar o parâmetro minimum_discourse_version do about.json para garantir que seu componente não seja usado em uma versão anterior.
Este documento tem controle de versão - sugira alterações no github.
When converted to a stand-alone theme the background colour will be green, but when used as a component within another theme it doesn’t change the background colour at all.
A configuração do tema possui uma estrutura de arquivos padrão e eu adicionei scss/test.scss. Em seguida, declarei @import "test";.
No console (usando discourse_theme watch), recebo: ✘ Erro no SCSS comum: Erro: Arquivo para importação não encontrado ou ilegível: test. na linha 1 de common.scss
Declarada apenas uma variável (a propósito, há um erro de digitação no primeiro bloco de código acima, declarada com sinal de igual: $favourite-color = red;)
Mas acabei de resolver. Defini a versão mínima em about.json como v2.3.0.beta8 e, ao removê-la, funciona perfeitamente. Nunca usei isso antes, então não sei o que está errado com a declaração.
Interessante! Se você adicionar a versão mínima novamente, o problema ocorre consistentemente? Se sim, você se importaria de compactar o tema com o erro e compartilhá-lo aqui? (ou enviar por mensagem privada para mim)
Como dito, eu nunca defini uma versão mínima antes. Então, eu apenas a copie acima como v2.3.0.beta8. Isso falha, mas 2.3.0.beta8 funciona perfeitamente.