[Anonymous]

Anonymous

#49026

I want to make a site in development look different, and I’m thinking of putting the navigation menu over the header graphic. Either with zero background (transparent), or a gradient shade.

I found this page from a couple of years back, ( https://forum.graphene-theme.com/topic/change-color-of-menu-both-mobile-toggle-and-desktop/ ) and I’ve experimented extensively using the Custom CSS codes, but I’ve only succeeded in changing text color.

Am I overlooking something simple?

Thanks!
Ed

[Syahir Hakim]

Syahir Hakim

#49058

The topic you linked to was actually for a different theme, Franz Josef. Though Graphene and Franz Josef share similar layout framework (Bootstrap), the way they’re implemented is quite different. You will likely need different code for Graphene.

To move the position of the header bar over the header and set it’s background to transparent, you can use this code:

.navbar {
	margin-top: -40px;
	background: none;
}
.navbar-inverse #header-menu-wrap {
	background: none;
}