Esittelemme @mediakyselyjen käsitteen CSS: ssä.
Paljon mitä Sassin käyttö tässä projektissa antaa meille mahdollisuuden pysyä kuivana (älä toista itseäsi). Teimme tuon väri- ja kokomuuttujien asettamisen. Teimme sen kirjasinpinoillamme. Nyt teemme sen uudelleen mediakyselyillä. Aina kun tarvitsemme mediakyselyn, meillä on nyt @mixin, jota voimme käyttää. Tällä tavoin, jos meidän on säädettävä niitä, voimme muuttaa niitä vain yhdessä paikassa.
Sen sijaan, että mainitsisimme mediakyselymme, kuten "iPad" tai jotain liian erityistä, käytämme vain mielivaltaisia mutta ymmärrettäviä nimiä, kuten "Baby Bear" ja "Papa Bear".
Aloitamme laajalla näytöllä, sitten kavennamme sitä alaspäin, kunnes navigointi näyttää huonolta, ja se on ensimmäinen mediakyselytauko. Siinä vaiheessa jaamme navigoinnin kahteen riviin neljään yhden kahdeksan rivin sijaan. Meidän täytyy säätää varjoja, jotta se näyttää oikealta.
Säädämme myös sivun rivityksen leveyttä tietyissä mediakyselyissä, mikä tarkoittaa, että meidän on muutettava myös logon toimintaa.
