Sharing block icons different from the theme module

Hello @doctorbr

It’s a simple design decision, nothing too special. You can further adjust these icons as you need using CSS, as the system is developer-friendly. ??

Thanks.

Hello, @cteduard

I used the CSS code below to change from “square” to “rectangular” and I hope it’s ok!

[data-icons-type*="square"] .ct-icon-container {
	width: initial;
	height: initial;
	padding: 10px 25px;
	border-radius: 3px;
}

But now I need to change the proportion of the logo, as it is too small!

Do you have CSS code for this?

Thank you very much for all the technical support so far. ??

Hello @doctorbr

I see, but as you already know, our support policy does not provide assistance for implementing, modifying or debugging custom code.

But as a little hint, perhaps you can try targeting the [data-icons-type*="square"] .ct-icon-container svg selector to modify the icon itself. However, I’m not sure why you wouldn’t use the built in size controls. In the end 8px is small and will produce a small icon. ??

Thanks.

Thanks, @cteduard

My intention is to improve the proportion between the background and the logo. And since the integrated control increases everything at once, I need specific CSS code for the “f” in Facebook, for example.

If you don’t know how, I’ll leave it set to 15px…

Thanks in advance!

Hello @doctorbr

I understand what you’re trying to achieve, but we also have to follow our support policy which does not provide assistance for implementing any additional code besides what’s available in the Customiser as options to modify. I would really recommend to contact a knowledgeable developer if you require assistance with implementing custom code outside of what’s already provided.

As a one time courtesy, I’ll give you the specific selector.

The final selector (at least what I see from your screenshots) should be –

.ct-share-box[data-type=type-2] .ct-icon-container svg {
    width: 200px;
    height: 200px;
}

Which should work as expected – https://ibb.co/Y2JwT8s

Thanks.

@cteduard,

Forgive me for not being able to explain what I mean. ??

I want to adjust the Share Box icons to a maximum of 15px, however, at this size, the logos (f, X, T, W) are too small (disproportionate).

But, like I said, if it’s not possible, that’s OK! I’ll leave it at 15px. ??

Thank you very much for always being so polite. ??

Hello @doctorbr

No need to be sorry. However, did you try the selector that I have previously provided? It should work for changing just the SVG icon. ??

Thanks.

It didn’t work for me. ??

The selector doesn’t just change the SVG icon.

But like I said, I’m glad I changed it from “square” to “rectangular”. ??

Thank you very much for helping. ??

• This reply was modified 11 months, 2 weeks ago by doctorbr.

Would you happen to have a live URL that I could check? I’ll try to personalise a snippet for you

Still in production via WampServer (LocalHost).

But like I said, I’m happy with what I have (15px rectangular icon). ??

Thank you very much. ??