Home Forums WoodMart support forum Main menu color sticky header after scrolling

Main menu color sticky header after scrolling

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #485039

    chiarelliarreda
    Participant

    Dear Staff,

    I want change from white to black my main menu in sticky header after scrolling cause the background is white.

    Feedback: the sticky personalization is not optimized cause there are few option, will be useful if there are many options for stiky in header builder so we can not going in CSS option.

    #485098

    Hello,

    Please add this code to the Theme Settings > Custom CSS > Global:

    /*sticky background*/
    body .whb-sticked .whb-general-header {
        background-color: white;
    }
    /*sticky main menu color*/
    body .whb-sticked .woodmart-navigation .item-level-0.current-menu-item>a{
    color:yellow;
    }
    body  .whb-sticked  .woodmart-navigation .item-level-0>a{
    color:yellow;
    }
    body  .whb-sticked  .woodmart-navigation .item-level-0>a{
    color:orange;
    }
    body  .whb-sticked  .woodmart-navigation .item-level-0>a:hover{
    color:yellow;
    }
    body  .whb-sticked  .woodmart-navigation .item-level-0.menu-item-has-children>a:after{
    color:orange;
    } 
    body  .whb-sticked  .woodmart-navigation .item-level-0.menu-item-has-children:hover >a:after{
    color:yellow;
    } 
    body  .whb-sticked  .woodmart-navigation .item-level-0>a .nav-link-text:after {
        background-color: yellow;
    }
    
    /*My Account*/
    body  .whb-sticked  .woodmart-header-links .item-level-0>a {
        color: orange;
    }
    body  .whb-sticked  .woodmart-header-links .item-level-0>a:hover {
        color: yellow;
    }
    /*Search*/
    body  .whb-sticked  .search-button >a {
        color: orange;
    }
    
    body  .whb-sticked .search-button:hover>a {
        color: yellow;
    }
    /*wishlist*/
    body  .whb-sticked  .woodmart-wishlist-info-widget .wishlist-icon {
    color:orange;
    }
    body  .whb-sticked .woodmart-wishlist-info-widget .wishlist-count{
        color: red;
            background-color: yellow;
    }
    /*cart*/
    body  .whb-sticked  .woodmart-shopping-cart .woodmart-cart-icon {
    color:orange;
    }
    body  .whb-sticked  .woodmart-cart-design-5 .woodmart-cart-number{
        color: red;
            background-color: yellow;
    }
    body  .whb-sticked  .woodmart-shopping-cart .woodmart-cart-subtotal .amount {
        color: red;
    }
    /*compare*/
    body  .whb-sticked  .woodmart-compare-info-widget .compare-icon {
    color:orange;
    }
    body  .whb-sticked  .woodmart-compare-info-widget .compare-count{
    color:yellow;
    background-color:orange
    }
    body   .whb-sticked  .woodmart-cart-design-2 .woodmart-cart-number{
            color: yellow;
    background-color:orange
    }

    If the code does not wor, please provide the site URL.

    Best Regards

Viewing 2 posts - 1 through 2 (of 2 total)