Olemme melko lähellä sitä, että sivuston Snippets-alueen kotisivun rakentaminen on valmis. Heti alamme säätää asioita ja saada enemmän tavaraa muotoon.
Meillä on outo kokemus, jossa ehdottomasti sijoitettu pseudoelementti ei vastannut negatiiviseen vasempaan marginaaliin, mutta oli hieno positiivisella oikealla marginaalilla. Joka tiesi.
Sitten siirrytään tekemään "aktiivinen" luokka katkelmaluokkien vasempaan valikkoon. Selaat vain yhtä niistä kerrallaan (näet luettelon liittyvistä katkelmista oikealla). Sano, että "HTML" on aktiivinen ja napsautat "CSS". Uusi luettelo vain CSS: ään liittyvistä katkelmista näkyy oikealla. On oltava jonkinlainen muotoilu paikallaan osoittamaan, mikä on aktiivinen. Z-indeksin vaihtaminen aktiivisella luokassa riittää toimimaan meille (saamaan sen istumaan varjon yläpuolelle).
Oikealla olevan luettelon kohdalla on houkuttelevaa tehdä linkeistä display: block - mutta se on melkein liian paljon napsautettavaa aluetta. Vaikuttaa oudolta ajatella sitä, mutta mielestäni se on totta. Et halua tahattomia napsautuksia hyvin kaukana linkin tekstistä aktivoidaksesi linkin. Se olisi yllättävää ja outoa. Joten linkit itse voivat olla inline-block, jotta niillä voi olla jonkin verran täyttöä, mutta älä täytä koko leveyttä kuten luettelokohta, jossa ne ovat.
Itse linkkien osalta päätämme, että katkelmien otsikon värittäminen niiden luokan väreihin, joihin ne kuuluvat, on liian voimakasta. Sen sijaan linkit ovat harmaita, mutta siirtymäväri voi saada kyseisen erityisen värin.
Päätämme myös, että suoraan alaspäin oleva sarakeluettelo toimii toistaiseksi, mutta jos vieritys muuttui liian naurettavaksi, ehkä jonain päivänä voimme jakaa kahteen sarakkeeseen ja lyhentää sitä.