xiaoxiaobai5724
Hey thank you for so generously providing this helpful code.
I've just finished adding-(& slightly customizing)-it, and so far as I can tell it's working perfectly.
There is another similarly intended code found in...(🤔I think)...either the 'Likes' extension's—or another relevant thread—somewhere 'round here which I tried yesterday, although that particular code didn't seem to have any effect.
Nevertheless, in case it may be useful for others future reference. Below is an example of your code-(+ a few minor customizations), and followed up with a visual example of the front end result:
/* (7)XIAOXIAOBAI5724'S REACTIONS BEGIN /
.item-like .Button--link .Button-label,.item-dislike .Button--link .Button-label,.item-reply .Button--link .Button-label {
display:none;
}
.item-like .Button:before {
font-family: 'Font Awesome 5 Free', 'Font Awesome 6 Free', 'Font Awesome 6 Pro';
font-weight: 600;
font-size: 14px;
content: '\f164';
padding: 4px;
color: white;
background: black;
border-radius: 50px;
vertical-align: -1px;
}
.item-dislike .Button:before {
font-family: 'Font Awesome 5 Free', 'Font Awesome 6 Free', 'Font Awesome 6 Pro';
font-weight: 600;
font-size: 14px;
content: '\f165';
padding: 4px;
color: white;
background: black;
border-radius: 50px;
vertical-align: -3px;
}
.item-reply .Button--link:before {
font-family: 'Font Awesome 5 Free', 'Font Awesome 6 Free', 'Font Awesome 6 Pro';
font-weight: 600;
font-size: 15px;
content: '\f3e5';
margin-right: 4px;
padding: 4px;
color: white;
background: black;
border-radius: 50px;
vertical-align: -2px;
}
/ (7)XIAOXIAOBAI5724'S REACTIONS END */
The customizations I've added to Xiaoxiaobai5724's original code are:
padding: 4px;
color: white;
background: black;
border-radius: 50px;
And this is what the 'Like' & the 'Reply' buttons look like at the front:
(*Note: Two aspects within the above image I ought to highlight and clarify; 1. There was no 'Dislike' button on my forum prior to adding this code today and tbh I'm not sure whether a 'Dislike' button is actually supposed to be there already, or if instead it maybe needs to be added via a specific extension perhaps(¿?). And 2. 😂I have absolutely no idea why all the post editing icons & associated post footer text elements have seemingly somehow vanished-(which wasn't the case yesterday)-however I am confident that it has nothing to do with Xiaoxiaobai5724's code. I hadn't even noticed the vanishing post footer elements until testing this code earlier, which I'd then initially assumed was likely being caused by this code, but after subsequently then removing the code I've found that the vanishing post footer icons & other text elements still persists. So therefore I am inclined towards concluding that Xiaoxiaobai5724's code is not the cause.)
•EDIT, to add: The '☢️' button seen in the image, is a custom button icon I've added to the 'Spam Alert' extension's 'Spam' button.
(*Furthermore I'll add that I think the 'Spam Alert' extension is much more than merely an additional spam mitigation option. 😎 In my opinion, it also seems potentially viable as a simple means for enabling the development of community self-moderation practices...)