-
-
Using “Service Small Icon,” I would like for the icon to link to the same URL as the title. I have found the lines in services_small.php to which I can add the … tags. I changed…
<span class=”Apple-tab-span” style=”white-space: pre;”> o</span>ld: $output .= ‘ <dt>’;
<span class=”Apple-tab-span” style=”white-space: pre;”>n</span>ew: $output .= ‘ <dt>’.’‘;
and…
<span class=”Apple-tab-span” style=”white-space: pre;”> o</span>ld: $output .= ‘ </dt>’;
<span class=”Apple-tab-span” style=”white-space: pre;”> n</span>ew: $output .= ‘ </dt>’;
However, I would also like for the icon to color-invert on hover, just like the “Service Circle Icon” element does. I’ve tried to figure out within the “Service Circle Icon” CSS how to do this, but I haven’t figured it out. Can you please let me know how I can make each “Service Small Icon” icon work like each “Service Circle Icon” does on hover?
-
-
Hello,
Please add this code into your custom cs sbox:
.services_small dt i:hover { color: #8b2fef !important;} .services_small .wrapper:hover { border: 1px solid #8b2fef !important;}
Change the color to your wish.
Best regards!
-
Brilliant, thank you :-)
However, could you help me invert the colors like with the “Service Circle Icon”—so that on hover, the blue image turns white and the white background turns blue?
-
Ah, got it!
.services_small dt i:hover { color: #ffffff !important; }
.services_small .wrapper:hover { border: 1px solid #ffffff !important; background: #2fa2ef !important; }
Thank you again for all your help.
-
You must be logged in to reply to this topic.