Home › Forums › WoodMart support forum › Hover color on sticky menu

Hover color on sticky menu

Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • August 29, 2020 at 12:09 am #222008

    Mishkat
    Participant

    Hello,

    On my sticky menu, when I hover over the sub menu, the colour goes white and I can see the main menu text. See picture attached.

    This is the code I have so far…

    .whb-sticked .whb-row.whb-general-header {
    background-color: #ffffff;
    }

    /*sticky main menu color*/
    body .whb-sticked .woodmart-navigation .item-level-0.current-menu-item>a{
    color:black;
    }
    body .whb-sticked .woodmart-navigation .item-level-0>a{
    color:black;
    }
    body .whb-sticked .woodmart-navigation .item-level-0>a{
    color:black;
    }
    body .whb-sticked .woodmart-navigation .item-level-0>a:hover{
    color:black;
    }
    body .whb-sticked .woodmart-navigation .item-level-0.menu-item-has-children>a:after{
    color:black;
    }
    body .whb-sticked .woodmart-navigation .item-level-0.menu-item-has-children:hover >a:after{
    color:black;
    }
    body .whb-sticked .woodmart-navigation .item-level-0>a .nav-link-text:after {
    background-color: #007CFF;
    }

    /*sticky*/
    body .whb-sticked .woodmart-burger-icon .woodmart-burger {
    color: black;
    }
    /*default*/
    body .woodmart-burger-icon .woodmart-burger {
    color: white;
    }

    Attachments:
    You must be logged in to view attached files.
    August 29, 2020 at 7:36 am #222042

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    I saw the screenshot you attached. Please provide the URL of the website to check it myself and help you out accordingly.

    Because without seeing the issue I am unable to suggest you with any solution.

    Best Regards.

    August 29, 2020 at 12:47 pm #222103

    Mishkat
    Participant

    You can go here: https://dekode.ca

    First scroll down and then go to the drop down menu. Important to scroll down because the menu colour on the top is white as it is so you won’t see the issue.

    August 31, 2020 at 6:12 am #222298

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    I have visited your website. You have set the hove color to white and the background color of the sticky header is also white that’s why its not displaying on hover.

    Screenshot for Clarification: https://ibb.co/p17KXZ2

    Please try changing the color on hover. Then Clear cache and check back.

    Best Regards.

    August 31, 2020 at 7:55 pm #222540

    Mishkat
    Participant

    So what code do I type in? The screen shot you sent is incorrect. Scroll down then hover over a drop down menu and then see.

    September 1, 2020 at 7:20 am #222627

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    Please try adding the following Custom CSS in the Global Custom CSS area under Theme Settings >> Custom CSS.

    body .whb-sticked .woodmart-navigation .item-level-0>a:hover {
color: black !important;
}

    Regard’s.
    Xtemos Studio.

    September 1, 2020 at 1:23 pm #222752

    Mishkat
    Participant

    This doesn’t resolve the issue. See the video please.

    September 1, 2020 at 1:24 pm #222754

    Mishkat
    Participant

    Video didnt attach. Here’s the link to the video..

    https://www.dropbox.com/s/q9hircukuwn85pn/Recording.mov?dl=0

    September 2, 2020 at 6:13 am #222920

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    I watched the video you attached.

    Please remove all the code you previously added for the sticky header then clear the cache and check back.

    And then explain in detail what you require for the menu items in the sticky header to check it myself and help you out accordingly. Because what you added is causing the issue.

    Best Regards.

    October 2, 2020 at 1:42 pm #230486

    Mishkat
    Participant

    This is what I need:

    – I have the overlapped menu which is fine, but the default colour for the sticky background is dark and I want white instead.
    – So after adjusting the sticky background colour to white, we also have to add a code so that the text is dark instead of white as the text is white by default because of the default dark background.

    October 3, 2020 at 8:28 am #230621

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    Please try adding the following Custom CSS in the Custom CSS for Desktop area under Theme Settings >> Custom CSS.

    .whb-sticked .whb-color-light .navigation-style-underline .item-level-0:hover>a {
color: green;
}

    You can set the color according to your needs.

    Best Regards.

    October 5, 2020 at 3:50 am #230855

    Mishkat
    Participant

    Thank you. It worked for me.

    October 5, 2020 at 6:01 am #230874

    Aizaz Imtiaz Awan
    Keymaster

    Most Welcome!!!.

    I’m so happy to hear you are pleased with the Theme and Support. XTEMOS strives to deliver the best customer experience, and it makes our day to hear we have accomplished that.

    We count ourselves lucky to have you as a customer. You can always reach us at any time. We are always here to help you.

    Thanks for contacting us.
    Have a great day.

    Topic Closed.
    Best Regards.

  • Author
    Posts
Viewing 13 posts - 1 through 13 (of 13 total)

The topic ‘Hover color on sticky menu’ is closed to new replies.