Diễn Đàn Hỗ Trợ FM

Diễn Đàn Hỗ Trợ FM


[Code] "Câu trả lời tốt nhất" riêng cho skin IPB (punBB)

vi01239984564
vi01239984564
MOD
Bài viết : 88
Points : 192
Like : 16
Invision
An toàn

[Code] "Câu trả lời tốt nhất" riêng cho skin IPB (punBB) Empty [Code] "Câu trả lời tốt nhất" riêng cho skin IPB (punBB)

Bài gửi by vi01239984564 27.05.18 16:45

Demo:

Mã này chỉ thích hợp với giao diện IPB phiên bản PunBB: http://www.hotrofm.net/t695-topic#3374
1. Tìm phần này trong viewtopic_body và xoá nó đi
Code:
<div id="p{postrow.displayed.U_POST_ID}" class="posthead"{postrow.displayed.THANK_BGCOLOR}>
<span style="float:right; font-size: 12px;"><a href="{postrow.displayed.POST_URL}">#{postrow.displayed.COUNT_POSTS}</a></span>
<h4 class="username"><span class="creator">{postrow.displayed.POSTER_NAME}</span> <span style="margin-left: 5px; margin-top: -3px;">{postrow.displayed.ONLINE_IMG}</span></h4>
</div>

2. Thay nó bằng đoạn:
Code:
<div class="post post--{postrow.displayed.U_POST_ID}"{postrow.displayed.THANK_BGCOLOR} style="{postrow.displayed.DISPLAYABLE_STATE}">

3. Tìm đoạn này, copy nó, rồi xóa:
Code:
<p style="color: #a4a4a4; font-size: 12px;">Posted <span class="data-post">{postrow.displayed.POST_DATE_NEW}</span></p>

4. Thay bằng:
Code:
<div class="post-entry">

5. Thêm vào CSS:
Code:
.icon {
    max-height: 8px;
    vertical-align: baseline;
}
.post_feature_box {
      margin-top: 5px;
      max-width:100%;
      background-color: rgb(234, 248, 226);
      border: 1px dotted rgb(51, 51, 51);
      padding: 6px;
      min-height: 60px;
}
#best-res {
    color: #436500;
    background: #dfedd1;
    text-shadow: rgba(255,255,255,0.8) 0px 1px 0px;
    border: 1px solid #accf8b;
    border-top: 0;
    padding: 0 12px;
    height: 30px;
    line-height: 30px;
    position: relative;
    float: right;
    margin: -1px -2px 8px 8px;
    -webkit-border-bottom-left-radius: 3px;
    -webkit-border-bottom-right-radius: 3px;
    -moz-border-radius: 0px 0px 3px 3px;
    border-radius: 0px 0px 3px 3px;
}
.ipsUserPhoto {
    float: left;
    padding: 1px;
    border: 1px solid #d5d5d5;
    background: #fff;
    -webkit-box-shadow: 0px 2px 2px rgba(0,0,0,0.1);
    -moz-box-shadow: 0px 2px 2px rgba(0,0,0,0.1);
    box-shadow: 0px 2px 2px rgba(0,0,0,0.1);
    margin-right: 8px;
}
.ipsUserPhoto:hover {
    border-color: #7d7d7d;
}
.ipsUserPhoto img {
    width: 50px;
    height: 50px;
}
.ipsBadgee {
    background: #7ba60d;
    display: inline-block;
    height: 16px;
    line-height: 16px;
    padding: 0 5px;
    font-size: 9px;
    font-weight: bold;
    text-transform: uppercase;
    color: #fff;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    vertical-align: middle;
    margin-right: 8px;
}

6. Tạo một JS mới:
Code:
$(function(){
        $('.posthead[style="background-color:#eaf8e2;"]').append('<div id="best-res" class="answerBadgeInPost">✓  Best Answer</div>').attr('style','background-image: -moz-linear-gradient(top, rgba(255,255,255,0.3) 0%, rgba(255,255,255,0) 100%);background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0.3)), color-stop(100%,rgba(255,255,255,0)));
    background-image: -webkit-linear-gradient(top, rgba(255,255,255,0.3) 0%,rgba(255,255,255,0) 100%);background-image: -o-linear-gradient(top, rgba(255,255,255,0.3) 0%,rgba(255,255,255,0) 100%);background-image: -ms-linear-gradient(top, rgba(255,255,255,0.3) 0%,rgba(255,255,255,0) 100%);background-image: linear-gradient(to bottom, rgba(255,255,255,0.3) 0%,rgba(255,255,255,0) 100%);-webkit-box-shadow: inset rgba(255,255,255,0.35) 0px 1px 0px;-moz-box-shadow: inset rgba(255,255,255,0.35) 0px 1px 0px;box-shadow: inset rgba(255,255,255,0.35) 0px 1px 0px;background: #dfedd1;text-shadow: rgba(255,255,255,0.8) 0px 1px 0px;border: 1px solid #accf8b;');
        var topicauthor = $('.posthead #best-res').parents('.posthead').find('.creator').html();
        var topicavatar = $('.post #best-res').parents('.post').find('.postmain .postbody .user .user-ident .user-basic-info a img').attr('src');
        var urlavt= $('.post best-res').parents('.post').find('.postmain .postbody .user .user-ident .user-basic-info a').attr('href');
        var topicpost = $('.posthead #best-res').parents('.posthead').find('a.post-number').attr('href');
        var topicdata = $('.post #best-res').parents('.post').find('span.data-post').html();
        var bestTopic = $('.post #best-res').parents('.post').find('.entry-content').html();
    if($('#best-res').length){
        $('.main.paged').before('<div class="post_feature_box">
    <span class="ipsUserPhoto"><img src="'+topicavatar+'" /></span>
    <span class="ipsBadgee">Best Answer</span> '+topicauthor+'
 - '+topicdata+'<div style="border: 1px solid #ddd; border-bottom: 1px solid #ececec; margin: 3px;"></div><div style="display: inline-block;">'+bestTopic+'</div>   <a href="'+topicpost+'">
            <span class="ipsBadgee" style="background: #B3B3B3;font-weight: normal !important;">Go to the full post &nbsp;<img class="icon" src="http://i.imgur.com/omzqZnf.png"></span></a>
    </div>');}
        });