Wir führen das Konzept von @mediaAbfragen in CSS ein.
Wenn wir Sass in diesem Projekt verwenden, können wir viel trocken bleiben (wiederholen Sie sich nicht). Wir haben diese Farb- und Größenvariablen eingestellt. Das haben wir mit unseren Font-Stacks gemacht. Jetzt machen wir es wieder mit Medienabfragen. Immer wenn wir eine Medienabfrage benötigen, haben wir jetzt ein @mixin, das wir verwenden können. Auf diese Weise können wir sie an nur einer Stelle ändern, wenn wir sie anpassen müssen.
Anstatt unsere Medienabfragen wie "iPad" oder ähnliches zu benennen, verwenden wir nur einige willkürliche, aber verständliche Namen wie "Baby Bear" und "Papa Bear".
Wir beginnen mit einem breiten Bildschirm und schränken ihn dann ein, bis die Navigation schlecht aussieht. Dies ist unsere erste Unterbrechung der Medienabfrage. An diesem Punkt unterteilen wir die Navigation in zwei Viererreihen anstelle einer Achterreihe. Wir müssen die Schatten anpassen, damit sie richtig aussehen.
Wir passen auch die Breite des Seitenumbruchs bei bestimmten Medienabfragen an, was bedeutet, dass wir auch die Funktionsweise des Logos anpassen müssen.
