XF 2 Tip Customize Post bit with Adding Likes & Awards

prvtzone

eleaks.to
Registered
Joined
Jul 29, 2019
Messages
122
Points
53

Reputation:

Untitled.png


How to make that?

Paste bellow code in the extra.less

Code:
.d-flex {
    display: flex;
}
.d-flex {
    position: relative;
    display: flex !important;
}
@media (max-width: 650px) {
    .post-stat, .post-stats {
    display: none !important;
    }
}
.post-stat {
    flex: 0 1 50%;
    margin-left: 16px;
    text-align: center;

}
.post-stats .post-stat:first-child {
    flex: 0 0 50%;
    border-right: 1px solid #2f3136;
}
.justify-content-center {
    justify-content: center;
    margin-right: 38px;
    padding-left: 15px;
}

Put below code in message_macro file ,
Code:
            <div class="d-flex align-items-center justify-content-center flex-wrap post-stats">
                <div class="post-stat">
                    <span class="largetext">
                        <strong style="color:green; text-align: center;">{$user.af_as_award_total|number}</strong>
                    </span>
                    <br>
                    <span class="x-smalltext text-uppercase" style="font-weight:bold; ">Awards</span>
                </div>
                <div class="post-stat">
                    <span class="largetext"><strong style="color:green; text-align: center;">{$user.reaction_score|number}</strong></span>
                    <br> <span class="x-smalltext text-uppercase" style="font-weight:bold;">Likes</span>
                </div>
            </div>
            <p>

This above code should be put below of this line
Code:
   <h4 class="message-name"><xf:username user="$user" rich="true" defaultname="{$fallbackName}" itemprop="name" /></h4><br>
in message_macro.
 

NotMyFault

Member
Registered
Joined
Jan 17, 2022
Messages
17
Points
3

Reputation:

not working on 2.1
 

one_finger_man

Well-known member
Registered
Joined
Jan 20, 2022
Messages
378
Points
53

Reputation:

it would be cool if you can remove the line out tryed that and it did not work


this is an update for this to remove the lines over ride your extra.less

CSS:
.d-flex {
    display: flex;
}
.d-flex {
    position: relative;
    display: flex !important;
}
@media (max-width: 650px) {
    .post-stat, .post-stats {
    display: none !important;
    }
}
.post-stat {
    flex: 0 1 50%;
    margin-left: 12px;
    text-align: center;

}
.post-stats .post-stat:first-child {
    flex: 0 0 50%;
}
.justify-content-center {
    justify-content: center;
  
}
 
Last edited:
Top