I'm trying to add CSS snippets to specific icons rather than globally (e.g. changing the colour of an svg icon).
Using the chrome inspector, I was able to find that the aria-label was set to the icon name, and I could use css like this:
.isc-icon.isc-ra[aria-label="ra diamonds"] > svg { fill: purple; }
This nicely gives me a purple diamond icon in edit mode at least.
But for callouts in edit mode, or anywhere in read mode, the aria-label is not set, so the CSS stops working.
It would be incredibly useful to be able to target css to specific icons, instead of being limited to applying styles to an entire icon pack.
I'm trying to add CSS snippets to specific icons rather than globally (e.g. changing the colour of an svg icon).
Using the chrome inspector, I was able to find that the aria-label was set to the icon name, and I could use css like this:
.isc-icon.isc-ra[aria-label="ra diamonds"] > svg { fill: purple; }This nicely gives me a purple diamond icon in edit mode at least.But for callouts in edit mode, or anywhere in read mode, the aria-label is not set, so the CSS stops working.
It would be incredibly useful to be able to target css to specific icons, instead of being limited to applying styles to an entire icon pack.