# 110: Photoshopping Discussie commentaar - CSS-trucs

Anonim

We beginnen hier met het graven van Photoshop en het ontwerpen van het opmerkingengebied. We beginnen bovenaan, dat wil zeggen de individuele opmerkingen zelf (in tegenstelling tot het reactieformulier).

We pakken een avatar om mee te werken. We zullen zeker de Gravatar-service gebruiken, want die is hiervoor op maat gemaakt en perfect geïntegreerd in WordPress. Verder ben ik een grote fan van avatars en het gevoel van persoonlijk eigendom dat ze je op een site geven.

Een deel van dit ontwerp valt gewoon gemakkelijk op zijn plaats. We gebruiken een wit vak op grijs zoals alle modules op de site. We ploffen in de avatar. We maken van de naam een ​​link en gebruiken de blauwe link die we overal elders hebben gebruikt. We hebben de datum van de opmerking ingevoerd met dezelfde stijl als alle datums op de site. Al die tijd blijven we zo georganiseerd mogelijk in Photoshop.

Voor reacties op reacties laten we de opmerking hieronder een beetje inspringen, in een poging om op één lijn te blijven met het subraster dat we hebben gemaakt. We hebben ook een link nodig bij opmerkingen op het hoogste niveau om die antwoorden te maken, dus plaatsen we een link in de rechterbovenhoek van die opmerkingen. Dezelfde link-blauw als altijd. We gebruiken een pijl uit onze Entypo-pictogrammenset - alleen was daar niet de perfecte pijl, we moesten er een kiezen die dichtbij was en deze 180 graden draaien. Dat zou in CSS geen probleem moeten zijn.

Om duidelijk te maken dat de datum van de opmerking ook een permalink is, gebruiken we daarvoor ook een pictogram.

We spelen rond met waar de "functionaliteit" -links moeten komen, maar blijven er niet te lang bij stilstaan. De enige mensen die dat ooit zullen zien, ben ik. Voor de duidelijkheid, dit is waar ik uiteindelijk mee ging.