Planeta Kawaii: Personalizando comentários

Hii ^.^

Tudo bem queridos? Desculpem não postar ontem,é porquê tava estudando para minhas provas,minha vida tá coridinha,então,hoje vim mostrar um tuto bem facíl e um pouco complicado.

É a personalização dos comentários,quando eu faço um layout, eu sempre faço isso pelo final,é bom.Fica lindo o layout, bom para você ver como fica,veja no meu blog (xx),vá direito em comentários. ok? ^.^

Vamos ao tuto ? ^.^

Procure por */

Vai tar algo parecido com ''coments''

Apague isto até o }

E cole no lugar :

.comments{clear:both;margin-top:10px;margin-bottom:0;line-height:20px;font-size:12px}
.comments .comments-content{margin-bottom:16px;font-weight:normal;text-align:left}
.comments .comment .comment-actions a,.comments .comment .continue a{
display:inline-block;
margin:0 0 10px 10px;
padding:0 15px;
color:#ffffff!important; /*--- cor da fonte do botão reply--- */
text-align: center;
text-decoration:none;
background: #bbbbcc; /*--- cor de fundo do botão reply--- */
background: -webkit-gradient( linear, left top, left bottom, color-stop(.2, #bbbbcc), color-stop(1, #bbbbcc) ); /*--- cor de fundo gradiente--- */
background: -moz-linear-gradient( center top, #9F2E30 20%, #9F2E30100% );/*--- cor de fundo gradiente--- */
border-radius:2px;
-moz-border-radius:2px;
height:25px;
line-height:26px;
font-weight:normal;
cursor:pointer;
-webkit-transition-duration: .50s;
}
.comments .comment .comment-actions a:hover,.comments .comment .continue a:hover {
text-decoration: none;
background: -webkit-gradient( linear, left top, left bottom, color-stop(.2, #ddaaaa), color-stop(1, #ddaaaa) ); /*--- cor de fundo gradiente--- */
background: -moz-linear-gradient( center top, #ddaaaa 20%, #ddaaaa 100% );/*--- cor de fundo gradiente--- */
-webkit-transition-duration: .50s;
}
.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-center:50px;}
.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 .datetime a{
font-size:11px;
float: right;
text-decoration:none; color:#bbbbcc; /* -- cor do link da data do comentário -- */
-webkit-transition-duration: .50s;
}
.comments .comments-content .datetime a:hover{
font-size:11px;
float: right;
text-decoration:none; color:#bbbbcc; /* -- cor do link da data do comentário -- */
-webkit-transition-duration: .50s;
}
.comment-content{margin:0 0 8px;padding:0 5px;
}
.comments .comment-block{
margin-left:65px;
position:relative;
background:#fff; /* -- cor de fundo do comentário -- */
border:1px solid #bbbbcc; /* --- cor da borda do comentário ---*/
border-radius:1px;
-moz-border-radius:1px;
}
.comment-header{ /*--- linha onde fica o nome do autor do comentário --- */
background-color:#f6f6f6; /*--- cor de fundo--- */
font-size:14px;
border-bottom:1px solid #bbbbcc; /*--- cor da borda --- */
padding:5px;
}
.comment-header a{
color: #bbbbcc; /*--- cor do link nome do autor do comentario --- */
-webkit-transition-duration: .50s;
}
.comment-header a:hover{
color: #ddaaaa; /*--- cor do link nome do autor do comentario --- */
-webkit-transition-duration: .50s;
}
.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-right: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{
width:55px !important;
height:55px !important;
max-width:55px !important;
max-height:55px !important}
.comments .avatar-image-container img{
padding:2px;
border:1px solid #cccccc;
width:40px !important;
height:40px !important
;max-width:40px !important;
max-height:40px !important;
-webkit-border-radius: 1px;
-webkit-transition-duration: .50s;
}
.comments .avatar-image-container img:hover{
padding:2px;
border:1px solid #ddaaaa;
width:40px !important;
height:40px !important
;max-width:40px !important;
max-height:40px !important;
-webkit-border-radius: 1px;
-webkit-transition-duration: .50s;
}