I want to use the scss-version of bootstrap. So I copied all scss files of bootstrap in my styles folder of the project. I used the Import Stylesheet function from BSS (folder by folder, because subfolders aren’t imported automaticaly). My scss-main-file “bsmod.scss” imports a full version of bootstrap, so that the bootstrap.min.css import in the header is not needed.
How can I remove this bootstrap.min.css-import. The problem that other scss-files are imported in the header (they are coming from the imported scss folder) I’ve solved with the Include Order / Visibility function of BSS. But I had to create a dummy.html where all unwanted css-imports were placed. It is not possible to assign “no site” to a css file. Perhaps it is the wrong way to work with scss files in BSS, I don’t know …
Import a blank theme in settings, application, THEMES.
Then select the blank theme in settings, design, Bootstrap (Theme)
Now you will not have any conflict with the scss compiled version other than two issues assuming you have everything working correctly.
The svg url are sanitized so you will have to search all those out and repaste into a seperate folder so you see them in your design.
On export the link to the bootstrap.min.css will remain in all the head section (really not a issue though because its empty). Decide if you want to move the compiled export version to overwrite the blank with a simple batch copy rename or other options like python bsoup etc…
You should also consider recreating the whole structure again of the bootstrap scss so your changes are kept seperate from the main bootstrap compiled scss so when updates to Bootstrap Studio are made you can just update the main scss and not your changes. (Standard stuff though - right ?)
Ok, I imported an empty css file as Blank Theme. Selecting this theme will generate an empty bootstrap.min.css, so it works as described.
Regarding the original bootstrap scss files: These files are only imported in the projects styles folder, changes are only made in my own files which import bootstrap (like the minimal example above).
So this problem is solved.
If I am modifying the scss theme I load the blank theme. If I am not going to do any modifying I export and then reimport the scss theme. I then add a underscore to the start of the scss theme file so the BSS compiler no longer compiles it. Basically how one could do a final export before publishing.
@twinstream I would think you should be able to take that a step further and sets the visibility so that it’s not exported as well? I question it only because I don’t use Sass yet (I know getting left in the dust here lol), but worth a try I would think. No need to worry about exporting it then, yet you can still see the file classes in the editor if you open the file in BSS.
“SASS partials (.scss files that start with an underscore e.g. _xxx.scss ) are supposed to hold reusable mixins, variables and other code, so no xxx.compiled.css files are created for them”
Anything with a underscore is ignored by the compiler.
Before I imported the complete Bootstrap SCSS folder structure I had to use a file renamer program to add undescores to all the scss files so they would not be compiled but still imported as partials to the main bootstrap theme scss file. I am not sure if that is how @spechto has done it but it works for me. The visibility setting was something added since I had already learned how to do this, but I would think that would require adding a additional page for it to live on.
The use of the visibility settings requires a dummy page. So you can say use this scss file only in the dummy page. Because nearly all files in the bootstrap scss folders have a underscore as first char, you have only to rename three files (bootstrap.scss, bootstrap-grid.scss and bootstrap-reboot.scss) and change the filename in the @import statement to the new underscore version. So no dummy file is needed. This is the better solution.