Modelo para area dos comentarios ~

Olá queridos da mamis tudo bem?  ( ‘з’)/ A mamis demorou para postar depois do post de nivelamento né? Bem, se eu disser que eu fiz este tema em apenas dois dias? Pois é, a minha vontade de mudar o layout era tanta que em dois dias eu fiz tudo, sempre demoro até uns 4 dias para finalizar um tema mas desta vez foi bem diferente. O motivo para não ficar com o tema que estava mais tempo? Layouts com temas específicos é fogo, tipo fazer qualquer layout com apenas paletas mas sem temas em si enjoa muito menos e demora mais para enjoar. Não sei vocês mas eu sou assim (ToT) A Dara estava linda mas sei lá, ainda mais que as cores eram fortes =/

Mas então, mudando de assunto, gostaram desta nova versão? Não tem tema específico apenas coloquei uma imagem de uma mulher com flores porque achei a imagem muito linda, não considero um tema ASUHAUSHash. Digamos que desta vez irei demorar muito mas muito mais para trocar de layout pois já fiz de caso pensado. Eu adorei e vocês?  Mas então, agora sim ao assunto que interessa a vocês, uma leitora me pediu uma área de comentários e eu fiz, na verdade é a mesma deste layout só mudei alguns detalhes cores e efeitos, mas o modelo em si é o mesmo. Espero que gostem afinal eu achei a minha área uma gracinha >.< Simbora ao tuto cheirosos? ٩(●˙▿˙●)⋆

LIVE PREVIEW ٩(♡ε♡ )۶

Vá até o seu modelo cliquem em editar e dentro procure por: /* Comments tudo o que estiver abaixo dele apague e cole o código a seguir abaixo:

/* Comments
----------------------------------------------- */
#comments {
padding: 15px;
background: #F3F8F6 none repeat scroll top center;
}
#comments .comment-author {
padding-top: 1.5em;
}
#comments h4,
#comments .comment-author a,
#comments .comment-timestamp a {
padding:5px;
background:#EBF3EF;
border:solid 1px #D3E1DB;
border-left:solid 4px #D3E1DB;
border-right:solid 4px #D3E1DB;
font: 12px consolas;
color: #AFD0C2;
text-shadow: 1px 1px 1px #fff;
font-weight: 300;
text-transform:uppercase;
text-decoration: none;
text-align: center;
}
#comments .comment-author:first-child {
padding-top: 0;
border-top: none;
}
/* Comments
----------------------------------------------- */
.comments{clear:both;margin-top:10px;margin-bottom:10px;
line-height:18px; font:11px consolas;color: #C8C8C8;text-align:justify;}
.comments .comments-content{margin-bottom:16px;font-weight:normal;}
.comments .comment .comment-actions a,.comments .comment .continue a{
display:inline-block;
margin:0px 0px 10px 10px;
padding: 5px 5px 5px 5px;
color:#fff;
text-shadow: 1px 1px 1px #659681;
font: 10px consolas;
text-transform: uppercase;
letter-spacing: 1px;
text-align:center;
text-decoration:none;
background:#E6F0EC;
border:1px solid #C9DCD3;
box-shadow: inset 0 0 2px #eee, 0 0 6px #fff;
border-radius:1px;
-moz-border-radius:1px;
font-weight:normal;
cursor:pointer;
-webkit-transition-duration: .80s;
}
.comments .comment .comment-actions a:hover,.comments .comment .continue a:hover {
text-decoration: none;
background:#CEE3DA;
border:1px solid #C0D5CC;
box-shadow: inset 0 0 2px #eee, 0 0 6px #fff;
color:#fff;
text-shadow: 1px 1px 1px #799E8E;
}
.comments .comments-content .comment-thread ol{
list-style-type:none;padding:0;text-align:none}
.comments .comments-content .inline-thread{padding:0}
.comments .comments-content .comment-thread{margin:8px 0}
.comments .comments-content .comment-thread:empty{display:none}
.comment-replies{margin-top:1em;margin-left:40px;}
.comments .comments-content .comment{margin-bottom:0;padding-bottom:0}
.comments .comments-content .comment:first-child{padding-top:16px}
.comments .comments-content .comment:last-child{border-bottom:0;padding-bottom:0}
.comments .comments-content .comment-body{position:relative;
}
.comments .comments-content .user{font-style:normal;font-weight:normal}
.comments .comments-content .user a{font-weight:normal;text-decoration:none;}
.comments .comments-content .icon.blog-author{
background-repeat: no-repeat;
background-image: url('');
width:5px;
height:5px;
display:inline-block;
float:right;
}
.comments .comments-content .datetime a{
margin-top:3px;
float:right;
letter-spacing: 1px;
text-transform: uppercase;
text-decoration:none;
font: 9px consolas;
color: #FFF;
text-shadow: 1px 1px 1px #81A394;
}
.comments .comments-content .datetime a:hover{
color: #B5D5C7;
text-shadow: 1px 1px 1px #FFF;
}
.comment-content{margin:0 0 8px;padding:0 5px;
}
.comments .comment-block{
font:11px consolas;
color: #C8C8C8;
margin-left:50px;
position:relative;
background:#F7F3F8;
border:solid 1px #E9EAEA;
box-shadow: 1px 1px 1px #eee;
border-radius:1px;
-moz-border-radius:1px;
}
.comment-header{ /*--- linha onde fica o nome do autor do comentário --- */
background:#EBF3EF;
border:solid 1px #D3E1DB;
box-shadow: 0px 0px 5px #eee;
font: 12px consolas;
color: #FFF;
text-shadow: 1px 1px 1px #81A394;
letter-spacing: 1px;
text-align:left;
text-transform: uppercase;
text-decoration:none;
padding:5px;
border-radius:1px;
-moz-border-radius:1px;
}
.comment-header a{
color: #FFF;
text-shadow: 1px 1px 1px #81A394;
-webkit-transition-duration: .80s;
}
.comment-header a:hover{
color: #B5D5C7;
text-shadow: 1px 1px 1px #FFF;
-webkit-transition-duration: .80s;
}
.comments .comments-content .owner-actions{position:absolute;right:0;top:0}
.comments .comments-replybox{border:none;height:230px;width:100%}
.comments .comment-replybox-thread{margin-top:0}
.comments .comment-replybox-single{margin-top:5px;margin-left:48px}
.comments .comments-content .loadmore a{display:block;padding:10px 16px;text-align:center}
.comments .thread-toggle{cursor:pointer;display:inline-block}
.comments .comments-content .loadmore{cursor:pointer;max-height:3em;margin-top:0}
.comments .comments-content .loadmore.loaded{max-height:0;opacity:0;overflow:hidden}
.comments .thread-chrome.thread-collapsed{display:none}
.comments .thread-toggle{display:inline-block}
.comments .thread-toggle .thread-arrow{
display:inline-block;
height:6px;
width:7px;
overflow:visible;
margin:0.3em;
padding-right:4px;
}
.comments .thread-expanded .thread-arrow{background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAc AAAAHCAYAAADEUlfTAAAAG0lEQVR42mNgwAfKy8v/48I4FeA0AacVDFQBAP9wJkE/KhUMAAAAAElFTkSuQmCC") no-repeat scroll 0 0 transparent;
}
.comments .thread-collapsed .thread-arrow{background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAA AcAAAAHCAYAAADEUlfTAAAAJUlEQVR42mNgAILy8vL/DLgASBKnApgkVgXIkhgKiNKJ005s4gDLbCZBiSxfygAAAAB JRU5ErkJggg==") no-repeat scroll 0 0 transparent;
}
.avatar-image-container img{
-webkit-transition: all 0.8s ease-out;
-moz-transition: all 0.8s ease-out;
transition: all 0.8s ease-out;
border-radius:50%;
}
.avatar-image-container{
display:inline;
margin-left:1px;
padding: 2px;
background:#CBE5DA;
box-shadow: 0px 0px 5px #BEDCCF;
border: solid 1px #94BCAB;
width:40px !important;
height:40px !important;
max-width:36px !important;
max-height:36px !important;
-webkit-border-radius:50%;
-webkit-border-radius:50% 50% 0% 50%;
-webkit-border-radius: 100px;
-webkit-border-top-right-radius: 1px;
-moz-transition: all 0.5s ease-out;
-webkit-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-ms-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;-webkit-transition: all 2s ease;
-moz-transition: all 2s ease; -o-transition: all 2s ease;
transition: all 2s ease;
-webkit-transition-duration: .90s;
transition-duration: .90s;}
.avatar-image-container:hover{
margin-left:5px;
padding: 2px;
background:#CBE5DA;
box-shadow: 0px 0px 5px #BEDCCF;
border: solid 1px #94BCAB;
-webkit-border-radius:50%;
-webkit-border-radius:50% 50% 0% 50%;
-webkit-border-radius: 100px;
-webkit-border-bottom-right-radius: 1px;
width:40px !important;
height:40px !important;
max-width:36px !important;
max-height:36px !important;
-moz-transition: all 0.5s ease-out;
-webkit-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-ms-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;opacity: 1;
}