Современный облачный хостинг провайдер | Aéza
Контакты ООО "АЕЗА ГРУПП" ИНН 2312304914 ОГРН 1212300056430
Разделы форума в виде баннеров

Разделы форума в виде баннеров

Обзор FAQ Обновления (1) Отзывы (1) Обсуждение

Перенос последних сообщений вниз и добавление скругленных углов

lastpost.png
Если хотим, чтобы последние сообщения отображались не сбоку "баннера", а понизу, вставляем такой код (модификация с острыми углами):

Код: 
/* Category-bunners */
#XenForo .nodeList .node.level_2 .nodeControls {
    display: none;
}
.category .nodeList .node.level_2 {
    float: left;
    width: 50%;
}
.category .nodeList .node.level_2:nth-child(2n+1) {
    clear: left;
}
.nodeList {
}
.nodeList:after {
    clear: both;
    content: ".";
    display: block;
    height: 0;
    visibility: hidden;
}
.category .nodeList .node.level_2 .nodeText {
    margin-right: 26px;
}
.category .nodeList .node.level_2 .nodeControls {
    right: 8px;
}
.category .nodeList .node.level_2:last-child:nth-child(2n+1) {
    width: 100%;
}
.category .nodeList .node.level_2:last-child:nth-child(2n+1) .nodeText {
    margin-right: 270px;
}
#forums .category .nodeList .categoryForumNodeInfo, #forums .category .nodeList .forumNodeInfo, #forums .category .nodeList .pageNodeInfo, #forums .category .nodeList .linkNodeInfo {
    background-color: white;
    border-bottom: medium none;
}
.primaryContent a {
    white-space: nowrap;
}
.forum_list #forums {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
    border: 0 none;
}
#forums .category .level_2 .nodeInfo {
    border-bottom: 10px solid rgb(255, 255, 255);
    border-left: 1px solid rgb(255, 255, 255);
}
#forums .category .level_2:nth-child(2n) .nodeInfo, #forums .category .level_2:last-child .nodeInfo {
    border-right: 1px solid rgb(255, 255, 255);
}
#forums .lastThreadTitle .prefix {
    margin: 2px 1px !important;
}
#forums .node.level_2 .nodeText {
    margin: 10px 10px 25px 20px;
    position: relative;
}
.category .nodeList .node.level_2 .nodeLastPost {
  padding-right: 20px;
  position: static;
  width: auto;
}
#forums .nodeLastPost {
  height: 37px;
  min-width: 300px;
}
#forums .category .nodeLastPost {
  background: none repeat scroll 0 0 rgba(168, 212, 235, 0.8);
  border: 0 none;
  border-radius: 0;
  margin: 0;
}
#forums .lastThreadTitle .prefix {
  margin: 2px 1px !important;
}
@media (min-width: @maxResponsiveMediumWidth) {
    {xen:helper clearfix, '.nodeList'}
    .node .nodeList li {
        float: left;
        width: 50%;
        box-sizing: border-box;
    }
   .node .nodeList li:nth-child(odd) {
        clear: left;
        padding-right: 5px;
    }
   .node .nodeList li:nth-child(even) {
        padding-left: 5px;
    }
     @media (max-width:1280px){
     .nodeList .node.category .node .nodeText {margin-right: 10px;}
    .nodeList .node.category .node .nodeLastPost, .nodeList .node.category .node .nodeControls {display: none;}
    }
}
/* END Category-bunners */


/* Category-pics */
.nodeList .node_1 .forumNodeInfo {
  background: url("ссылка на изображение") no-repeat;
}
.nodeList .node_2 .forumNodeInfo {
  background: url("ссылка на изображение") no-repeat;
}
.nodeList .node_3 .forumNodeInfo {
  background: url("ссылка на изображение") no-repeat;
}
.nodeList .node_4 .forumNodeInfo {
  background: url("ссылка на изображение") no-repeat;
}
.nodeList .node_5 .forumNodeInfo {
  background: url("ссылка на изображение") no-repeat;
}
.nodeList .node_6 .forumNodeInfo {
  background: url("ссылка на изображение") no-repeat;
}
.nodeList .node_7 .forumNodeInfo {
  background: url("ссылка на изображение") no-repeat;
}
.nodeList .node_8 .forumNodeInfo {
  background: url("ссылка на изображение") no-repeat;
}
.nodeList .node_9 .forumNodeInfo {
  background: url("ссылка на изображение") no-repeat;
}
.nodeList .node_10 .forumNodeInfo {
  background: url("ссылка на изображение") no-repeat;
}
/* END Category-pics */

Где "rgba(168, 212, 235, 0.8)" соответственно, цвет подложки. Где "0.8" интенсивность прозрачности. То есть, если хотим непрозрачную подложку ставим вместо 0,8 единицу. В данном случае у меня серо-голубая плашка, заданная цветом rgba(168, 212, 235, 0.8).
Если не знаете, где взять значения цветов, вот вам в помощь
У Вас недостаточно прав для просмотра ссылок. Вход или Регистрация


То же самое, только со скругленными углами:

Код: 
/* Category-bunners */
#XenForo .nodeList .node.level_2 .nodeControls {
    display: none;
}
.category .nodeList .node.level_2 {
    float: left;
    width: 50%;
}
.category .nodeList .node.level_2:nth-child(2n+1) {
    clear: left;
}
.nodeList {
}
.nodeList:after {
    clear: both;
    content: ".";
    display: block;
    height: 0;
    visibility: hidden;
}
.category .nodeList .node.level_2 .nodeText {
    margin-right: 26px;
}
.category .nodeList .node.level_2 .nodeControls {
    right: 8px;
}
.category .nodeList .node.level_2:last-child:nth-child(2n+1) {
    width: 100%;
}
.category .nodeList .node.level_2:last-child:nth-child(2n+1) .nodeText {
    margin-right: 270px;
}
#forums .category .nodeList .categoryForumNodeInfo, #forums .category .nodeList .forumNodeInfo, #forums .category .nodeList .pageNodeInfo, #forums .category .nodeList .linkNodeInfo {
    background-color: white;
    border-bottom: medium none;
}
.primaryContent a {
    white-space: nowrap;
}
.forum_list #forums {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
    border: 0 none;
}
#forums .category .level_2 .nodeInfo {
    border-bottom: 10px solid rgb(255, 255, 255);
    border-left: 1px solid rgb(255, 255, 255);
    border-radius: 10px;
    border-width: 1px medium medium 1px;
}
#forums .category .level_2:nth-child(2n) .nodeInfo, #forums .category .level_2:last-child .nodeInfo {
    border-right: 1px solid rgb(255, 255, 255);
}
#forums .lastThreadTitle .prefix {
    margin: 2px 1px !important;
}
#forums .node.level_2 .nodeText {
    margin: 10px 10px 25px 20px;
    position: relative;
}
.category .nodeList .node.level_2 .nodeLastPost {
  padding-right: 20px;
  position: static;
  width: auto;
}
#forums .nodeLastPost {
  height: 37px;
  min-width: 300px;
}
#forums .category .nodeLastPost {
  background: none repeat scroll 0 0 rgba(168, 212, 235, 0.8);
  border: 0 none;
  border-radius: 0;
  margin: 0;
}
#forums .lastThreadTitle .prefix {
  margin: 2px 1px !important;
}
@media (min-width: @maxResponsiveMediumWidth) {
    {xen:helper clearfix, '.nodeList'}
    .node .nodeList li {
        float: left;
        width: 50%;
        box-sizing: border-box;
    }
   .node .nodeList li:nth-child(odd) {
        clear: left;
        padding-right: 5px;
    }
   .node .nodeList li:nth-child(even) {
        padding-left: 5px;
    }
     @media (max-width:1280px){
     .nodeList .node.category .node .nodeText {margin-right: 10px;}
    .nodeList .node.category .node .nodeLastPost, .nodeList .node.category .node .nodeControls {display: none;}
    }
}
/* END Category-bunners */


/* Category-pics */
.nodeList .node_1 .forumNodeInfo {
  background: url("ссылка на изображение") no-repeat;
}
.nodeList .node_2 .forumNodeInfo {
  background: url("ссылка на изображение") no-repeat;
}
.nodeList .node_3 .forumNodeInfo {
  background: url("ссылка на изображение") no-repeat;
}
.nodeList .node_4 .forumNodeInfo {
  background: url("ссылка на изображение") no-repeat;
}
.nodeList .node_5 .forumNodeInfo {
  background: url("ссылка на изображение") no-repeat;
}
.nodeList .node_6 .forumNodeInfo {
  background: url("ссылка на изображение") no-repeat;
}
.nodeList .node_7 .forumNodeInfo {
  background: url("ссылка на изображение") no-repeat;
}
.nodeList .node_8 .forumNodeInfo {
  background: url("ссылка на изображение") no-repeat;
}
.nodeList .node_9 .forumNodeInfo {
  background: url("ссылка на изображение") no-repeat;
}
.nodeList .node_10 .forumNodeInfo {
  background: url("ссылка на изображение") no-repeat;
}
/* END Category-pics */
  • Мне нравится
Реакции: Ansandr, pro100nes и Hope
Назад
Сверху Снизу