Change menu icon design

Hello there,

We want to change the menu design from this

https://prnt.sc/DU3LZsSH5EAG

to this

https://prnt.sc/MTPX4_0B5dAQ

[Luke Nielsen]

Hello,

Try to use the code below:

.wd-header-cats {
    display: flex;
    align-items: center;
}

.wd-header-cats.wd-style-1 .menu-opener {
    border-radius: 35px 35px 35px 35px !important;
    min-width: 200px !important;
    padding: 10px 8px !important;
    max-height: 50px;
}

.wd-header-cats .menu-opener-icon:not(.custom-icon):after {
    background-color: #fff;
    color: #1d61e7 ;
    padding: 10px;
    border-radius: 50%;
}

Define it in Theme Settings -> Custom CSS.

Kind Regards

• This reply was modified 1 year, 11 months ago by Luke Nielsen.
• This reply was modified 1 year, 11 months ago by Luke Nielsen.

I added the code,

it’s showing like this https://prnt.sc/TaHd53AV3y3s

Hello,

Replace the old code with the edited above.

Thank you for your time.

Kind Regards

Hello,

Thanks for fast response, please check the difference

Thanks for fast response, please check the difference

Attachments:

You must be logged in to view attached files.

Hello,

Replace the old code with the below one:

.wd-header-cats {
    display: flex;
    align-items: center;
}

.wd-header-cats.wd-style-1 .menu-opener {
    border-radius: 42px 42px 42px 42px !important;
    min-width: 165px !important;
    padding: 10px 3px !important;
    max-height: 40px;
}

.wd-header-cats .menu-opener-icon:not(.custom-icon):after {
    background-color: #fff;
    color: #1d61e7 ;
    padding: 10px;
    border-radius: 50%;
}

body .wd-header-cats .menu-opener-icon:not(.custom-icon):after {
    padding: 8px;
}

https://take.ms/L4Vcx

Kind Regards

[Author]

Posts