cybrespace/mastodon
4
3
Fork 3
Code Issues 7 Pull requests Releases Activity

Bring back crossed eye icon on gallery (#10715)

Browse source
This commit is contained in:
Jeong Arm 2019-05-09 01:01:33 +09:00 • committed by Eugen Rochko
parent 9679ec4fcb
commit 7a6464bea0
2 changed files with 19 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
app/javascript/mastodon/features/account_gallery/components/media_item.js
View file

@ -2,6 +2,7 @@ import React from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import ImmutablePropTypes from 'react-immutable-proptypes'; import ImmutablePropTypes from 'react-immutable-proptypes';
import ImmutablePureComponent from 'react-immutable-pure-component'; import ImmutablePureComponent from 'react-immutable-pure-component';
import Icon from 'mastodon/components/icon';
import { autoPlayGif, displayMedia } from 'mastodon/initial_state'; import { autoPlayGif, displayMedia } from 'mastodon/initial_state';
import classNames from 'classnames'; import classNames from 'classnames';
import { decode } from 'blurhash'; import { decode } from 'blurhash';
@ -91,6 +92,7 @@ export default class MediaItem extends ImmutablePureComponent {
const title = status.get('spoiler_text') || attachment.get('description'); const title = status.get('spoiler_text') || attachment.get('description');
let thumbnail = ''; let thumbnail = '';
let icon;
if (attachment.get('type') === 'unknown') { if (attachment.get('type') === 'unknown') {
// Skip // Skip
@ -132,11 +134,20 @@ export default class MediaItem extends ImmutablePureComponent {
); );
} }
if (!visible) {
icon = (
<span className='account-gallery__item__icons'>
<Icon id='eye-slash' />
</span>
);
}
return ( return (
<div className='account-gallery__item' style={{ width, height }}> <div className='account-gallery__item' style={{ width, height }}>
<a className='media-gallery__item-thumbnail' href={status.get('url')} target='_blank' onClick={this.handleClick} title={title}> <a className='media-gallery__item-thumbnail' href={status.get('url')} target='_blank' onClick={this.handleClick} title={title}>
<canvas width={32} height={32} ref={this.setCanvasRef} className={classNames('media-gallery__preview', { 'media-gallery__preview--hidden': visible && loaded })} /> <canvas width={32} height={32} ref={this.setCanvasRef} className={classNames('media-gallery__preview', { 'media-gallery__preview--hidden': visible && loaded })} />
{visible && thumbnail} {visible && thumbnail}
{!visible && icon}
</a> </a>
</div> </div>
); );

8
app/javascript/styles/mastodon/components.scss
View file

@ -4829,6 +4829,14 @@ a.status-card.compact:hover {
border-radius: 4px; border-radius: 4px;
overflow: hidden; overflow: hidden;
margin: 2px; margin: 2px;
&__icons {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
font-size: 24px;
}
} }
.notification__filter-bar, .notification__filter-bar,