1
0
Fork 0
mirror of https://github.com/FrankerFaceZ/FrankerFaceZ.git synced 2025-09-15 17:46:55 +00:00

Change how user-specific badge overrides are rendered so that a transparent image badge looks correct no matter what badge style is enabled.

This commit is contained in:
SirStendec 2018-02-02 18:19:42 -05:00
parent 7cc6bf576f
commit 2efbd1ae59
2 changed files with 6 additions and 4 deletions

View file

@ -13,7 +13,7 @@
<li>Fixed: Apollo caching modified queries when it shouldn't, causing additional data requested by FFZ including stream up-time to not be fetched.</li> <li>Fixed: Apollo caching modified queries when it shouldn't, causing additional data requested by FFZ including stream up-time to not be fetched.</li>
</ul> </ul>
<div class="list-header">4.0.0-beta1.5<span>@fe7bd1b3bbdba43c0666</span> <time datetime="2018-02-01">(2018-02-01)</time></div> <div class="list-header">4.0.0-beta1.5<span>@a072b3e2b1e9dd395378</span> <time datetime="2018-02-01">(2018-02-01)</time></div>
<ul class="chat-menu-content menu-side-padding"> <ul class="chat-menu-content menu-side-padding">
<li>Fixed: Part two of the fixes for the new Apollo version. FFZ should now be loading data mostly correctly.</li> <li>Fixed: Part two of the fixes for the new Apollo version. FFZ should now be loading data mostly correctly.</li>
<li>Bug: The directory features are not currently working unless you navigate to it from another page.</li> <li>Bug: The directory features are not currently working unless you navigate to it from another page.</li>

View file

@ -301,6 +301,8 @@ export default class Badges extends Module {
continue; continue;
const style = {}, const style = {},
color = badge.color || full_badge.color || 'transparent',
masked = color !== 'transparent' && is_mask,
props = { props = {
className: 'ffz-tooltip ffz-badge', className: 'ffz-tooltip ffz-badge',
'data-tooltip-type': 'badge', 'data-tooltip-type': 'badge',
@ -314,13 +316,13 @@ export default class Badges extends Module {
if ( urls[2] || urls[4] ) if ( urls[2] || urls[4] )
image_set = `${WEBKIT}image-set(${image} 1x${urls[2] ? `, url("${urls[2]}") 2x` : ''}${urls[4] ? `, url("${urls[4]}") 4x` : ''})`; image_set = `${WEBKIT}image-set(${image} 1x${urls[2] ? `, url("${urls[2]}") 2x` : ''}${urls[4] ? `, url("${urls[4]}") 4x` : ''})`;
style[is_mask ? CSS_MASK_IMAGE : 'backgroundImage'] = image; style[masked ? CSS_MASK_IMAGE : 'backgroundImage'] = image;
if ( image_set ) if ( image_set )
style[is_mask ? CSS_MASK_IMAGE : 'backgroundImage'] = image_set; style[masked ? CSS_MASK_IMAGE : 'backgroundImage'] = image_set;
} }
if ( is_colored && badge.color ) { if ( is_colored && badge.color ) {
if ( is_mask ) if ( masked )
style.backgroundImage = `linear-gradient(${badge.color},${badge.color})`; style.backgroundImage = `linear-gradient(${badge.color},${badge.color})`;
else else
style.backgroundColor = badge.color; style.backgroundColor = badge.color;