Change widget icon & re-size - top right of top bar header

[collectthatcomic]

Hi Guys

I’m using X Theme & Ethos.

I have enabled the widget area in the top bar, I would like to change the icon from a + to this [x_icon type=“search”].

I would then like to increase the size of the triangle - so my customers can see it clearly is a search area.

I’ve read conflicting ways of doing this - so thought I’d ask the experts!

Website is www.uncannycollectibles.com

[Prasant]

Hello @collectthatcomic,

Thanks for asking.

Please add following CSS under X > Launch > Options > CSS to change widget bar icon:

.x-btn-widgetbar .x-icon-plus-circle:before {content: "\f002"; font-size: 1.25em; color: #fff;}

Thanks.

[collectthatcomic]

@Prasant

.x-btn-widgetbar .x-icon-plus-circle:before {content: “\f002”; font-size: 1.25em; color: #fff;}

Thank you! This worked, is there a way to make the pink triangle a little bitter - when I change the 1.25em it’s changing the icon size -

[nabeel]

Hi again,

To make the triangle bigger, add this code in your Customizer:

.x-btn-widgetbar {
    border-top: 25px solid #333;
    border-left: 25px solid transparent;
    border-right: 25px solid #333;
    border-bottom: 25px solid transparent;
}

Feel free to adjust 25px if needed. Hope this helps!

[collectthatcomic]

@collectthatcomic

.x-btn-widgetbar .x-icon-plus-circle:before {content: “\f002”; font-size: 1.25em; color: #fff;}

Hi again

The code appears to have stopped working! The magnifying glass was appearing & now is not. The lastest piece of code for the triangle has no effect.

Here’s what I’ve input into the custom CSS

/* CHANGES THE ICON FROM A PLUS TO SEARCH IN TOP NAV BAR HEADER WIDGET RIGHT CORNER*/
.x-btn-widgetbar .x-icon-plus-circle:before {content: “\f002”; font-size: 1.25em; color: #fff;}

/* changes size of pink triangle */
.x-btn-widgetbar {
border-top: 30px solid #333;
border-left: 30px solid transparent;
border-right: 30px solid #333;
border-bottom: 30px solid transparent;
}

Any ideas? As it’s stuck back in the same way as it was - with the small plus & no changes to the size of the triangle

Thanks!

[thai]

Hi There,

Could you please provide us with your admin account so we can take a closer look?

Thanks.