Vi har den grunnleggende gallerihodet på plass, men det mangler de små blå menneskene som Erica la i den originale illustrasjonen. Vi hadde snakket om det på forhånd, og bestemte oss for at det ville være ganske kult hvis folkens størrelse ble endret når skjermveggen beveget seg bak dem, så det ser ut som om de surfer i galleriet.
Siden folkegrafikken er ren ordenlig, er det ikke ideelt å bruke markering for dem. Heldigvis er det to av dem, og vi får to gratis pseudo-elementer på hvert element ( ::beforeog ::after). Vi bruker dem til å legge dem til.
Vi introduserer et konsept i denne videoen som vil fortsette å være nyttig, begrepet “reverso media queries”. Vi jobber stort sett med desktop-down i dette designet, så mediespørsmålene våre er for det meste basert på max-width. Men hvis vi setter opp de samme mediespørsmålene basert på min-width, kan vi bare målrette skjermen når den er større enn en viss størrelse, ikke mindre.
I denne omstendigheten passer folks grafikk bare ikke på små skjermer. Så vi bruker et reverso mediespørsmål for å laste dem inn, på den måten vil vi laste dem på store skjermer som de jobber med, men ikke laste dem på små skjermer. Det er bedre enn å laste dem hele tiden og skjule dem på små skjermer.