X-Icon Sizes?

I see that X Theme blocks traditional Font Awesome icon codes and instead uses its own shortcodes. I’m not seeing any way of increasing the size of the icon using the shortcode like adding 2x or 3x, etc. to the traditional codes. What do I need to add to the shortcode to make it bigger?

Hey,

To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

When you hover over each team member, there is a Steam icon. Using traditional Font Awesome icons, I am able to easily change the size, however it only shows up in Cornerstone and not on the actual page. I don’t see anything in the X documentation on changing the built-in Font Awesome sizes.

Hi There,

You can assign a CLASS to your icon shortcodes:

e.g.

[x_icon type="steam" class="custom-icon"]

And then use that class to style the icons with custom CSS.

.custom-icon {
	font-size: 2.5em;
	margin-right: 0.5em;
	color: red;
}

Feel free to adjust the values where you see it fits.

Hope it helps,
Cheers!

1 Like

That worked very well, thank you!

Glad to hear it!