Les thèmes et les composants de thème deviennent de plus en plus puissants, et les développeurs deviennent de plus en plus ambitieux. Pour faciliter les choses aux développeurs, les thèmes peuvent désormais diviser leur SCSS en plusieurs fichiers.
Lors de la création d’un nouveau thème avec le theme CLI, ou lors du partage d’un thème sur github, créez simplement un nouveau dossier nommé scss. Remplissez-le avec vos fichiers .scss, en suivant n’importe quelle structure de dossier, et tous les fichiers seront disponibles pour être importés dans les sections SCSS communes / bureau / mobile de votre thème.
Par exemple, si vous souhaitez qu’une variable commune soit disponible pour le SCSS mobile et bureau, vous pouvez faire quelque chose comme ceci :
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;
}
Cette fonctionnalité a été ajoutée dans v2.3.0.beta8, donc n’utilisez pas ces fonctionnalités pour le moment si vous devez maintenir une rétrocompatibilité avec les anciennes versions de Discourse. Vous pouvez utiliser le paramètre minimum_discourse_version de about.json pour vous assurer que votre composant n’est pas utilisé sur une version antérieure.
Ce document est contrôlé par version - suggérez des modifications sur github.