mirrors/mastodon
1
0
Fork 0
mirror of https://github.com/mastodon/mastodon.git synced 2024-12-13 14:45:12 +01:00
Code Issues Projects Releases Wiki Activity

[Glitch] Fix media modal footer's “external link” not being a link

Browse Source 
Port 255748dff4 to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>
This commit is contained in:
Claire 2022-02-25 01:20:41 +01:00
parent 8e04ba87b7
commit 4eed5019a2
3 changed files with 24 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
app/javascript/flavours/glitch/components/icon_button.js
View File

@ -30,6 +30,7 @@ export default class IconButton extends React.PureComponent {
label: PropTypes.string,
counter: PropTypes.number,
obfuscateCount: PropTypes.bool,
href: PropTypes.string,
};
static defaultProps = {
@ -109,6 +110,7 @@ export default class IconButton extends React.PureComponent {
title,
counter,
obfuscateCount,
href,
} = this.props;
const {
@ -130,6 +132,21 @@ export default class IconButton extends React.PureComponent {
style.width = 'auto';
}
let contents = (
<React.Fragment>
<Icon id={icon} fixedWidth aria-hidden='true' /> {typeof counter !== 'undefined' && <span className='icon-button__counter'><AnimatedNumber value={counter} obfuscate={obfuscateCount} /></span>}
{this.props.label}
</React.Fragment>
);
if (href) {
contents = (
<a href={href} target='_blank' rel='noopener noreferrer'>
{contents}
</a>
);
}
return (
<button
aria-label={title}
@ -145,8 +162,7 @@ export default class IconButton extends React.PureComponent {
tabIndex={tabIndex}
disabled={disabled}
>
<Icon id={icon} fixedWidth aria-hidden='true' /> {typeof counter !== 'undefined' && <span className='icon-button__counter'><AnimatedNumber value={counter} obfuscate={obfuscateCount} /></span>}
{this.props.label}
{contents}
</button>
);
}

2
app/javascript/flavours/glitch/features/picture_in_picture/components/footer.js
View File

@ -181,7 +181,7 @@ class Footer extends ImmutablePureComponent {
{replyButton}
<IconButton className={classNames('status__action-bar-button', { reblogPrivate })} disabled={!publicStatus && !reblogPrivate} active={status.get('reblogged')} pressed={status.get('reblogged')} title={reblogTitle} icon='retweet' onClick={this.handleReblogClick} counter={status.get('reblogs_count')} />
<IconButton className='status__action-bar-button star-icon' animate active={status.get('favourited')} pressed={status.get('favourited')} title={intl.formatMessage(messages.favourite)} icon='star' onClick={this.handleFavouriteClick} counter={status.get('favourites_count')} />
{withOpenButton && <IconButton className='status__action-bar-button' title={intl.formatMessage(messages.open)} icon='external-link' onClick={this.handleOpenClick} />}
{withOpenButton && <IconButton className='status__action-bar-button' title={intl.formatMessage(messages.open)} icon='external-link' onClick={this.handleOpenClick} href={status.get('url')} />}
</div>
);
}

5
app/javascript/flavours/glitch/styles/components/index.scss
View File

@ -146,6 +146,11 @@
transition-property: background-color, color;
text-decoration: none;
a {
color: inherit;
text-decoration: none;
}
&:hover,
&:active,
&:focus {