In Joomla, it is relatively easy to create CSS overrides. If you would like to change the color of the Invalidate Cache button, you can read on.
How to create a CSS override in Joomla 4 Administrator (Atum - Template)?
Joomla is built with the intention of user customization of how it looks. CSS customization in Joomla 3 is slightly different than in Joomla 4. I will show how to create a CSS override for the "Invalidate Cache" module in Joomla 4 Administrator Template Atum. You can read my Invalidate Cache Module review.
written in the file "custom.css"-file under "templates/[templatename]/css/", however the path to the CSS files in Joomla 4.1+ was changed to "media/templates/[site]/[templatename]/css/" and the file is called "user.css". This CSS override is written for Joomla 4+, but it will likely work also in Joomla 3. The recommended module position for Invalidate Cache is "status", putting it on the top.
1. Go to System Administrator Templates Atum Details and Files
Joomla 4 left menu
Select "System" from the left menu.
Joomla 4 select "Administrator Templates."
What are the differences between "Administrator Templates" and "Administrator Template Styles"?
The difference between Administrator Templates and Administrator Template Styles is that the overrides for the Template that is put on the Administrator Templates place, here you put all your customization of the site. The Styles are set in the separate Administrator Template Styles, which you only use to change the site's primary colors and put things like a custom logo and the template's name.
Select the "Administrator Template" to go into the area for creating overrides of Joomla 4.
Click on "New File" on top to create the "user.css"-file (Skip this step if you already have created the "user.css"-file)
Here you choose what folder to put the override files in. This is the same for both Frontend and Administrator Templates.
Here you create the files for any overrides. For the CSS create a file called "user" and select ".css" as the File Type
Write the CSS code like this in the editor
.js_modInvalidatecach {
background-color: #ff0000;
}
- LET ME KNOW IF YOU KNOW ANY OTHER WAYS TO DO THIS IN THE COMMENTS BELOW -
