[Glitch] Fix uncached media in web UI not being clickable

Port acf168f1a2 to glitch-soc

Signed-off-by: Thibaut Girka <thib@sitedethib.com>
th-downstream
Eugen Rochko 5 years ago committed by Thibaut Girka
parent a3186bbf67
commit 8f54a3efe0

@ -179,7 +179,7 @@ class Item extends React.PureComponent {
if (attachment.get('type') === 'unknown') { if (attachment.get('type') === 'unknown') {
return ( return (
<div className={classNames('media-gallery__item', { standalone })} key={attachment.get('id')} style={{ left: left, top: top, right: right, bottom: bottom, width: `${width}%`, height: `${height}%` }}> <div className={classNames('media-gallery__item', { standalone })} key={attachment.get('id')} style={{ left: left, top: top, right: right, bottom: bottom, width: `${width}%`, height: `${height}%` }}>
<a className='media-gallery__item-thumbnail' href={attachment.get('remote_url')} target='_blank' style={{ cursor: 'pointer' }} title={attachment.get('description')}> <a className='media-gallery__item-thumbnail' href={attachment.get('remote_url') || attachment.get('url')} target='_blank' style={{ cursor: 'pointer' }} title={attachment.get('description')}>
<canvas width={32} height={32} ref={this.setCanvasRef} className='media-gallery__preview' /> <canvas width={32} height={32} ref={this.setCanvasRef} className='media-gallery__preview' />
</a> </a>
</div> </div>
@ -372,7 +372,7 @@ export default class MediaGallery extends React.PureComponent {
return ( return (
<div className={computedClass} style={style} ref={this.handleRef}> <div className={computedClass} style={style} ref={this.handleRef}>
<div className={classNames('spoiler-button', { 'spoiler-button--minified': visible && !uncached })}> <div className={classNames('spoiler-button', { 'spoiler-button--minified': visible && !uncached, 'spoiler-button--click-thru': uncached })}>
{spoilerButton} {spoilerButton}
{visible && sensitive && ( {visible && sensitive && (
<span className='sensitive-marker'> <span className='sensitive-marker'>

@ -1239,6 +1239,10 @@
align-items: center; align-items: center;
} }
&--click-thru {
pointer-events: none;
}
&--hidden { &--hidden {
display: none; display: none;
} }
@ -1269,8 +1273,6 @@
} }
&:disabled { &:disabled {
cursor: not-allowed;
.spoiler-button__overlay__label { .spoiler-button__overlay__label {
background: rgba($base-overlay-background, 0.5); background: rgba($base-overlay-background, 0.5);
} }

Loading…
Cancel
Save