Záhlaví s flexboxem

Na řadě je záhlaví. Bude z něj tmavá lišta přes celou šířku stránky, s logem na levém konci a navigací na pravém, obojí uprostřed její výšky. Přesně tohle jste dělali v lekci Flexbox: ze záhlaví bude flex kontejner, jeho dvě děti, logo a nav, budou jeho flex položky a justify-content: space-between je odsune na oba konce.

Barva lišty je #1e1b4b, tmavě indigová jako noční obloha nad kinem (nebo vaše vlastní tmavá barva). Polstrování 16px 32px jí dá 16 pixelů nahoře a dole a 32 pixelů vlevo a vpravo.

Na tmavém pozadí se modré odkazy špatně čtou, a tak budou odkazy v záhlaví bílé. A nebudou podtržené: v navigaci jsou odkazy jasné i bez toho. Podtržení určuje vlastnost text-decoration (ozdoba textu) a hodnota none ho odstraní:

header a {
    color: white;
    text-decoration: none;
}

Pravidlo pro header a upraví všechny odkazy v záhlaví, i logo. Logo pak dostane vlastní velikost a tloušťku písma v pravidle pro svou třídu.

Nakonec: oba odkazy navigace stojí těsně vedle sebe. I z nav bude flex kontejner a gap mezi ně vloží mezeru.