Highlight Resource Tabs - Tab tài nguyên đổi bật

[PVS]

Highlight Resource Tabs - Tab tài nguyên đổi bật

Mô tả: Add-on này quy định các tab nổi bật (mặc định nổi bật là tab Discussion and Overview với màu @primaryLighter)

​

* Ở đây được đánh dấu là tab Discussion. Tab Overview chỉ là một tab lựa chọn và màu cam được thiết lập trong Style Properties.

Sửa đổi mã trong template sau đây:

• EXTRA.css

Yêu cầu:

• XenForo Resource Manager
• Tiện ích này làm việc với XenForo v1.3x trở lên
• Chỉ thử nghiệm trên template mặc định

Cài đặt:

1. Trong ACP đến Appearance > Templates > EXTRA.css
2. Thêm code sau vào EXTRA.css:
   

   /* START - HIGHLIGHT RESOURCE TABS */
   .tabs .resourceTabDescription {
       background: url("@imagePath/xenforo/gradients/form-button-white-25px.png") repeat-x;
       background-color: @primaryLighter;
       border-top-right-radius: 5px;
       border-top-left-radius: 5px;
   }
   
   .tabs .resourceTabDiscussion {
       background: url("@imagePath/xenforo/gradients/form-button-white-25px.png") repeat-x;
       background-color: @primaryLighter;
       border-top-right-radius: 5px;
       border-top-left-radius: 5px;
   }
   
   .tabs li a, .tabs.noLinks li {
       background: none;
   }
   /* END - HIGHLIGHT RESOURCE TABS */

Tùy chọn bổ sung:

• Loại bỏ nổi bật từ tab Overview

Xóa code sau trong bản gốc:

.tabs .resourceTabDescription {
    background: url("@imagePath/xenforo/gradients/form-button-white-25px.png") repeat-x;
    background-color: @primaryLighter;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
}

• Loại bỏ nổi bật từ tab Discussion

Xóa code sau trong bản gốc:

.tabs .resourceTabDiscussion {
    background: url("@imagePath/xenforo/gradients/form-button-white-25px.png") repeat-x;
    background-color: @primaryLighter;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
}

• Làm thế nào để làm nổi bật tab Updates

Thêm code sau vào cuối:

.tabs .resourceTabUpdates {
    background: url("@imagePath/xenforo/gradients/form-button-white-25px.png") repeat-x;
    background-color: @primaryLighter;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
}

• Làm thế nào để làm nổi bật tab Version History

Thêm code sau vào cuối:

.tabs .resourceTabHistory {
    background: url("@imagePath/xenforo/gradients/form-button-white-25px.png") repeat-x;
    background-color: @primaryLighter;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
}

• Làm thế nào để làm nổi bật tab Reviews

Thêm code sau vào cuối:

.tabs .resourceTabReviews {
    background: url("@imagePath/xenforo/gradients/form-button-white-25px.png") repeat-x;
    background-color: @primaryLighter;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
}

*Chỉnh sửa background-color cho phù hợp với nhu cầu của bạn.

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

Nguồn: xenforo.com​

 

[namchelsea]

Cho mình hỏ làm sao tạo được nhiều tab như này