I think this question should go into a forum or maybe in discussions.

Like many other templates Cassiopeia has the CSS rules it needs in template.css. Because users could use Bootstrap components also these.

Cassiopeia uses its own CSS for grid styling. https://github.com/joomla/joomla-cms/blob/4.2-dev/build/media_source/templates/site/cassiopeia/scss/blocks/_css-grid.scss

What are the methods of solution, please tell me.

Compile a custom template.css via SASS/SCSS. Insert there the wanted bootstrap-grid parts. Remove the bootstrap parts you don't want.

Or compile/write a custom template.css without bootstrap parts. And include media/vendor/bootstrap/css/bootstrap-grid.css and/or bootstrap.css via Web Asset Manager (see joomla.asset.json).

Bootstrap scripts don't load all at once and we are offered a choice, to connect only what is needed. And here styles are connected all at once, where is the choice here? That's about 14,000 lines. I only need a grid, which is 3 times less. And to connect what you need, you need to go in incomprehensible ways. How to do it is just not clear yet.If I'm not mistaken, there are no clear instructions in the documentation.

Compile a custom template.css via SASS/SCSS. Insert there the wanted bootstrap-grid parts. Remove the bootstrap parts you don't want.

When updating Joomla, this file will most likely be overwritten, right?

Or compile/write a custom template.css without bootstrap parts. And include media/vendor/bootstrap/css/bootstrap-grid.css and/or bootstrap.css via Web Asset Manager (see joomla.asset.json).

Why connect bootstrap.grid again in user.css, if these styles will be connected in the full version in template.css?

Where do Bootstrap styles come from in the template.css file? If I'm not mistaken, they are copied from \media\vendor\bootstrap\css\bootstrap.css. The task is to make sure that only those files that are needed are copied to template.css, for example \media\vendor\bootstrap\css\bootstrap.grid.css

Where do Bootstrap styles come from in the template.css file?

template.css will be build whenever a new Joomla release gets build. The source SCSSs can be seen here: https://github.com/joomla/joomla-cms/tree/4.2-dev/build/media_source/templates/site/cassiopeia/scss

When updating Joomla, this file will most likely be overwritten, right?

You could use a child template. But I don't know if joomla.asset.json can be overridden their. Not tested yet.

in user.css

I didn't talk about user.css. I talked about joomla.asset.json and Web Asset Manager (WAM). Their you can control dependencies like "When component modal is loaded (JS) then load also my custom modal.css".

There are several files joomla.asset.json in Joomla that control asset loading, also one for the Bootstrap assets. See media/vendor/joomla.asset.json. You can override these asset rules in your template's joomla.asset.json.

If I'm not mistaken, they are copied from \media\vendor\bootstrap\css\bootstrap.css.

No. See above.

Provide a pr if you think you have a better and more performant way to load assets for Cassiopeia and Bootstrap.

Their are several files joomla.asset.json in Joomla that control asset loading, also one for the Bootstrap assets. See media/vendor/joomla.asset.json. You can override these asset rules in your template's joomla.asset.json.

It's not clear to me here, I opened this file joomla.asset.json and see styles written there:

{ "name": "bootstrap.css", "type": "style", "uri": "vendor/bootstrap/bootstrap.min.css", "package": "bootstrap", "version": "5.1.3" }, { "name": "bootstrap.css.grid", "type": "style", "uri": "vendor/bootstrap/bootstrap-grid.min.css", "dependencies": [ "bootstrap.css" ], "package": "bootstrap", "version": "5.1.3" },

But it only connects bootstrap.css, How do I make sure that only one of the necessary ones is connected?

How do I make sure that only one of the necessary ones is connected

Please ask in a forum how one works with Web Asset Manager and which possibilities you have overriding asset rules or defining custom ones in joomla.asset.json of your templates or extensions. You also can block loading of unwanted assets and/or replace them by your own asset rules. Check Cassiopeia and its index.php , joomla.asset.json how WAM fundamentally works. Then start fiddling with uri and dependencies . That's how I've learned it.

Roger, over and out from my side in this issue.

and in:

• Example for overriding jquery script path of Joomla core in a template: https://github.com/GHSVS-de/tpl_bs4ghsvs/blob/2022.10.10/dist/joomla.asset.json#L66-L71
• Example for blocking completely loading of button.js: https://github.com/GHSVS-de/tpl_bs4ghsvs/blob/2022.10.10/dist/joomla.asset.json#L101-L108
• Defining an asset rule doesn't mean that these files are loaded. They are loaded when you instruct WAM to load it.

and out.

Thanks for the answer, I'll figure it out....

Closing the issue as it seems to be no issue