Menu border color changing

[eslammg]

HI,
i want to chang menu border color, how can i do that ?!

i also want to change color of menu icon on mobile phones

Best Regards.

[christian]

Hey @eslammg,

Before I give the solution, I’d first wanted to let you know that Ethos header and footer background should be dark colored that is why there’s a light border surrounding the Navbar.

With that said, those areas of the Ethos are pre-designed so overriding it with CSS is necessary. Please insert this code in X > Theme Options > CSS

/*
Top Navbar Border
*/
.x-logobar {
    border-bottom: 1px solid red;
}

/*
Bottom Navbar Border
*/

.x-navbar {
    border-bottom: 2px solid red;
}

/*
Navbar Button
*/
.x-btn-navbar {
	color: black;
}

/*
Navbar Mobile Button - Collapsed
*/

.x-btn-navbar.collapsed {
    color: red !important;
}

/*
Navbar Mobile Button - Hover
*/

.x-btn-navbar:hover {
    color: blue;
}

Please refer to the CSS comments to know what the code applies to. You can change red to other CSS Color Values. You can refer to this third party source for guidance: https://www.w3schools.com/cssref/css_colors_legal.asp

I’d recommend you learn CSS from the same source to learn how to extend the style of X.

Hope that helps.

[eslammg]

I really appreciate your help
thanks a lot

[jade]

You’re most welcome, Eslam.