Support » Fixing WordPress » Change color of slicknav 3-bar button/icon?

  • Resolved kkwr

    (@kkwr)


    Hi there,

    I’m hoping to change the color of the mobile menu button/icon on my site. Currently, those 3 little bars appear as dark gray, which makes them nearly invisible over the webpage’s gray background. I’d like to change the bars to yellow or white (either one is fine).

    Here’s the CSS code from the Silvia theme, where I assume things need to be changed? My knowledge of CSS is extremely limited.

    /**
    * Mobile menu
    */
    .slicknav_menu {
    display: none;
    }

    @media (max-width: 767px) {
    #menu-primary-items {
    display: none;
    }
    .slicknav_menu {
    display: block;
    padding: 0;
    background-color: transparent;
    }
    .slicknav_menu .slicknav_icon-bar {
    background-color: #454545;
    box-shadow: none;
    }
    .slicknav_menutxt {
    position: absolute;
    clip: rect(1px, 1px, 1px, 1px);
    }
    .slicknav_btn {
    margin: 0;
    padding: 25px 30px 0 0;
    background-color: transparent;
    }
    .slicknav_nav {
    margin-top: 60px;
    padding: 10px 0;
    background-color: #454545;
    }
    .slicknav_nav .slicknav_row,
    .slicknav_nav a {
    font-size: 16px;
    margin: 0;
    padding: 5px 20px;
    text-transform: uppercase;
    color: #fff;
    }
    .slicknav_nav .slicknav_row:hover,
    .slicknav_nav a:hover {
    color: #fff;
    border-radius: 0;
    background-color: #333;
    }
    }

    Any help is greatly appreciated! Thanks.

    (P.S. I apologize if this is in the wrong section of the forums.)

Viewing 2 replies - 1 through 2 (of 2 total)
Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Change color of slicknav 3-bar button/icon?’ is closed to new replies.