# 89: Vyladění panelu Galerie - Triky CSS

Anonim

V tomto videu provádíme spoustu vylepšení baru, který jsme nastavili s většinou funkcí Galerie. Design je především o vyladění, že?

Upravili jsme nějaké polstrování, aby se věci lépe srovnaly. Stylujeme rozbalovací nabídku, takže odhalená nabídka vypadá o něco hezčí. Při úpravách se ujistíme, že mají spoustu velkých klikatelných / klepatelných oblastí ( display: blockodkazů). Toto je dokonalý příklad toho, kde je vložení stylu z CodeKit velmi užitečné. Zajistíme, aby bylo převrácení silné, vizuálně, takže je velmi jasné, co vybíráte. Velmi důležité v takovém rozložení, kde vše vypadá tak podobně.

Děláme malý trik WordPress, kde odstraníme atribut title z odkazů na tagy (které jsou v tomto případě horší než zbytečné) pomocí funkce filtru a nic nevrátíme.

Přidáme tlačítko pro odeslání, umístíme jej napravo od pruhu a vytvoříme styl tlačítka, který funguje v kontextu pruhu galerie.

Galerie na tomto webu je trochu jedinečná v tom, že existuje několik šablon, které se výrazně liší, ale musí vypadat velmi podobně. Například domovská stránka galerie a stránka pro taxonomie galerie. Všimli jsme si tohoto problému a chvíli potřebujeme, abychom provedli potřebné změny, aby byly stejné. Zaměstnáváme některé techniky, které jsme v této sérii opakovaně používali, například vytváření zahrnutí pro použití na obou šablonách, abychom se neopakovali.

Pravděpodobně strávíme příliš mnoho času tím, že jsme pařezy, ale divná věc, kde se snažíme buď ozvěnou aktuální značku, nebo jedinečný řetězec - podle toho, na kterém typu stránky se nacházíte. Vždy jsou to nejhloupější maličkosti, které trvají nejdéle.

Také se potýkáme s hloupou malou specifičností, kde chceme, aby se odkazy a tlačítka v záhlaví mírně lišily. V tomto projektu máme takový lehký dotek selektorů. To je obvykle skvělé, žádné ošklivé války o specifičnost, ale je to také občas bolest, kdy jiné velmi lehké selektory (s nízkou specificitou) převažují nad ostatními a musíte jít silněji, než byste to chtěli opravit. C'est la vie.