Themes
Modals comes with a number of preset Themes you can choose from:
- Dark
- Light
- Automatic (Default Dark) PRO
- Automatic (Default Light) PRO
- Classic PRO
You can override the Theme you choose in the {modal} tag, like:
{modal ... theme="light"}
Here are also some examples per theme.
Dark
Text, Article, External page, images, Video
Gallery:
Light
Text, Article, External page, images, Video
Gallery:
Automatic (Default Dark)
This follows the dark/light setting of your OS. If the OS does not support this, the Dark theme is used.
Test this by switching the dark/light setting on your computer.
Text, Article, External page, images, Video
Gallery:
Automatic (Default Light)
This follows the dark/light setting of your OS. If the OS does not support this, the Light theme is used.
Test this by switching the dark/light setting on your computer.
Text, Article, External page, images, Video
Gallery:
Classic
Text, Article, External page, images, Video
Gallery:
Custom Styling
You can override styles via template CSS overrides. How to override the CSS files, can differ depending on the template you use. So you might need to ask your template developer for support on that.
Here is the information Joomla provides for the standard way:
https://docs.joomla.org/Understanding_Output_Overrides#Media_Files_Override
You can check the CSS files that come with Modals to see how to style things (see the media/modals/css and media/modals/scss folders).
Custom Theme
You also have the ability to choose the 'Custom' theme. This will result in pretty much no styling at all. And you will need to override the custom.css (and custom.min.css) file via your template.
Only use this option if you fully understand how CSS works and you know what you are doing.