mirror of
https://github.com/Oreolek/ifhub.club.git
synced 2024-07-05 16:04:24 +03:00
d6029b1b12
* Оптимизировано добавление\удаление из избранного * Документирование * Мелкие доработки и исправления
344 lines
17 KiB
CSS
344 lines
17 KiB
CSS
/**
|
||
* Общие стили
|
||
*/
|
||
|
||
|
||
/**
|
||
* Голосование
|
||
*/
|
||
.vote-topic { height: 24px; border-radius: 15px; overflow: hidden; font-size: 11px; float: left; zoom: 1; }
|
||
.vote-topic .vote-item {
|
||
cursor: pointer;
|
||
overflow: hidden;
|
||
display: block;
|
||
float: left;
|
||
height: 22px;
|
||
border: 1px solid #dfe3e8;
|
||
|
||
background: #fbfbfc;
|
||
background: -moz-linear-gradient(top, #fbfbfc 0%, #f0f2f5 100%);
|
||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fbfbfc), color-stop(100%,#f0f2f5));
|
||
background: -webkit-linear-gradient(top, #fbfbfc 0%,#f0f2f5 100%);
|
||
background: -o-linear-gradient(top, #fbfbfc 0%,#f0f2f5 100%);
|
||
background: -ms-linear-gradient(top, #fbfbfc 0%,#f0f2f5 100%);
|
||
background: linear-gradient(top, #fbfbfc 0%,#f0f2f5 100%);
|
||
}
|
||
.vote-topic .vote-item i { width: 16px; height: 16px; display: block; background-repeat: no-repeat; }
|
||
.vote-topic .vote-item span { display: block; border-right: 1px solid #fff; border-top: 1px solid #fefefe; }
|
||
|
||
.vote-topic .vote-item.vote-up { border-radius: 0 15px 15px 0; }
|
||
.vote-topic .vote-item.vote-up i { background-image: url(../images/icons/vote-up.png); }
|
||
.vote-topic .vote-item.vote-up span { padding: 2px 7px 3px 4px; border-radius: 0 15px 15px 0; }
|
||
.vote-topic.not-voted .vote-item.vote-up:hover {
|
||
background: #e4fae2;
|
||
background: -moz-linear-gradient(top, #e4fae2 0%, #b0e3ac 100%);
|
||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e4fae2), color-stop(100%,#b0e3ac));
|
||
background: -webkit-linear-gradient(top, #e4fae2 0%,#b0e3ac 100%);
|
||
background: -o-linear-gradient(top, #e4fae2 0%,#b0e3ac 100%);
|
||
background: -ms-linear-gradient(top, #e4fae2 0%,#b0e3ac 100%);
|
||
background: linear-gradient(top, #e4fae2 0%,#b0e3ac 100%);
|
||
|
||
border-color: #e4fae2 #ccefca #afe3ab;
|
||
}
|
||
.vote-topic.not-voted .vote-item.vote-up:hover i { background-image: url(../images/icons/vote-up-positive.png); }
|
||
.vote-topic.not-voted .vote-item.vote-up:hover span { border-color: transparent; }
|
||
|
||
.vote-topic .vote-item.vote-count { color: #628fa5; line-height: 23px; border-left: transparent; border-right: transparent; }
|
||
.vote-topic .vote-item.vote-count i { background-image: url(../images/icons/vote-abstain.png); margin-top: 1px; }
|
||
.vote-topic .vote-item.vote-count span { padding: 1px 4px 5px 5px; }
|
||
.topic .vote-topic.vote-not-self.not-voted.vote-not-expired .vote-item.vote-count:hover {
|
||
background: #4ec4ff;
|
||
background: -moz-linear-gradient(top, #4ec4ff 0%, #22b3fe 100%);
|
||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4ec4ff), color-stop(100%,#22b3fe));
|
||
background: -webkit-linear-gradient(top, #4ec4ff 0%,#22b3fe 100%);
|
||
background: -o-linear-gradient(top, #4ec4ff 0%,#22b3fe 100%);
|
||
background: -ms-linear-gradient(top, #4ec4ff 0%,#22b3fe 100%);
|
||
background: linear-gradient(top, #4ec4ff 0%,#22b3fe 100%);
|
||
|
||
-webkit-box-shadow: 0 -1px 0 rgba(255,255,255,.3) inset;
|
||
box-shadow: 0 -1px 0 rgba(255,255,255,.3) inset;
|
||
border-color: #27ace8;
|
||
}
|
||
.vote-topic.not-voted .vote-item.vote-count:hover i { background-image: url(../images/icons/vote-abstain-hover.png); }
|
||
.vote-topic.not-voted .vote-item.vote-count:hover span { border-color: transparent; }
|
||
|
||
.vote-topic .vote-item.vote-down { border-radius: 15px 0 0 15px; }
|
||
.vote-topic .vote-item.vote-down i { background-image: url(../images/icons/vote-down.png); }
|
||
.vote-topic .vote-item.vote-down span { padding: 2px 4px 3px 7px; }
|
||
.vote-topic.not-voted .vote-item.vote-down:hover {
|
||
background: #ffc8c8;
|
||
background: -moz-linear-gradient(top, #ffc8c8 0%, #ff8181 100%);
|
||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffc8c8), color-stop(100%,#ff8181));
|
||
background: -webkit-linear-gradient(top, #ffc8c8 0%,#ff8181 100%);
|
||
background: -o-linear-gradient(top, #ffc8c8 0%,#ff8181 100%);
|
||
background: -ms-linear-gradient(top, #ffc8c8 0%,#ff8181 100%);
|
||
background: linear-gradient(top, #ffc8c8 0%,#ff8181 100%);
|
||
|
||
border-color: #ffc8c8 #fea8a8 #ff8181;
|
||
}
|
||
.vote-topic.not-voted .vote-item.vote-down:hover i { background-image: url(../images/icons/vote-down-negative.png); }
|
||
.vote-topic.not-voted .vote-item.vote-down:hover span { border-color: transparent; }
|
||
|
||
.vote-topic.voted { -webkit-box-shadow: 0 2px 3px rgba(0,0,0,.2) inset; box-shadow: 0 2px 3px rgba(0,0,0,.2) inset; }
|
||
|
||
.vote-topic.voted-down { padding: 0; }
|
||
.vote-topic.voted-down .vote-item { border: none; background: none; }
|
||
.vote-topic.voted-down .vote-item span { border: none; }
|
||
.vote-topic.voted-down .vote-item.vote-down { display: none; }
|
||
.vote-topic.voted-down .vote-item.vote-up span { padding: 4px 8px 3px 4px; }
|
||
.vote-topic.voted-down .vote-item.vote-count { color: #da4242; }
|
||
.vote-topic.voted-down .vote-item.vote-count span { padding: 0 3px 0 10px !important; }
|
||
.vote-topic.vote-count-positive.voted-down .vote-item.vote-up i { background-image: url(../images/icons/vote-down-positive.png); }
|
||
.vote-topic.vote-count-negative.voted-down .vote-item.vote-up i { background-image: url(../images/icons/vote-down-negative.png); }
|
||
|
||
.vote-topic.voted-up { padding: 0; }
|
||
.vote-topic.voted-up .vote-item { border: none; background: none; }
|
||
.vote-topic.voted-up .vote-item span { border: none; }
|
||
.vote-topic.voted-up .vote-item.vote-down { display: none; }
|
||
.vote-topic.voted-up .vote-item.vote-up span { padding: 4px 8px 3px 4px; }
|
||
.vote-topic.voted-up .vote-item.vote-count { float: left; color: #5fa459; }
|
||
.vote-topic.voted-up .vote-item.vote-count span { padding: 0 3px 0 10px !important; }
|
||
.vote-topic.vote-count-positive.voted-up .vote-item.vote-up i { background-image: url(../images/icons/vote-up-positive.png); }
|
||
.vote-topic.vote-count-negative.voted-up .vote-item.vote-up i { background-image: url(../images/icons/vote-up-negative.png); }
|
||
|
||
.vote-topic.voted-zero { padding: 0; }
|
||
.vote-topic.voted-zero .vote-item { border: none; background: none; }
|
||
.vote-topic.voted-zero .vote-item span { border: none; }
|
||
.vote-topic.voted-zero .vote-item.vote-down { display: none; }
|
||
.vote-topic.voted-zero .vote-item.vote-up { }
|
||
.vote-topic.voted-zero .vote-item.vote-up i { width: 16px; background-image: url(../images/icons/vote-abstain.png); }
|
||
.vote-topic.voted-zero .vote-item.vote-up span { padding: 4px 8px 3px 4px; }
|
||
.vote-topic.voted-zero .vote-item.vote-count { float: left; color: #5fa459; }
|
||
.vote-topic.voted-zero .vote-item.vote-count span { padding: 0 3px 0 10px !important; }
|
||
.vote-topic.vote-count-positive.voted-zero .vote-item.vote-up i { background-image: url(../images/icons/vote-abstain-positive.png); }
|
||
.vote-topic.vote-count-negative.voted-zero .vote-item.vote-up i { background-image: url(../images/icons/vote-abstain-negative.png); }
|
||
|
||
.vote-topic.vote-count-positive.vote-nobuttons,
|
||
.vote-topic.vote-count-positive .vote-item.vote-count { -webkit-box-shadow: 0 2px 3px #acd7a7 inset; box-shadow: 0 2px 3px #acd7a7 inset; }
|
||
.vote-topic.vote-count-negative.vote-nobuttons,
|
||
.vote-topic.vote-count-negative .vote-item.vote-count { -webkit-box-shadow: 0 2px 3px #e95e5e inset; box-shadow: 0 2px 3px #e95e5e inset; }
|
||
.vote-topic.vote-count-zero.vote-nobuttons,
|
||
.vote-topic.vote-count-zero .vote-item.vote-count { -webkit-box-shadow: 0 2px 3px #b4d5e2 inset; box-shadow: 0 2px 3px #b4d5e2 inset; }
|
||
|
||
.vote-topic.vote-nobuttons { }
|
||
.vote-topic.vote-nobuttons .vote-item { border: none; }
|
||
.vote-topic.vote-nobuttons .vote-item span { border: none; }
|
||
.vote-topic.vote-nobuttons .vote-item.vote-up,
|
||
.vote-topic.vote-nobuttons .vote-item.vote-down { display: none; }
|
||
.vote-topic.vote-nobuttons .vote-item.vote-count { border-radius: 15px; padding: 0 5px; -webkit-box-shadow: none; box-shadow: none; }
|
||
|
||
.vote-topic.vote-count-positive .vote-item.vote-count { background: #def7dc; color: #5fa459; height: 24px; border: none; }
|
||
.vote-topic.vote-count-positive .vote-item.vote-count span { border: none; padding: 0 7px; }
|
||
.vote-topic.vote-count-positive.voted { background: #def7dc; }
|
||
.vote-topic.vote-count-positive.voted .vote-item.vote-count,
|
||
.vote-topic.vote-count-positive.vote-nobuttons .vote-item.vote-count { -webkit-box-shadow: none; box-shadow: none; background: none; }
|
||
.vote-topic.vote-count-positive.vote-nobuttons { background: #def7dc; }
|
||
|
||
.vote-topic.vote-count-negative .vote-item.vote-count { background: #ff8a8a; color: #da4242; height: 24px; border: none; }
|
||
.vote-topic.vote-count-negative .vote-item.vote-count span { border: none; padding: 0 7px; }
|
||
.vote-topic.vote-count-negative.voted { background: #ff8a8a; }
|
||
.vote-topic.vote-count-negative.voted .vote-item.vote-count,
|
||
.vote-topic.vote-count-negative.vote-nobuttons .vote-item.vote-count { -webkit-box-shadow: none; box-shadow: none; background: none; }
|
||
.vote-topic.vote-count-negative.vote-nobuttons { background: #ff8a8a; }
|
||
|
||
.vote-topic.vote-count-zero .vote-item.vote-count { background: #edf8fd; color: #628fa5; height: 24px; border: none; }
|
||
.vote-topic.vote-count-zero .vote-item.vote-count span { border: none; padding: 0 7px; }
|
||
.vote-topic.vote-count-zero.voted { background: #edf8fd; }
|
||
.vote-topic.vote-count-zero.voted .vote-item.vote-count,
|
||
.vote-topic.vote-count-zero.vote-nobuttons .vote-item.vote-count { -webkit-box-shadow: none; box-shadow: none; background: none; }
|
||
.vote-topic.vote-count-zero.vote-nobuttons { background: #edf8fd; }
|
||
|
||
|
||
/**
|
||
* Избранное
|
||
*/
|
||
.favourite { cursor: pointer; }
|
||
.favourite-toggle {
|
||
display: inline-block;
|
||
width: 11px;
|
||
height: 11px;
|
||
vertical-align: text-top;
|
||
background: url(../images/icons/favourite.png) no-repeat;
|
||
}
|
||
.favourite-toggle.active { background: url(../images/icons/favourite-active.png) no-repeat; }
|
||
.favourite-count { margin-left: 1px; font-size: 11px; line-height: 11px; position: relative; top: -1px; }
|
||
|
||
|
||
/**
|
||
* Пагинация
|
||
*
|
||
* @template pagination.tpl
|
||
* @template comments/comment_pagination.tpl
|
||
*/
|
||
.pagination { overflow: hidden; zoom: 1; color: #aaa; line-height: 1em; margin-top: 5px; }
|
||
|
||
.pagination--list { overflow: hidden; zoom: 1; float: left; margin-left: 50px; }
|
||
.pagination--list:first-child { margin-left: 0; }
|
||
|
||
.pagination--item { float: left; margin-right: 5px; }
|
||
.pagination--item-inner { float: left; padding: 4px 6px; }
|
||
.pagination--item.active .pagination--item-inner { color: #333; border: 1px solid #eee; border-radius: 4px; }
|
||
|
||
|
||
/**
|
||
* Actions
|
||
*/
|
||
.actions { overflow: hidden; zoom: 1; margin-bottom: 10px; font-size: 11px; }
|
||
.actions li { float: left; margin-right: 10px; }
|
||
|
||
|
||
/**
|
||
* Список пользователей
|
||
*/
|
||
.user-list-avatar { overflow: hidden; zoom: 1; }
|
||
.user-list-avatar li { width: 48px; overflow: hidden; float: left; margin-right: 12px; margin-bottom: 12px; text-align: center; font-size: 11px; }
|
||
.user-list-avatar li img { margin-bottom: 2px; display: block; }
|
||
|
||
.user-list-mini li { padding: 0 25px 4px 5px; margin-bottom: 0; position: relative; }
|
||
.user-list-mini li img { width: 17px; height: 17px; position: relative; top: 4px; margin-right: 2px; }
|
||
.user-list-mini li input { position: relative; top: 2px; }
|
||
.user-list-mini li i { position: absolute; top: 4px; right: 5px; cursor: pointer; display: none; }
|
||
.user-list-mini li:hover { background: #fcfce9; }
|
||
.user-list-mini li:hover i { display: block; }
|
||
|
||
|
||
/**
|
||
* Облако тегов
|
||
*/
|
||
.tag-cloud { text-align: center; width: 100%; }
|
||
.tag-cloud li { display: inline; margin-right: 5px; line-height: 22px; }
|
||
.tag-cloud li a { color: #727a90; }
|
||
.tag-cloud li a:hover { color: #f00; }
|
||
.tag-cloud li .tag-size-1 { font-size: 12px; }
|
||
.tag-cloud li .tag-size-2 { font-size: 12px; }
|
||
.tag-cloud li .tag-size-3 { font-size: 14px; }
|
||
.tag-cloud li .tag-size-4 { font-size: 14px; }
|
||
.tag-cloud li .tag-size-5 { font-size: 18px; }
|
||
.tag-cloud li .tag-size-6 { font-size: 18px; }
|
||
.tag-cloud li .tag-size-7 { font-size: 20px; }
|
||
.tag-cloud li .tag-size-8 { font-size: 20px; }
|
||
.tag-cloud li .tag-size-9 { font-size: 22px; }
|
||
.tag-cloud li .tag-size-10 { font-size: 22px; }
|
||
|
||
|
||
/**
|
||
* Item List
|
||
*/
|
||
.item-list { border-top: 1px solid #eee; }
|
||
.item-list li { min-height: 51px; padding: 7px 0 10px 58px; border-bottom: 1px solid #eee; position: relative; zoom: 1; }
|
||
.item-list li p { padding-top: 2px; font-size: 11px; }
|
||
.item-list li a { text-decoration: none; }
|
||
.item-list li .avatar { position: absolute; top: 10px; left: 0; margin-right: 10px; }
|
||
.item-list li .author { font-weight: bold; color: #333; }
|
||
.item-list li .blog-name { font-weight: bold; }
|
||
|
||
|
||
/**
|
||
* Хелперы
|
||
*/
|
||
.wrapper { overflow: hidden; zoom: 1; }
|
||
.wrapper-content { padding: 20px 20px; background: #f8fbfe; }
|
||
.wrapper-content h3 { font-size: 15px; margin-bottom: 10px; font-family: Verdana, sans-serif; }
|
||
.wrapper-content.wrapper-content-dark { padding: 15px 20px; background: #f1f7fd; }
|
||
|
||
|
||
/**
|
||
* Разное
|
||
*/
|
||
.notice-empty { color: #aaa; }
|
||
|
||
.user, .ls-user { font-weight: bold; color: #333; }
|
||
.ls-user { display: inline-block; }
|
||
.user:before, .ls-user:before {
|
||
content: '';
|
||
display: inline-block;
|
||
width: 12px;
|
||
height: 12px;
|
||
margin-right: 4px;
|
||
background: url(../images/icons/ls-user.png) no-repeat;
|
||
vertical-align: middle;
|
||
position: relative;
|
||
top: -1px;
|
||
}
|
||
.user .icon-user { margin-right: 3px; }
|
||
.username.inactive,
|
||
.user.inactive { color: #aaa !important; cursor: help; }
|
||
|
||
.user-avatar img { width: 16px; height: 16px; vertical-align: middle; margin-right: 1px; }
|
||
.user-avatar a { color: #000; font-size: 11px; }
|
||
.user-avatar.user-avatar-n a { color: #3F8AD7; font-size: 12px; }
|
||
|
||
.counter.exceeded { color: #f00; }
|
||
|
||
.page-header-menu { overflow: hidden; zoom: 1; margin-bottom: 10px; }
|
||
.page-header-menu .page-header { float: left; margin-right: 20px; margin-bottom: 10px; }
|
||
.page-header-menu .nav.nav-pills { margin-top: 5px; float: left; }
|
||
|
||
.blog-list-info { width: 19px; height: 19px; display: inline-block; background-repeat: no-repeat; background-image: url(../images/icons/dropdown.png); cursor: pointer; }
|
||
.blog-list-info:hover,
|
||
.blog-list-info.open { background-image: url(../images/icons/dropdown-hover.png); }
|
||
|
||
|
||
/**
|
||
* More
|
||
*/
|
||
.get-more {
|
||
margin-top: 30px;
|
||
border-radius: 5px;
|
||
display: block;
|
||
text-align: center;
|
||
padding: 12px 0;
|
||
color: #258fa7;
|
||
text-decoration: none;
|
||
cursor: pointer;
|
||
background: #eefbfc;
|
||
background: -moz-linear-gradient(top, #eefbfc 0%, #d3edf8 100%);
|
||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eefbfc), color-stop(100%,#d3edf8));
|
||
background: -webkit-linear-gradient(top, #eefbfc 0%,#d3edf8 100%);
|
||
background: -o-linear-gradient(top, #eefbfc 0%,#d3edf8 100%);
|
||
background: -ms-linear-gradient(top, #eefbfc 0%,#d3edf8 100%);
|
||
background: linear-gradient(top, #eefbfc 0%,#d3edf8 100%);
|
||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eefbfc', endColorstr='#d3edf8',GradientType=0 );
|
||
}
|
||
.get-more:hover { background: #eefbfc; color: #258fa7; }
|
||
.get-more.loading { background: #eefbfc url(../images/loader.gif) 50% 50% no-repeat; text-indent: -9999px; }
|
||
|
||
|
||
/**
|
||
* Вложенный список
|
||
*/
|
||
.nested-list .nested-list-item { margin-bottom: 3px; }
|
||
.nested-list .nested-list-item a { display: block; margin-bottom: 1px; padding: 5px 10px; border-radius: 3px; }
|
||
.nested-list .nested-list-item.active a { color: #fff; text-decoration: none; background: #3ABCFF; }
|
||
|
||
|
||
/**
|
||
* Список с пунктиром
|
||
*/
|
||
.dotted-list { margin-bottom: 50px; }
|
||
|
||
.dotted-list-item { margin-bottom: 5px; position: relative; overflow: hidden; }
|
||
.dotted-list-item:after { content: ""; position: absolute; top: 14px; left: 0; width: 100%; height: 0; border-bottom: 1px dotted #bbb; z-index: 5; }
|
||
|
||
.dotted-list-item-label { padding-right: 3px; float: left; background: #fff; position: relative; z-index: 10; }
|
||
|
||
.dotted-list-item-value { padding-left: 3px; float: right; width: 190px; font-weight: normal; background: #fff; position: relative; z-index: 10; }
|
||
|
||
|
||
|
||
/**
|
||
* Progress Bar
|
||
*/
|
||
.progress-bar { height: 25px; width: 100%; background: #8BC4E0; color: #fff; overflow: hidden; position: relative; border-radius: 3px; }
|
||
.progress-bar-value {
|
||
height: 25px;
|
||
background: #149bdf;
|
||
background: -moz-linear-gradient(top, #149bdf 0%, #0480be 100%);
|
||
background: -webkit-gradient(left top, left bottom, color-stop(0%, #149bdf), color-stop(100%, #0480be));
|
||
background: -webkit-linear-gradient(top, #149bdf 0%, #0480be 100%);
|
||
background: -o-linear-gradient(top, #149bdf 0%, #0480be 100%);
|
||
background: -ms-linear-gradient(top, #149bdf 0%, #0480be 100%);
|
||
background: linear-gradient(to bottom, #149bdf 0%, #0480be 100%);
|
||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#149bdf', endColorstr='#0480be', GradientType=0 );
|
||
}
|
||
.progress-bar-label { height: 25px; width: 100%; line-height: 25px; text-align: center; position: absolute; top: 0; left: 0; color: #fff; } |