How to change the toggle color

HTML & CSS
1

In the mobile version of http://www.tierrapropiedades.com I would like to change the toggle’s icons color. I managed to do it for the 1st line but didn’t find how to do it for all rows.

2021-09-22_15-18-27

2

Two options here…

.nav-toggle:before {
    content: "";
    position: absolute;
    width: 24px;
    height: 2px;
    background-color: #e5ff66;
    border-radius: 10px;
    box-shadow: 0 0.5em 0 0 #e5ff66, 0 1em 0 0 #e5ff66; /* Notice we changed from white to the yellow */
}

Option number 2 is to get rid of the background-color, then just add the third box shadow and reposition…

.nav-toggle:before {
    content: "";
    position: absolute;
    width: 24px;
    height: 2px;
    border-radius: 10px;
    /* Here we add the first box shadow, adjust the vertical numbers to match along with colors*/
    box-shadow: 0 0.5em 0 0 #e5ff66, 0 1em 0 0 #e5ff66, 0 1.5em 0 0 #e5ff66;
}

Choice is yours. :slight_smile:

2 Likes
3

Thank you. The shadow ! Never thought about that !

4

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.