Change SCSS for child of Boost Theme

Change SCSS for child of Boost Theme

by Pixii Bomb -
Number of replies: 2
Hello, I just started a project last week that is using Moodle, so pardon my lack of Moodle developer knowledge; I've just barely dipped my toes into this pool.

I noticed the Boost theme uses Bootstrap; and naturally I want to customize the palette for the child theme in the source code, not on the front-end options. (Specifically I want to change certain variables for the color palette, various default styles for components, etc)
I've found a couple of tutorials, that explain a few options that need to be added to settings.php, config.php and lib.php - but every combination of tutorial I've come across just does not work. It usually results in the moodle site loading properly, but without ANY css applied at all. I have also checked the browser console and don't see any errors or notifications related to unloaded css.

I'm using Moodle version 4.2 if that makes a difference.
All of the tutorials I've seen so far are using Moodle version ~3.8, and the Boost theme in those videos looks slightly different than the one I'm seeing. So perhaps something changed?
Average of ratings: -
In reply to Pixii Bomb

Re: Change SCSS for child of Boost Theme

by Joanna Beaver -
Picture of Plugin developers
Hello

Unsure of how much you want to change it but you might be able to get away with just using a preset file in the installed Boost theme (as opposed to building a child). Its been a while since I used one but it seems to still be an option available in 4.2.

https://docs.moodle.org/dev/Boost_Presets

Best wishes

Jo
In reply to Joanna Beaver

Re: Change SCSS for child of Boost Theme

by Pixii Bomb -
Hey thanks for the reply.
I looked into that documentation and it looks like the purpose is to upload the preset in the Admin Settings (the front-end admin dashboard). But I'm looking more for a back-end source code solution.

I think I was just misreading some of the documentation for the Boost theme, thinking that maybe you could make scss files that got compiled with the parent's scss files and then propagated to the Bootstrap css files. But I think I was mistaken or misinterpreted that information.

So I wound up just doing the regular 'ol Bootstrap css override with css variables; and that worked out perfectly fine!