mirror of
https://github.com/Oreolek/ifhub.club.git
synced 2024-07-03 06:55:03 +03:00
128 lines
8.1 KiB
CSS
128 lines
8.1 KiB
CSS
/* --------------------------------------------
|
||
КОММЕНТАРИИ
|
||
-------------------------------------------- */
|
||
|
||
/* Блок с комментариями */
|
||
.comments-header { margin-bottom: 10px; position: relative; }
|
||
.comments-header h3 { font-size: 27px; margin-bottom: 5px; }
|
||
.comments-header .subscribe { position: absolute; top: 15px; right: 0; font-size: 11px; color: #7b848d; }
|
||
.comments-header .subscribe input { top: 2px; }
|
||
|
||
.comments { margin-bottom: 30px; }
|
||
|
||
.comment-wrapper { position: relative; }
|
||
.comment-wrapper .comment-wrapper { padding-left: 40px; }
|
||
|
||
.comment-preview { padding: 5px 10px 6px; margin-bottom: 10px; background: #fafafa; border: 1px solid #eee; border-radius: 3px; }
|
||
.comment-preview { font-size: 13px; line-height: 18px; }
|
||
|
||
|
||
/* Комментарий */
|
||
.comment { min-height: 48px; margin-bottom: 10px; padding: 10px 0 0 40px; position: relative; }
|
||
.comment .deleted { padding: 5px 10px; color: #777; background: #f4f4f4; }
|
||
.comment .comment-avatar { position: absolute; top: 10px; left: 0; width: 30px; height: 30px; }
|
||
.comment .folding { width: 13px; height: 13px; position: absolute; top: 18px; left: -20px; background: url(../images/icons-synio.png) 0 -94px no-repeat; cursor: pointer; }
|
||
.comment .folding.folded { background-position: -13px -94px; }
|
||
|
||
|
||
/* Стили для списка комментариев на странице http://ваш_сайт/comments/ */
|
||
.comments.comment-list .comment { margin-bottom: 50px; padding-left: 0; }
|
||
.comments.comment-list .comment .comment-avatar { position: static; width: 16px; height: 16px; vertical-align: middle; }
|
||
.comments.comment-list .comment .comment-content { margin-bottom: 5px; }
|
||
.comments.comment-list .comment .comment-info li.vote .vote-count { margin-right: 0; }
|
||
.comments.comment-list .comment .comment-content:after { top: -12px; left: 25px; border-color: transparent transparent #e7ebed; }
|
||
.comments.comment-list .comment .comment-content:before { top: -11px; left: 25px; border-color: transparent transparent #fff; }
|
||
.comments.comment-list .comment-path { font-size: 11px; color: #a2b6cd; }
|
||
.comments.comment-list .comment-path .blog-name,
|
||
.comments.comment-list .comment-path .comment-path-comments { color: #000; }
|
||
.comments.comment-list .comment-path .comment-path-topic { color: #275ec2; }
|
||
|
||
|
||
|
||
/* Типы комментариев
|
||
*
|
||
* deleted - удаленный комментарий
|
||
* self - ваш комментарий
|
||
* new - новый, непрочитанный комментарий
|
||
* current - активный комментарий, который выделяется при исползование кнопки обновления в тулбаре
|
||
*
|
||
*/
|
||
.comment { background: #fff; }
|
||
.comment.comment-deleted .comment-content { background: #c5c5c5; border-color: #C8A8A8; }
|
||
.comment.comment-deleted .comment-content:after { border-color: #C8A8A8 transparent transparent; }
|
||
.comment.comment-deleted .comment-content:before { border-color: #c5c5c5 transparent transparent; }
|
||
.comment.comment-self .comment-content { background: #fefef1; border-color: #e6e6bd; }
|
||
.comment.comment-self .comment-content:after { border-color: #e6e6bd transparent transparent; }
|
||
.comment.comment-self .comment-content:before { border-color: #fefef1 transparent transparent; }
|
||
.comment.comment-new .comment-content { background: #e4fbf1; border-color: #d0e8dd; }
|
||
.comment.comment-new .comment-content:after { border-color: #d0e8dd transparent transparent; }
|
||
.comment.comment-new .comment-content:before { border-color: #e4fbf1 transparent transparent; }
|
||
.comment.comment-current .comment-content { background: #cdf5a6; border-color: #bae48e; }
|
||
.comment.comment-current .comment-content:after { border-color: #bae48e transparent transparent; }
|
||
.comment.comment-current .comment-content:before { border-color: #cdf5a6 transparent transparent; }
|
||
.comment.comment-bad .comment-content { opacity: 0.3; filter: alpha(opacity=30); }
|
||
.comment.comment-bad:hover .comment-content { opacity: 1; filter: alpha(opacity=100); }
|
||
|
||
.ls-user-role-not-admin .comment.comment-deleted { padding: 10px 15px; min-height: 0; background: #f7f7f7; color: #888; }
|
||
|
||
|
||
/* Info Block */
|
||
.comment .comment-info { padding: 0 70px 7px 0; line-height: 12px; position: relative; top: -2px; overflow: hidden; zoom: 1; font-size: 11px; }
|
||
.comment .comment-info li { float: left; height: 18px; padding-top: 3px; margin-right: 13px; }
|
||
.comment .comment-info li a { }
|
||
.comment .comment-info li a.link-dotted { color: #727a90; text-decoration: none; border-bottom: 1px dotted #727a90; }
|
||
.comment .comment-info li a.link-dotted:hover { color: #f00; border-color: #f00; }
|
||
.comment .comment-info li.comment-author a { font-weight: bold; color: #727fa0; }
|
||
.comment .comment-info li.comment-author .comment-topic-author { background: #C9A518; color: #fff; font-size: 11px; border-radius: 3px; padding: 1px 7px; margin-right: 5px; }
|
||
.comment .comment-info li.comment-date { color: #818189; }
|
||
.comment .comment-info li.comment-favourite { position: relative; top: 1px; }
|
||
.comment .comment-info li.comment-link { position: relative; top: 1px; }
|
||
.comment .comment-info li.goto a { color: #a2b6cd; text-decoration: none; }
|
||
.comment .comment-info li .favourite-count { font-size: 10px; color: #a2b6cd; position: relative; top: -2px; }
|
||
|
||
|
||
.comment .comment-info li.vote { position: absolute; top: 0; right: 0; margin: 0; }
|
||
.comment .comment-info li.vote .vote-count { float: left; color: #949aa1; font-weight: bold; padding-top: 3px; margin-right: 6px; }
|
||
.comment .comment-info li.vote .vote-down { float: left; width: 20px; height: 20px; background: url(../images/icons-synio.png) 0 -130px no-repeat; cursor: pointer; margin-left: 4px; }
|
||
.comment .comment-info li.vote .vote-down:hover { background-position: 0 -150px; }
|
||
.comment .comment-info li.vote .vote-up { float: left; width: 20px; height: 20px; background: url(../images/icons-synio.png) -20px -130px no-repeat; cursor: pointer; margin-left: 4px; }
|
||
.comment .comment-info li.vote .vote-up:hover { background-position: -20px -150px; }
|
||
|
||
.comment .comment-info li.vote.vote-count-positive .vote-count { color: #51983c; }
|
||
.comment .comment-info li.vote.vote-count-negative .vote-count { color: #da4242; }
|
||
|
||
.comment .comment-info li.vote.voted-up .vote-down { display: none; }
|
||
.comment .comment-info li.vote.voted-up .vote-up { background-position: -20px -170px; }
|
||
.comment .comment-info li.vote.voted-down .vote-down { background-position: 0 -170px; }
|
||
.comment .comment-info li.vote.voted-down .vote-up { display: none; }
|
||
|
||
.comment .comment-info li.vote.vote-expired .vote-up,
|
||
.comment .comment-info li.vote.vote-expired .vote-down { display: none; }
|
||
|
||
|
||
.comment .comment-info li.goto-comment-child { display: none; }
|
||
|
||
|
||
/* Content */
|
||
.comment .comment-content { margin-bottom: 10px; border: 1px solid #e7ebed; padding: 9px 10px 10px; border-radius: 3px; position: relative; }
|
||
.comment .comment-content.text { font-size: 13px; }
|
||
.comment .comment-content.text blockquote { background: #fff; border-color: #ccc; padding: 5px 10px; margin-bottom: 5px; }
|
||
.comment .comment-content:after { display: block; content: ""; position: absolute; bottom: -12px; left: 10px; width: 0; height: 0; border-width: 6px; border-color: #e7ebed transparent transparent; border-style: solid; }
|
||
.comment .comment-content:before { display: block; content: ""; position: absolute; bottom: -11px; left: 10px; width: 0; height: 0; border-width: 6px; border-color: #fff transparent transparent; border-style: solid; z-index: 10; }
|
||
|
||
|
||
/* Actions */
|
||
.comment .comment-actions li { display: inline; margin-right: 10px; }
|
||
|
||
|
||
/* Форма комментирования */
|
||
.reply-header { font-size: 20px; line-height: 1.3em; margin-bottom: 15px; }
|
||
|
||
.reply { background: #f8fbfe; padding: 15px; border-radius: 5px; }
|
||
.reply textarea { height: 100px; }
|
||
.reply textarea.loader { background: #f7f7f7 url(../images/loader.gif) no-repeat center;}
|
||
|
||
.reply .mceEditor { display: block; margin-bottom: 10px; }
|
||
|
||
.wall-submit.wall-submit-reply.wall-submit-comment { box-shadow: none; margin-top: 0; margin-bottom: 50px; }
|
||
.wall-submit.wall-submit-reply.wall-submit-comment:after { display: none; } |