# 110: Wątek komentarza Photoshopping - CSS-Tricks

Anonim

Zaczynamy tutaj zagłębiać się w Photoshopa i projektować obszar komentarzy. Zaczynamy od góry, czyli od samych komentarzy (w przeciwieństwie do formularza komentarza).

Złapaliśmy awatara do pracy. Na pewno będziemy korzystać z usługi Gravatar, ponieważ jest ona dostosowana do tego i doskonale zintegrowana z WordPress. Poza tym jestem wielkim fanem awatarów i poczucia własnej własności, które dają ci na stronie.

Niektóre z tego projektu po prostu łatwo się układają. Używamy białego pudełka na szaro, podobnie jak wszystkie moduły na stronie. Wrzucamy awatara. Z nazwy tworzymy łącze i używamy łącza niebieskiego, którego używaliśmy wszędzie. Wpisujemy datę komentarza używając tej samej stylistyki, jaką mają wszystkie daty na stronie. Przez cały czas jesteśmy tak zorganizowani, jak to tylko możliwe w Photoshopie.

W przypadku odpowiedzi na komentarze wcinamy nieco komentarz poniżej, starając się dopasować do utworzonej przez nas podsiatki. Będziemy również potrzebować łącza w komentarzach najwyższego poziomu, w którym będziemy tworzyć te odpowiedzi, dlatego umieszczamy łącze w prawym górnym rogu tych komentarzy. Taki sam niebieski link jak zawsze. Używamy strzały z naszego zestawu ikon Entypo - tylko że nie było tam idealnej strzały, musieliśmy wybrać taką, która była blisko i obrócić ją o 180 stopni. Nie powinno to stanowić problemu w CSS.

Aby wyjaśnić, że data komentarza jest również linkiem stałym, użyjemy do tego ikony.

Bawimy się tym, gdzie powinny trafiać linki „funkcjonalne”, ale nie zastanawiaj się nad tym zbyt długo. Jedynymi ludźmi, którzy kiedykolwiek je zobaczą, jestem ja. Dla przypomnienia, tak właśnie skończyłem.