tarrien/Mastodon
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Use the Icon component instead of directly using i tag

Browse Source
This commit is contained in:
Thibaut Girka
2019-09-09 16:41:41 +02:00
committed by ThibG
parent f154d9d6e9
commit 2aa0cdf7e6
32 changed files with 116 additions and 79 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
app/javascript/flavours/glitch/features/notifications/components/clear_column_button.js
View File

@ -1,6 +1,7 @@
import React from 'react';
import PropTypes from 'prop-types';
import { FormattedMessage } from 'react-intl';
import Icon from 'flavours/glitch/components/icon';
export default class ClearColumnButton extends React.Component {
@ -10,7 +11,7 @@ export default class ClearColumnButton extends React.Component {
render () {
return (
<button className='text-btn column-header__setting-btn' tabIndex='0' onClick={this.props.onClick}><i className='fa fa-eraser' /> <FormattedMessage id='notifications.clear' defaultMessage='Clear notifications' /></button>
<button className='text-btn column-header__setting-btn' tabIndex='0' onClick={this.props.onClick}><Icon id='eraser' /> <FormattedMessage id='notifications.clear' defaultMessage='Clear notifications' /></button>
);
}

11
app/javascript/flavours/glitch/features/notifications/components/filter_bar.js
View File

@ -1,6 +1,7 @@
import React from 'react';
import PropTypes from 'prop-types';
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
import Icon from 'flavours/glitch/components/icon';
const tooltips = defineMessages({
mentions: { id: 'notifications.filter.mentions', defaultMessage: 'Mentions' },
@ -63,35 +64,35 @@ class FilterBar extends React.PureComponent {
onClick={this.onClick('mention')}
title={intl.formatMessage(tooltips.mentions)}
>
<i className='fa fa-fw fa-at' />
<Icon id='at' fixedWidth />
</button>
<button
className={selectedFilter === 'favourite' ? 'active' : ''}
onClick={this.onClick('favourite')}
title={intl.formatMessage(tooltips.favourites)}
>
<i className='fa fa-fw fa-star' />
<Icon id='star' fixedWidth />
</button>
<button
className={selectedFilter === 'reblog' ? 'active' : ''}
onClick={this.onClick('reblog')}
title={intl.formatMessage(tooltips.boosts)}
>
<i className='fa fa-fw fa-retweet' />
<Icon id='retweet' fixedWidth />
</button>
<button
className={selectedFilter === 'poll' ? 'active' : ''}
onClick={this.onClick('poll')}
title={intl.formatMessage(tooltips.polls)}
>
<i className='fa fa-fw fa-tasks' />
<Icon id='tasks' fixedWidth />
</button>
<button
className={selectedFilter === 'follow' ? 'active' : ''}
onClick={this.onClick('follow')}
title={intl.formatMessage(tooltips.follows)}
>
<i className='fa fa-fw fa-user-plus' />
<Icon id='user-plus' fixedWidth />
</button>
</div>
);

3
app/javascript/flavours/glitch/features/notifications/components/follow.js
View File

@ -10,6 +10,7 @@ import { HotKeys } from 'react-hotkeys';
import Permalink from 'flavours/glitch/components/permalink';
import AccountContainer from 'flavours/glitch/containers/account_container';
import NotificationOverlayContainer from '../containers/overlay_container';
import Icon from 'flavours/glitch/components/icon';
export default class NotificationFollow extends ImmutablePureComponent {
@ -78,7 +79,7 @@ export default class NotificationFollow extends ImmutablePureComponent {
<div className='notification notification-follow focusable' tabIndex='0'>
<div className='notification__message'>
<div className='notification__favourite-icon-wrapper'>
<i className='fa fa-fw fa-user-plus' />
<Icon fixedWidth id='user-plus' />
</div>
<FormattedMessage

3
app/javascript/flavours/glitch/features/notifications/components/overlay.js
View File

@ -9,6 +9,7 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
import PropTypes from 'prop-types';
import ImmutablePureComponent from 'react-immutable-pure-component';
import { defineMessages, injectIntl } from 'react-intl';
import Icon from 'flavours/glitch/components/icon';
const messages = defineMessages({
markForDeletion: { id: 'notification.markForDeletion', defaultMessage: 'Mark for deletion' },
@ -47,7 +48,7 @@ class NotificationOverlay extends ImmutablePureComponent {
>
<div className='wrappy'>
<div className='ckbox' aria-hidden='true' title={label}>
{active ? (<i className='fa fa-check' />) : ''}
{active ? (<Icon id='check' />) : ''}
</div>
</div>
</div>