Área dos comentários já personalizada!

É isso mesmo que vocês leram no título  do post ''Área dos comentários já personalizada!''. Gente eu já havia lido alguns tutoriais ai pela net sobre o assunto e confesso que pra quem não é muito fã de HTML iria acha uma chatice total !! 

Foi no blog Menina Nerd (créditos) que encontrei um tutu um pouco mais curto e super bem explicado >clique para ver< quem quiser algo mais personalizado vá lá. 

Eu trouxe aqui para o blog cores já personalizadas (estilo kawaii) *o* tinha que ser né! Mais são editáveis ok! É hora de se livrar do fundo cinza hauhauahuahconfira o antes e o depois

É muito simples e como eu disse as cores podem ser editadas, quem estiver interessado clique em leia mais

Aconselho que baixe seu modelo completo, caso algo dê errado você tem uma cópia né! Ou copie o código do seu template no bloco de notas.

1° Vá no seu HTML dê ctrl + F e procure por: #comments {

Agora apague o trecho destacado e mais o código que o acompanha:

#comments {

  background: $(comments.background);

  padding: 15px;

}

#comments .comment-author {

  padding-top: 1.5em;

}

#comments h4,

#comments .comment-author a,

#comments .comment-timestamp a {

  color: $(post.title.text.color);

}

#comments .comment-author:first-child {

  padding-top: 0;

  border-top: none;

}

.avatar-image-container {

  margin: .2em 0 0;

}

 E no Lugar cole:

/* Comments

----------------------------------------------- */

#comments h4 {

margin: .75em 0;

}

#comments-block .comment-author {background: #FFEFD5;

margin:.5em 0;

}

.comment-author a{

margin:0px;

color:#FF1493;

}

#comments-block .comment-body {background: #F0FFFF;

margin: -.5em 0 0px;

}

#comments-block .comment-footer {background: #FFFAFA;

margin:-.25em 0 2em;

}

.comment-timestamp, .comment-timestamp a {

color:#DCDCDC;

font-size:10px;

}

#comments-block .comment-body p {

margin:-.5em 0 0px;

}

Quem curtiu as cores que eu já coloquei pode salvar e ir conferir! quem quiser personalizar continue lendo>

 Personalizando as cores, nos trechos:                 acesse: (tabela de cores)

#comments-block .comment-author {background: #FFEFD5; = Se refere a cor da barra de quem escreveu o comentário

color:#FF1493; =Se refere a cor do nome de que escreveu o comentário.

#comments-block .comment-body {background: #F0FFFF; = Se refere a a cor da barra principal do comentário

#comments-block .comment-footer {background: #FFFAFA; = Se refere a barra do dia, mês, ano e hora em que o comentário foi postado

color:#DCDCDC; = Se refere a cor 

font-size:10px; = Se refere ao tamanho da fonte

Bom gente é isso espero que tenham curtido! Beeijos da Jackie