Làm đẹp giao diện cho addon Modern Statistics

1,882 1 3
PVS

PVS

Super Moderator
Thành viên BQT
Tham gia
28/02/2015
Bài viết
16,829
Được Like
12,687
Làm đẹp giao diện cho addon Modern Statistics

Để làm được điều này, trước tiên các bạn cần phải cài addon Modern Statistics, các bạn có thể download tại đây.

Rất đơn giản, đầu tiên các bạn download file đính kèm và upload lên theo đường dẫn: styles/brivium/ModernStatistic

Tiếp theo vào ACP tìm template: BRMS_ModernStatistic.css

Sau đó thay toàn bộ code trong template BRMS_ModernStatistic.css bằng đoạn code sau:

Mã: 
@charset "UTF-8";

/* --- BRMS_ModernStatistic.css --- */

.BRMSContainer
{
    color: #333;
background-color: rgb(255, 255, 255);
margin: auto auto 13px;
-webkit-border-top-left-radius: 0; -moz-border-radius-topleft: 0; -khtml-border-top-left-radius: 0; border-top-left-radius: 0;
-webkit-border-top-right-radius: 0; -moz-border-radius-topright: 0; -khtml-border-top-right-radius: 0; border-top-right-radius: 0;
-webkit-border-bottom-right-radius: 3px; -moz-border-radius-bottomright: 3px; -khtml-border-bottom-right-radius: 3px; border-bottom-right-radius: 3px;
-webkit-border-bottom-left-radius: 3px; -moz-border-radius-bottomleft: 3px; -khtml-border-bottom-left-radius: 3px; border-bottom-left-radius: 3px;
font: 13px/18px 'Roboto Condensed', sans-serif;
height: 100%;

}

.BRMSContainer .brmsStatisticHeader
{
    display: block;
margin: auto 10px !important;

}

.BRMSContainer.brmsLeftTabs .brmsStatisticHeader,
.BRMSContainer.brmsRightTabs .brmsStatisticHeader{
    float: left;
    width: 151px;
    position: relative;
    top: 0;
    z-index: 10;
}
.BRMSContainer.brmsRightTabs .brmsStatisticHeader{
    float: right;
}
.BRMSContainer.brmsTopTabs .brmsStatisticHeader{
    height: 30px;
    padding: 5px 0;
    border-bottom: 1px solid rgb(239, 242, 247);
}

.brmlShow{
    display:block;
}
.brmlHide{
    display:none;
}

.BRMSContainer .brmsConfigList{
    text-align: center;

}

.BRMSContainer.brmsLeftTabs .brmsConfigList,
.BRMSContainer.brmsRightTabs .brmsConfigList{
    margin-bottom:10px;
}
.BRMSContainer.brmsTopTabs .brmsConfigList{
    float:right;
    height: 30px;
}

.BRMSContainer .brmsConfigList .brmsConfigBtn
{
    padding: 7px 10px;
margin: 0;
display: inline-block;
cursor: pointer;
font-weight: bold;
line-height: 14px;
height: 14px;

}

.brmsConfigBtn:hover
{
    background: #f6f6f6;
}
.BRMSContainer.brmsRightTabs .brmsConfigList .brmsConfigBtn
{
    margin-right:0px;
    margin-left:5px;
}
.BRMSContainer .brmsConfigList .brmsConfigBtn.last
{
    margin-right:0;
}

.BRMSContainer ul.brmsTabNav
{

}

.BRMSContainer.brmsLeftTabs ul.brmsTabNav{
    border: 1px solid #DDD;
    border-right-width: 0;
}
.BRMSContainer.brmsRightTabs ul.brmsTabNav{
    border: 1px solid #DDD;
    border-left-width: 0;
}
.BRMSContainer.brmsTopTabs ul.brmsTabNav{
    height: 30px;
}
.BRMSContainer ul.brmsTabNav > li
{
    font-size: 1.11em;
margin: auto;
border: 0px solid #DDD;
list-style-type: none;
display: block;

}

.BRMSContainer ul.brmsTabNav > li:last-child
{
    border-bottom: none;
}

.BRMSContainer.brmsRightTabs ul.brmsTabNav > li{
    border-bottom-width: 1px;
    border-left-width: 1px;
}
.BRMSContainer.brmsLeftTabs ul.brmsTabNav > li{
    border-right-width: 1px;
    border-bottom-width: 1px;
}
.BRMSContainer.brmsTopTabs ul.brmsTabNav > li{
    border-bottom: none;
    float:left;
    position: relative;
}
.BRMSContainer ul.brmsTabNav > li.current
{
    color: black;
background-color: #eff2f7;

}
.BRMSContainer.brmsLeftTabs ul.brmsTabNav > li.current
{
    z-index: 10;
}
.BRMSContainer.brmsRightTabs ul.brmsTabNav > li.current
{
    z-index: 10;
}
.BRMSContainer.brmsLeftTabs ul.brmsTabNav > li.first{
}
.BRMSContainer.brmsRightTabs ul.brmsTabNav > li.first{
}

.BRMSContainer.brmsLeftTabs ul.brmsTabNav > li.last
{
}
.BRMSContainer.brmsRightTabs ul.brmsTabNav > li.last
{
}
.BRMSContainer.brmsTopTabs ul.brmsTabNav > li.first{

}
.BRMSContainer.brmsTopTabs ul.brmsTabNav > li.last
{
}
.BRMSContainer.brmsTopTabs ul.brmsTabNav > li.current
{
    height: 30px;
}
.BRMSContainer.brmsLeftTabs ul.brmsTabNav > li.first.current,
.BRMSContainer.brmsRightTabs ul.brmsTabNav > li.first.current
{
    border-bottom-width: 1px;
}

.BRMSContainer.brmsTopTabs ul.brmsTabNav > li.first.current
{
    border-bottom: none;
}

.BRMSContainer ul.brmsTabNav > li a
{
    font-size: 14px;
font-family: 'Roboto',sans-serif;
color: rgb(36, 111, 175);
text-decoration: none;
margin: 0px;
outline: none;
display: block;
text-align: left;

}

.BRMSContainer ul.brmsTabNav > li.current a
{
}

.BRMSContainer ul.brmsTabNav > li a span{
    display:block;
}
.BRMSContainer ul.brmsTabNav > li a span.description
{
    float:left;
    display:block;
    font-weight:normal;
}
.BRMSContainer.brmsLeftTabs ul.brmsTabNav > li a,
.BRMSContainer.brmsRightTabs ul.brmsTabNav > li a
{
    padding: 15px 10px;
}

.BRMSContainer.brmsTopTabs ul.brmsTabNav > li a
{
    line-height: 30px;
    padding: 0 15px;
}
.BRMSContainer.brmsTopTabs ul.brmsTabNav > li a span.description{
    display:none;
}



.BRMSContainer .brmsTabContent
{
    padding: 10px;
display: none;

}
.BRMSContainer.brmsLeftTabs .brmsTabContent,
.BRMSContainer.brmsRightTabs .brmsTabContent{
    margin-left: 165px;
    position: relative;
    z-index: 9;
    min-height:247px;
}
.BRMSContainer.brmsRightTabs .brmsTabContent{
    margin-right: 165px;
    margin-left: 0;
}
.BRMSContainer .brmsTabContent ol.brmsContentList{
    counter-reset: numList;

}
.BRMSContainer .brmsTabContent ol.brmsContentList li{
    padding: 0;
border-top: 1px solid rgb(239, 242, 247);
float: left;
width: 100%;

}

.BRMSContainer .brmsTabContent ol.brmsContentList li.first{
    border-top: 1px none black;

}
.BRMSContainer .itemContent{
    padding: 7px 0px;
-moz-transition: all .2s ease-out;
-ms-transition: all .2s ease-out;
-o-transition: all .2s ease-out;
transition: all .2s ease-out;
display: table;
table-layout: fixed;
word-wrap: normal;
width: 100%;

}
.BRMSContainer .itemContent:hover{
    background-color: #eff2f7;
padding-right: 6px;
padding-left: 6px;
-webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;

}
.BRMSContainer .itemContent .listBlock {
    display: table-cell;
    vertical-align: middle;
}

.brmsIcoRefresh{
    background-image: url('styles/brivium/ModernStatistic/BRMS_refresh.png');
}

.brmsIcoConfig,
.brmsIcoList,
.brmsIcoLayout
{
    background: url('styles/brivium/ModernStatistic/vnxf-images.png') no-repeat;
}

.BRMSContainer .itemContent .counter{
    display: none;

}

.BRMSContainer .itemContent .itemTitle{
    width: auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 65%;
}

.BRMSContainer .itemContent .itemTitle a
{
    color: rgb(56, 68, 95);
}

.BRMSContainer .itemContent .itemTitle a:hover
{
    color: rgb(56, 68, 91);
}

.BRMSContainer .itemUser .itemContent .itemTitle{
    width: auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 35%;
}
.BRMSContainer .itemContent .itemDetail {
        width: 150px;
    max-width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.BRMSContainer .itemContent .itemDetail.itemDate {
        width: 200px;
    max-width: 200px;
}

.BRMSContainer .itemContent .itemDetail,
.BRMSContainer .itemContent .itemDetail a{
    color: rgb(56, 68, 95);
    font-size: 14px;
    text-align: right;
}
.BRMSContainer .itemUser .itemContent .itemDetail,
.BRMSContainer .itemUser .itemContent .itemDetail a{
    font-size: 14px;
}
.BRMSContainer .itemContent .itemDetailDate a.paint {
    color: rgb(146, 165, 180);
}
.BRMSContainer .itemContent .itemDetailDate > span {
    font-size: 0.8em;
    color: rgb(200,200,200);
}

.BRMSContainer .itemUser .itemContent .itemDetailMain{
    text-align:right;
}
.BRMSContainer .itemUser .itemContent .itemDetailMain strong{
    font-weight: bold;
}
.BRMSContainer .itemContent .itemDetailName{
    text-align:right;
}
.BRMSContainer .itemContent .itemDetailName a.username span {
    font-weight: bold;
    font-size: 14px;
}

.BRMSContainer .newItemCounter {
    font-weight: bold;
font-size: 10px;
color: white;
background-color: #e03030;
padding: 0 3px;
-webkit-border-radius: 2px; -moz-border-radius: 2px; -khtml-border-radius: 2px; border-radius: 2px;
position: absolute;
line-height: 16px;
min-width: 12px;
text-align: center;
white-space: nowrap;
word-wrap: normal;
right: 2px;
top: -10px;
z-index: 100;
-webkit-box-shadow: 2px 2px 5px rgba(0,0,0, 0.25); -moz-box-shadow: 2px 2px 5px rgba(0,0,0, 0.25); -khtml-box-shadow: 2px 2px 5px rgba(0,0,0, 0.25); box-shadow: 2px 2px 5px rgba(0,0,0, 0.25);
height: 16px;

}

.BRMSContainer .newItemCounter .totalNumber {

}

.BRMSContainer .newItemCounter .arrow {
    border: 5px solid transparent;
border-top-color: #e03030;
border-bottom: 1px none black;
position: absolute;
right: 3px;
line-height: 0px;
_display: none;
bottom: -4px;
z-index: 100;
width: 0px;
height: 0px;

}

.BRMSContainer .brmsNewItem .itemContent{
    -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;

}

.BRMSContainer .brmsNewItem .itemContent:hover {
    background: #FFEAE7 !important;
}

.BRMSContainer .brmsSticky .itemContent{
    color: rgb(238, 62, 87);
-webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;

}

.BRMSContainer .brmsSticky .itemContent:hover {
    background: #fff1ba !important;
}

.clear{
    clear:both;
}
.BRMSContainer .xenTooltip{
    position: absolute;
    margin: -50px 0px 0px 60px;
    z-index:999;
}


.BRMSContainer .brmsRefresh{

}

.brmsIco{
    height:14px;
    width:14px;
    display:block;
}
.brmsDropdownToggle{
    position:relative;
}
.brmsDropdownMenu{
    font-size: 14px;
background-color: #FFF;
margin: 0px 0 0;
display: none;
position: absolute;
z-index: 999;
text-align: left;
top: 100%;
left: -1px;
float: left;
min-width: 160px;
background-clip: padding-box;

}
.brmsDropdownMenu li{
    color: rgb(79, 92, 119);
background-color: #FAFAFA;
border: 1px solid #E4E4E4;
border-top: 1px none black;

}
.brmsDropdownMenu li.current,
.brmsDropdownMenu li:hover{
    background-color: #f6f6f6;

}

.brmsDropdownMenu.left{
    left: 99%;
    top: -1px;
}
.brmsDropdownMenu.right{
    right: 99%;
    top: -1px;
    left: -160px;
}
.brmsDropdownMenu.edge{
    right: -1px;
    left: -160px;
}

.brmsDropdownMenu li.first
{
    border: 1px solid #E4E4E4;
}
.brmsDropdownMenu a {
    font-size: 12px;
color: #6A6A6A;
padding: 8px 10px;
display: block;
clear: both;
font-weight: normal;
white-space: nowrap;

}
.BRMSContainer.brmsLeftTabs .brmsTabNavHidden .brmsDropdownMenu{
    top: -1px;
    left: 99%;
}
.BRMSContainer.brmsRightTabs .brmsTabNavHidden .brmsDropdownMenu{
    right: 99%;
    top: -1px;
    left: -160px;
}
.BRMSContainer ul.brmsTabNav > li.brmsTabNavHiddenMenu {
    display:none;
}

.brmsTabNavHidden li{
    display:none;
}
.brmsTabNavHidden > a {
    text-align:center;
}
.BRMSContainer.brmsTopTabs .brmsTabNavHidden {
    height:30px;
    text-align:center;
}
.BRMSContainer.brmsTopTabs .brmsTabNavHidden > a {
    height: 100%;
    text-align:center;
}


.brmsDropdownToggle:hover .brmsDropdownMenu{
    display:block;
}

.brmsIcoRefresh{
    width: 14px;
    height: 16px;
}

.brmsConfigBtn:hover .brmsIcoRefresh
{
    background:url('styles/brivium/ModernStatistic/BRMS_refresh.gif') center center no-repeat;
}
.brmsIcoConfig{
    background-position:center -219px;
}
.brmsIcoList{
    background-position: center -302px;
}
.brmsIcoLayout{
    background-position: center -341px;
}
.brmsIcoLoader{
    background:url('styles/brivium/ModernStatistic/loader7.gif') no-repeat center center;
    width:220px;
    height:19px;
    display:block;
    margin: auto;
}

.BRMSContainer .itemContent .itemDetail.itemDetailDate
{
    display: none !important;
}
@media (max-width:800px)
{

}

@media (max-width:610px)
{

}

@media (max-width:480px)
{

}

Lưu lại và thưởng thức.
Demo:

1.png


2.png


3.png

Chúc các bạn thành công.


PVS - Vnxf
Nguồn code: mamcongnghe.com​
 

Đính kèm

  • BRMS.zip
    6.3 KB · Lượt xem: 57
Bài viết liên quan
Làm thế nào đẻ tối ưu mấy cái này xanh hết trên Xenforo? bởi gameboiz1806,
Ở footer của mình bị hiển thị như này. Không biết làm ntn để ẩn được? bởi gameboiz1806,
Làm thế nào để gửi email cho users về các thread mới 1 tuần một lần? bởi gameboiz1806,
Làm thế nào để tinh giảm code CSS và Javascript trên xenforo? bởi gameboiz1806,
Làm như thế nào để chèn code vào thẻ <head> trên xenforo vậy ạ? bởi gameboiz1806,
Làm như thế nào để thay đổi URL như này ạ? bởi gameboiz1806,
Được quan tâm
Làm thế nào đẻ tối ưu mấy cái này xanh hết trên Xenforo? bởi gameboiz1806,
Bài viết mới
Làm thế nào đẻ tối ưu mấy cái này xanh hết trên Xenforo? bởi gameboiz1806,
Ở footer của mình bị hiển thị như này. Không biết làm ntn để ẩn được? bởi gameboiz1806,
File Attachment nằm ở đâu trên fpt hosting vậy cả nhà nhỉ bởi bloghocpiano,
Mình đã cài Litespeed nhưng LS không nhận bởi gameboiz1806,
Làm thế nào để gửi email cho users về các thread mới 1 tuần một lần? bởi gameboiz1806,
gặp sự cố khi upgrade bởi sanhpv,
Mr.Yellow

Mr.Yellow

Gefreiter
Tham gia
24/06/2015
Bài viết
99
Được Like
106
Update code cho nhiều bạn dùng style dark ^^

Upload vào thư mục dark và copy code này vào temp thôi nhé

@charset "UTF-8";

/* --- BRMS_ModernStatistic.css --- */

.BRMSContainer
{
color: #333;
background-color: rgb(255, 255, 255);
margin: auto auto 13px;
-webkit-border-top-left-radius: 0; -moz-border-radius-topleft: 0; -khtml-border-top-left-radius: 0; border-top-left-radius: 0;
-webkit-border-top-right-radius: 0; -moz-border-radius-topright: 0; -khtml-border-top-right-radius: 0; border-top-right-radius: 0;
-webkit-border-bottom-right-radius: 3px; -moz-border-radius-bottomright: 3px; -khtml-border-bottom-right-radius: 3px; border-bottom-right-radius: 3px;
-webkit-border-bottom-left-radius: 3px; -moz-border-radius-bottomleft: 3px; -khtml-border-bottom-left-radius: 3px; border-bottom-left-radius: 3px;
font: 13px/18px 'Roboto Condensed', sans-serif;
height: 100%;

}

.BRMSContainer .brmsStatisticHeader
{
display: block;
margin: auto 10px !important;

}

.BRMSContainer.brmsLeftTabs .brmsStatisticHeader,
.BRMSContainer.brmsRightTabs .brmsStatisticHeader{
float: left;
width: 151px;
position: relative;
top: 0;
z-index: 10;
}
.BRMSContainer.brmsRightTabs .brmsStatisticHeader{
float: right;
}
.BRMSContainer.brmsTopTabs .brmsStatisticHeader{
height: 30px;
padding: 5px 0;
border-bottom: 1px solid rgb(239, 242, 247);
}

.brmlShow{
display:block;
}
.brmlHide{
display:none;
}

.BRMSContainer .brmsConfigList{
text-align: center;

}

.BRMSContainer.brmsLeftTabs .brmsConfigList,
.BRMSContainer.brmsRightTabs .brmsConfigList{
margin-bottom:10px;
}
.BRMSContainer.brmsTopTabs .brmsConfigList{
float:right;
height: 30px;
}

.BRMSContainer .brmsConfigList .brmsConfigBtn
{
padding: 7px 10px;
margin: 0;
display: inline-block;
cursor: pointer;
font-weight: bold;
line-height: 14px;
height: 14px;

}

.brmsConfigBtn:hover
{
background: #f6f6f6;
}
.BRMSContainer.brmsRightTabs .brmsConfigList .brmsConfigBtn
{
margin-right:0px;
margin-left:5px;
}
.BRMSContainer .brmsConfigList .brmsConfigBtn.last
{
margin-right:0;
}

.BRMSContainer ul.brmsTabNav
{

}

.BRMSContainer.brmsLeftTabs ul.brmsTabNav{
border: 1px solid #DDD;
border-right-width: 0;
}
.BRMSContainer.brmsRightTabs ul.brmsTabNav{
border: 1px solid #DDD;
border-left-width: 0;
}
.BRMSContainer.brmsTopTabs ul.brmsTabNav{
height: 30px;
}
.BRMSContainer ul.brmsTabNav > li
{
font-size: 1.11em;
margin: auto;
border: 0px solid #DDD;
list-style-type: none;
display: block;

}

.BRMSContainer ul.brmsTabNav > li:last-child
{
border-bottom: none;
}

.BRMSContainer.brmsRightTabs ul.brmsTabNav > li{
border-bottom-width: 1px;
border-left-width: 1px;
}
.BRMSContainer.brmsLeftTabs ul.brmsTabNav > li{
border-right-width: 1px;
border-bottom-width: 1px;
}
.BRMSContainer.brmsTopTabs ul.brmsTabNav > li{
border-bottom: none;
float:left;
position: relative;
}
.BRMSContainer ul.brmsTabNav > li.current
{
color: black;
background-color: #eff2f7;

}
.BRMSContainer.brmsLeftTabs ul.brmsTabNav > li.current
{
z-index: 10;
}
.BRMSContainer.brmsRightTabs ul.brmsTabNav > li.current
{
z-index: 10;
}
.BRMSContainer.brmsLeftTabs ul.brmsTabNav > li.first{
}
.BRMSContainer.brmsRightTabs ul.brmsTabNav > li.first{
}

.BRMSContainer.brmsLeftTabs ul.brmsTabNav > li.last
{
}
.BRMSContainer.brmsRightTabs ul.brmsTabNav > li.last
{
}
.BRMSContainer.brmsTopTabs ul.brmsTabNav > li.first{

}
.BRMSContainer.brmsTopTabs ul.brmsTabNav > li.last
{
}
.BRMSContainer.brmsTopTabs ul.brmsTabNav > li.current
{
height: 30px;
}
.BRMSContainer.brmsLeftTabs ul.brmsTabNav > li.first.current,
.BRMSContainer.brmsRightTabs ul.brmsTabNav > li.first.current
{
border-bottom-width: 1px;
}

.BRMSContainer.brmsTopTabs ul.brmsTabNav > li.first.current
{
border-bottom: none;
}

.BRMSContainer ul.brmsTabNav > li a
{
font-size: 14px;
font-family: 'Roboto',sans-serif;
color: rgb(36, 111, 175);
text-decoration: none;
margin: 0px;
outline: none;
display: block;
text-align: left;

}

.BRMSContainer ul.brmsTabNav > li.current a
{
}

.BRMSContainer ul.brmsTabNav > li a span{
display:block;
}
.BRMSContainer ul.brmsTabNav > li a span.description
{
float:left;
display:block;
font-weight:normal;
}
.BRMSContainer.brmsLeftTabs ul.brmsTabNav > li a,
.BRMSContainer.brmsRightTabs ul.brmsTabNav > li a
{
padding: 15px 10px;
}

.BRMSContainer.brmsTopTabs ul.brmsTabNav > li a
{
line-height: 30px;
padding: 0 15px;
}
.BRMSContainer.brmsTopTabs ul.brmsTabNav > li a span.description{
display:none;
}



.BRMSContainer .brmsTabContent
{
padding: 10px;
display: none;

}
.BRMSContainer.brmsLeftTabs .brmsTabContent,
.BRMSContainer.brmsRightTabs .brmsTabContent{
margin-left: 165px;
position: relative;
z-index: 9;
min-height:247px;
}
.BRMSContainer.brmsRightTabs .brmsTabContent{
margin-right: 165px;
margin-left: 0;
}
.BRMSContainer .brmsTabContent ol.brmsContentList{
counter-reset: numList;

}
.BRMSContainer .brmsTabContent ol.brmsContentList li{
padding: 0;
border-top: 1px solid rgb(239, 242, 247);
float: left;
width: 100%;

}

.BRMSContainer .brmsTabContent ol.brmsContentList li.first{
border-top: 1px none black;

}
.BRMSContainer .itemContent{
padding: 7px 0px;
-moz-transition: all .2s ease-out;
-ms-transition: all .2s ease-out;
-o-transition: all .2s ease-out;
transition: all .2s ease-out;
display: table;
table-layout: fixed;
word-wrap: normal;
width: 100%;

}
.BRMSContainer .itemContent:hover{
background-color: #eff2f7;
padding-right: 6px;
padding-left: 6px;
-webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;

}
.BRMSContainer .itemContent .listBlock {
display: table-cell;
vertical-align: middle;
}

.brmsIcoRefresh{
background-image: url('styles/brivium/ModernStatistic/dark/BRMS_refresh.png');
}

.brmsIcoConfig,
.brmsIcoList,
.brmsIcoLayout
{
background: url('styles/brivium/ModernStatistic/dark/vnxf-images.png') no-repeat;
}

.BRMSContainer .itemContent .counter{
display: none;

}

.BRMSContainer .itemContent .itemTitle{
width: auto;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
max-width: 65%;
}

.BRMSContainer .itemContent .itemTitle a
{
color: rgb(56, 68, 95);
}

.BRMSContainer .itemContent .itemTitle a:hover
{
color: rgb(56, 68, 91);
}

.BRMSContainer .itemUser .itemContent .itemTitle{
width: auto;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
max-width: 35%;
}
.BRMSContainer .itemContent .itemDetail {
width: 150px;
max-width: 150px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.BRMSContainer .itemContent .itemDetail.itemDate {
width: 200px;
max-width: 200px;
}

.BRMSContainer .itemContent .itemDetail,
.BRMSContainer .itemContent .itemDetail a{
color: rgb(56, 68, 95);
font-size: 14px;
text-align: right;
}
.BRMSContainer .itemUser .itemContent .itemDetail,
.BRMSContainer .itemUser .itemContent .itemDetail a{
font-size: 14px;
}
.BRMSContainer .itemContent .itemDetailDate a.paint {
color: rgb(146, 165, 180);
}
.BRMSContainer .itemContent .itemDetailDate > span {
font-size: 0.8em;
color: rgb(200,200,200);
}

.BRMSContainer .itemUser .itemContent .itemDetailMain{
text-align:right;
}
.BRMSContainer .itemUser .itemContent .itemDetailMain strong{
font-weight: bold;
}
.BRMSContainer .itemContent .itemDetailName{
text-align:right;
}
.BRMSContainer .itemContent .itemDetailName a.username span {
font-weight: bold;
font-size: 14px;
}

.BRMSContainer .newItemCounter {
font-weight: bold;
font-size: 10px;
color: white;
background-color: #e03030;
padding: 0 3px;
-webkit-border-radius: 2px; -moz-border-radius: 2px; -khtml-border-radius: 2px; border-radius: 2px;
position: absolute;
line-height: 16px;
min-width: 12px;
text-align: center;
white-space: nowrap;
word-wrap: normal;
right: 2px;
top: -10px;
z-index: 100;
-webkit-box-shadow: 2px 2px 5px rgba(0,0,0, 0.25); -moz-box-shadow: 2px 2px 5px rgba(0,0,0, 0.25); -khtml-box-shadow: 2px 2px 5px rgba(0,0,0, 0.25); box-shadow: 2px 2px 5px rgba(0,0,0, 0.25);
height: 16px;

}

.BRMSContainer .newItemCounter .totalNumber {

}

.BRMSContainer .newItemCounter .arrow {
border: 5px solid transparent;
border-top-color: #e03030;
border-bottom: 1px none black;
position: absolute;
right: 3px;
line-height: 0px;
_display: none;
bottom: -4px;
z-index: 100;
width: 0px;
height: 0px;

}

.BRMSContainer .brmsNewItem .itemContent{
-webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;

}

.BRMSContainer .brmsNewItem .itemContent:hover {
background: #FFEAE7 !important;
}

.BRMSContainer .brmsSticky .itemContent{
color: rgb(238, 62, 87);
-webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;

}

.BRMSContainer .brmsSticky .itemContent:hover {
background: #fff1ba !important;
}

.clear{
clear:both;
}
.BRMSContainer .xenTooltip{
position: absolute;
margin: -50px 0px 0px 60px;
z-index:999;
}


.BRMSContainer .brmsRefresh{

}

.brmsIco{
height:14px;
width:14px;
display:block;
}
.brmsDropdownToggle{
position:relative;
}
.brmsDropdownMenu{
font-size: 14px;
background-color: #FFF;
margin: 0px 0 0;
display: none;
position: absolute;
z-index: 999;
text-align: left;
top: 100%;
left: -1px;
float: left;
min-width: 160px;
background-clip: padding-box;

}
.brmsDropdownMenu li{
color: rgb(79, 92, 119);
background-color: #FAFAFA;
border: 1px solid #E4E4E4;
border-top: 1px none black;

}
.brmsDropdownMenu li.current,
.brmsDropdownMenu li:hover{
background-color: #f6f6f6;

}

.brmsDropdownMenu.left{
left: 99%;
top: -1px;
}
.brmsDropdownMenu.right{
right: 99%;
top: -1px;
left: -160px;
}
.brmsDropdownMenu.edge{
right: -1px;
left: -160px;
}

.brmsDropdownMenu li.first
{
border: 1px solid #E4E4E4;
}
.brmsDropdownMenu a {
font-size: 12px;
color: #6A6A6A;
padding: 8px 10px;
display: block;
clear: both;
font-weight: normal;
white-space: nowrap;

}
.BRMSContainer.brmsLeftTabs .brmsTabNavHidden .brmsDropdownMenu{
top: -1px;
left: 99%;
}
.BRMSContainer.brmsRightTabs .brmsTabNavHidden .brmsDropdownMenu{
right: 99%;
top: -1px;
left: -160px;
}
.BRMSContainer ul.brmsTabNav > li.brmsTabNavHiddenMenu {
display:none;
}

.brmsTabNavHidden li{
display:none;
}
.brmsTabNavHidden > a {
text-align:center;
}
.BRMSContainer.brmsTopTabs .brmsTabNavHidden {
height:30px;
text-align:center;
}
.BRMSContainer.brmsTopTabs .brmsTabNavHidden > a {
height: 100%;
text-align:center;
}


.brmsDropdownToggle:hover .brmsDropdownMenu{
display:block;
}

.brmsIcoRefresh{
width: 14px;
height: 16px;
}

.brmsConfigBtn:hover .brmsIcoRefresh
{
background:url('styles/brivium/ModernStatistic/dark/BRMS_refresh.gif') center center no-repeat;
}
.brmsIcoConfig{
background-position:center -219px;
}
.brmsIcoList{
background-position: center -302px;
}
.brmsIcoLayout{
background-position: center -341px;
}
.brmsIcoLoader{
background:url('styles/brivium/ModernStatistic/dark/loader7.gif') no-repeat center center;
width:220px;
height:19px;
display:block;
margin: auto;
}

.BRMSContainer .itemContent .itemDetail.itemDetailDate
{
display: none !important;
}
@media (max-width:800px)
{

}

@media (max-width:610px)
{

}

@media (max-width:480px)
{

}
 
Bạn phải đăng nhập hoặc đăng ký để bình luận.
Người đăng Chủ đề tương tự Diễn đàn Trả lời Ngày đăng
PVS Tutorial 2x Prefix - Tùy chỉnh làm đẹp cho prefix của XenForo 2 Tips and Guides 0
PVS Làm đẹp tiền tố (Prefix) cho Xenforo Tips and Guides 10
PVS Làm đẹp khung search Google cho Xenforo Tips and Guides 4
PVS Làm đẹp cho mục Download tập tin đính kèm Tips and Guides 0
nttruong Làm đẹp cho giao diện của các forum con Xenforo Tips and Guides 2

Chủ đề tương tự


Hướng dẫn sử dụng

XenForo 1 XenForo 2
Translate by PVS

Dịch vụ XenForo của VNXF

Mobile/Zalo: 0906081284

Telegram: anhanhxf

Chỉ nhận web nội dung lành mạnh

Xử lý sự cố (Troubleshooting)

Texlink

Liên hệ đặt Textlink
Liên hệ đặt Textlink
Liên hệ đặt Textlink
Liên hệ đặt Textlink

Nhà Tài Trợ

Mút Xốp Không Gian
Mút Sofa Không Gian
Top Bottom