diff --git a/package.json b/package.json index 0b8188db..844f3055 100755 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "frankerfacez", "author": "Dan Salvato LLC", - "version": "4.29.0", + "version": "4.29.1", "description": "FrankerFaceZ is a Twitch enhancement suite.", "private": true, "license": "Apache-2.0", diff --git a/src/sites/clips/css_tweaks/full-width.scss b/src/sites/clips/css_tweaks/full-width.scss index 497fc50b..9c7c6bc6 100644 --- a/src/sites/clips/css_tweaks/full-width.scss +++ b/src/sites/clips/css_tweaks/full-width.scss @@ -1,4 +1,9 @@ @media (min-width: 1200px) { + .clips-edit-clip-wrapper { + max-width: #{"min(calc(100vw - 4rem),calc(16 / 9 * calc(100vh - 31rem)))"}; + width: 100vw; + } + .clips-watch { max-width: #{"min(calc(100vw - 2rem),calc(calc(16 / 9 * calc(100vh - 15rem)) + 36rem))"}; } diff --git a/src/sites/twitch-twilight/modules/css_tweaks/styles/square-avatars.scss b/src/sites/twitch-twilight/modules/css_tweaks/styles/square-avatars.scss index 137f7e45..382c4968 100644 --- a/src/sites/twitch-twilight/modules/css_tweaks/styles/square-avatars.scss +++ b/src/sites/twitch-twilight/modules/css_tweaks/styles/square-avatars.scss @@ -1,6 +1,7 @@ .user-avatar-animated, .search-result-card, .ffz-avatar, +.tw-halo, .tw-avatar { --border-radius-rounded: 0 !important; } diff --git a/src/utilities/compat/apollo.js b/src/utilities/compat/apollo.js index 6ae6e545..83d4899c 100644 --- a/src/utilities/compat/apollo.js +++ b/src/utilities/compat/apollo.js @@ -85,9 +85,14 @@ export default class Apollo extends Module { const root = this.fine.react, inst = root && root.stateNode; - client = this.client = inst?.props?.client || root?.memoizedProps?.client; - if ( root && ! client ) + client = inst?.props?.client || root?.memoizedProps?.client; + if ( root && ! client ) { client = this.fine.searchTree(null, n => n.props?.client?.queryManager, 500); + if ( client ) + client = client?.props?.client; + } + + this.client = client; } if ( ! client ) diff --git a/src/utilities/rich_tokens.js b/src/utilities/rich_tokens.js index 7c9c0c94..ca07d234 100644 --- a/src/utilities/rich_tokens.js +++ b/src/utilities/rich_tokens.js @@ -548,11 +548,15 @@ function header_vue(token, h, ctx) { ] }, content); - if ( token.image ) { - const aspect = token.image.aspect; + let imtok = token.sfw_image; + if ( token.image && canShowImage(token.image, ctx) ) + imtok = token.image; + + if ( imtok ) { + const aspect = imtok.aspect; let image = render_image({ - ...token.image, + ...imtok, aspect: undefined }, h, ctx); const right = token.image_side === 'right'; @@ -634,11 +638,15 @@ function header_normal(token, createElement, ctx) { className: `tw-flex tw-full-width tw-overflow-hidden ${token.compact ? 'ffz--rich-header ffz--compact-header tw-align-items-center' : 'tw-justify-content-center tw-flex-column tw-flex-grow-1'}` }, content); - if ( token.image ) { - const aspect = token.image.aspect; + let imtok = token.sfw_image; + if ( token.image && canShowImage(token.image, ctx) ) + imtok = token.image; + + if ( imtok ) { + const aspect = imtok.aspect; let image = render_image({ - ...token.image, + ...imtok, aspect: undefined }, createElement, ctx); const right = token.image_side === 'right'; @@ -717,8 +725,12 @@ TOKEN_TYPES.icon = function(token, createElement, ctx) { // Token Type: Image // ============================================================================ +function canShowImage(token, ctx) { + return !(has(token, 'sfw') && ! token.sfw && ! ctx.allow_unsafe); +} + function render_image(token, createElement, ctx) { - if ( ! token.url || (has(token, 'sfw') && ! token.sfw && ! ctx.allow_unsafe) ) + if ( ! token.url || ! canShowImage(token, ctx) ) return null; const round = getRoundClass(token.rounding);