Changing theme icons
Hi, is it possible to change icons in a theme?
I am using Decorous and I see several options but not that one.
I would like to have Ocean icons (coloured) into Decorous
-
- · Will Roberts
- ·
You can change the icons by checking out Oceans icons settings and replacing your websites with Oceans settings
-
- · David Medina
- ·
I tried it but configuration theme only in Decorous let change the colour to all icons at same time (i.e all in green or all in orange) and I need to have all the colours as seen in Ocean.
-
-
·
Alex T⚜️
- ·
To give menu icon a different color in template where all icons have the same color add sys-colored class to Icon field in menu builder, for example:
-
·
Alex T⚜️
-
When you have a missing menu icon, in particular Notifications_DJ where can you find the exact place of where to set that and where do you find the matching default icon to match the style of the existing ones?
-
-
Ok Alex T⚜️ I set "home col-gray-dark sys-colored" in HOME icon
but it remains in the color of the theme
I cleared cache and I tested it in a new session in Incognite window to avoid cache conflicts.
-
Thank you for the report, some templates override icons color, so it isn't working everywhere, we'll make `sys-colored` class to work in UNA templates in next major update - https://github.com/unaio/una/issues/2974
For a while you can override icons color via custom css styles, for example:
.bx-menu-item .posts-home .sys-icon { color:red !important; }
-
- · David Medina
- ·
Ok Alex T⚜️ thanks for create the issue.
To do it via custom css styles I have 2 questions:
- I need to create a CSS in "CUSTOM STYLES" in Decorous ? or what's the site in Studoi to do it
2. I see that the class of CSS class of that icon in lateral menu is
sys-icon home col-gray-dark sys-colored
and not .bx-menu-item as you mentioned
Is that the right class to Home icon example?
-
"CUSTOM STYLES" in Decorous is correct place for this custom CSS rule.
For your case custom CSS should look like this:
.bx-menu-floating-blocks-icon .sys-icon.home { color:red !important; }
-
- · David Medina
- ·
It works, thansk Alex T⚜️ !