Opus writes no hard-coded style: colours, spacing and shapes come from the template. When a layout needs fine tuning, the Custom CSS tab gives a stylesheet of its own to the module, and everything you need to write it right.
This module's stylesheet
The rules written here go into the page head. They are global: prefix them with a class specific to this module so that they touch it alone, for example the one you give it in the Advanced tab.
.home-activities .opus__carte { border-color: #ccc; }Never use !important: if a rule from another extension wins, remove its cause rather than piling another one on top.
The classes produced
The Classes produced panel lists the classes this layout actually writes, and only those. A click on a name copies it and shows its rules. Each class carries its colour:
- Yours: specific to the module, can be changed with no effect elsewhere;
- Corpus: shared with articles and other modules. Changing it moves things elsewhere on the site;
- Bootstrap: delivered by Joomla to the whole site. Do not change it here.
To style a shared class without touching the rest of the site, Copy under another name creates a copy of your own. Write the CSS places the empty rule in the stylesheet, ready to fill in.
The class catalogue loads the first time the tab is opened: it does not slow down the opening of the module.
A complete, commented example goes into the stylesheet in one click: it is the best starting point.
Orphan rules
When a rule in your stylesheet targets a class the module no longer uses, Opus flags it. These rules do no harm, but they clutter: Remove these rules tidies up.
Classes and colours elsewhere in Opus
Before writing CSS, look at the settings: a row, an element and a bar line carry a Class behind their cog, and key figures, bars, statuses and timeline markers already offer a colour taken from the template. Those colours follow dark mode on their own.
The gauge
Joomla stores all of a module's settings in a single field, limited to 64 KB. The tab's gauge shows how full the module is, counting only what is actually saved: Opus saves neither empty settings nor those left at their default value. Texts, settings and CSS share the same space. When it nears full, Opus warns you: beyond that, the end of what you type would not be saved. Shorten your texts, or split the layout into two modules.
A complete layout usually weighs around a dozen kilobytes: the gauge is rarely needed, but it matters when it is.
Up to date for Opus 1.5.930.