Menu icon Foundation
Top-Bar Button BG is #333?

Tab bar bg

I have created a Hybrid Top-Bar/Off Canvas Navigation. I'm pretty sure that there is a setting somewhere with a value of #333 as the color that is making the background behind my buttons flash a dark grey color when I refresh the page. I don't think it has to do with Off-Canvas Settings because this happens while Off Canvas should be hidden (In desktop width (Medium-up)). Attached is the image of what my navigation looks like when I refresh the screen. Does anyone know what setting I can change to get this #333 dark grey color to be the same as my Primary Navigation Color? Below are the settings that I have overidden.

$topbar-dropdown-label-bg: $nav-primary-color;
$topbar-link-bg-hover: $nav-darken-color;
$topbar-dropdown-link-bg: $nav-darkest-color;
$topbar-bg-color: $nav-primary-color;
$topbar-bg: $nav-primary-color;
$tabbar-bg: $nav-primary-color;

All of the colors I have used are equal to a blue or dark blue color. So I am sure that the settings above are not the problem, it has to be another setting somewhere else.

navigationoff-canvastopbar

Tab bar bg

I have created a Hybrid Top-Bar/Off Canvas Navigation. I'm pretty sure that there is a setting somewhere with a value of #333 as the color that is making the background behind my buttons flash a dark grey color when I refresh the page. I don't think it has to do with Off-Canvas Settings because this happens while Off Canvas should be hidden (In desktop width (Medium-up)). Attached is the image of what my navigation looks like when I refresh the screen. Does anyone know what setting I can change to get this #333 dark grey color to be the same as my Primary Navigation Color? Below are the settings that I have overidden.

$topbar-dropdown-label-bg: $nav-primary-color;
$topbar-link-bg-hover: $nav-darken-color;
$topbar-dropdown-link-bg: $nav-darkest-color;
$topbar-bg-color: $nav-primary-color;
$topbar-bg: $nav-primary-color;
$tabbar-bg: $nav-primary-color;

All of the colors I have used are equal to a blue or dark blue color. So I am sure that the settings above are not the problem, it has to be another setting somewhere else.

Vinay Raghu over 5 years ago

Could you please add a codepen/fiddle for this?

Eric Bishard over 5 years ago

Thats a lot of stuff to put in code pen. THis is a fairly simple question I would think. THere are only so many settings in Top-Bar. Just wondering why I get a color of #333 after I have set the above settings to be different colors. My code is setup correctly or I wouldn't have the other settings being overridden.