- Fix support for content types which implement the "Like" handler instead of "Reaction" handler
XenForo only supports a particular version of Font Awesome 5 (not sure off the top of my head), not Font-awesome 6
Without seeing the failure mode, check that you don't have any other rendering options filled out. It really should have a select-type-expand ui to make it clear what rendering choices are used first.using
fad fa-face-grin-squint-tears
Can't get it to show up. Am I doing something wrong? This isn't the only one I've had troubles with. Tried with this one too and a few others (anything that is within the 5.15 version):
Is this what you need?Without seeing the failure mode, check that you don't have any other rendering options filled out. It really should have a select-type-expand ui to make it clear what rendering choices are used first.
sv_contentratings_macros
and macro rating_type_icon
is what renders the front-end html. <i class="sv-rating-type-icon {{ $inline ? 'sv-rating-type-icon--inline' : '' }} sv-rating-type-icon{$reaction.reaction_id} sv-rating-type-icon--css {$reaction.SvExtra.css_icon} {$class}"
title="{{ $reaction.title|for_attr }}"
aria-hidden="true"></i>
This is what we have:That should work. My guess is there might be something overriding the css.
The templatesv_contentratings_macros
and macrorating_type_icon
is what renders the front-end html.
It should be using this branch;
HTML:<i class="sv-rating-type-icon {{ $inline ? 'sv-rating-type-icon--inline' : '' }} sv-rating-type-icon{$reaction.reaction_id} sv-rating-type-icon--css {$reaction.SvExtra.css_icon} {$class}" title="{{ $reaction.title|for_attr }}" aria-hidden="true"></i>
For the reaction which isn't rendering, you'll need to open browser tools to inspect the html & css.
Can you check that the css is being injected as expected and something isn't overriding the css?
<i class="sv-rating-type-icon sv-rating-type-icon2 sv-rating-type-icon--css fad fa-face-grin-hearts "
title="Love" aria-hidden="true"></i>
<i class="sv-rating-type-icon sv-rating-type-icon17 sv-rating-type-icon--css fad fa-thumbs-up "
title="Test" aria-hidden="true"></i>
It appears that it is not creating "::before" and "::after" elements in the html, which is where the css for the icon is stored. For example, this works correctly:Ok, I'm kinda baffled then.
You'll need to point the browser tools at that html and inspect the actual css piled on it to determine what is happening.
<i class="sv-rating-type-icon sv-rating-type-icon7 sv-rating-type-icon--css fad fa-handshake " title="Agree" aria-hidden="true">
::before
::after
</i>
.fa-handshake:before {
content: "\f2b5";
}
.fad:before {
position: absolute;
color: var(--fa-primary-color, inherit);
opacity: 1;
opacity: var(--fa-primary-opacity, 1);
}
.fad.fa-handshake:after {
content: "\10f2b5";
}
.fad:after {
color: var(--fa-secondary-color, inherit);
opacity: var(--fa-secondary-opacity, .4);
}
Can you try it with the base UI.X2 style to see if it actually is working as expected?OK, I have purchased this add-on but I cannot get it to display correctly (even with an unedited UI.X 2 dark style), which is what my two child styles base off of. It has incomplete borders, bad alignment on both the thread list and post pages..
TryWhereas, in the reaction that includes the "fa-face-heart-grin" does not include the before and after elements; therefore, there is no css. Even when I try to do this manually, it deletes the before and after elements.
fad fa-grin-hearts
, you can check the contents of fa.css
if it exists.I haven't tried on the NON-dark version, just on the dark version but this shouldn't be an issue. Could be, but shouldn't... lolCan you try it with the base UI.X2 style to see if it actually is working as expected?
This add-on has been used on UI.X2 styles before so I'm not sure what is being done differently. It really depends on how the child styles have been setup.
We use essential cookies to make this site work, and optional cookies to enhance your experience.