Ist eine andere Hintergrundfarbe für die mobile Foundation Topbar möglich? - zurb-foundation

Ich würde gerne eine andere Hintergrundfarbe verwendenfür das Foundation-Topbar-Menü in der mobilen Ansicht im Vergleich zur Desktop-Ansicht. In der Einstellungsdatei haben Sie $ topbar-dropdown-bg, um die Farbe einzustellen, aber das ist für beide Ansichten gleich. Ich habe den folgenden Code ausprobiert:

$topbar-dropdown-bg: white;
@media only screen and (max-width : 40em) {
$topbar-dropdown-bg: #dc2a87;
}

Aber das Problem ist, dass alle Ansichten den farbigen Hintergrund geben, aber dies sollte nur in der mobilen Ansicht sein?

Antworten:

0 für die Antwort № 1

Verwenden Sie die scss-Medienabfrage, um die oberste Leiste der Foundation zu ändern.

   @media #{$small-only} { }

Verwenden Sie es mit der Variable bg-background.

   @media #{$small-only} {
$topbar-dropdown-bg :#fff;
}