diff options
Diffstat (limited to 'app')
50 files changed, 106 insertions, 162 deletions
diff --git a/app/helpers/application_helper.rb b/app/helpers/application_helper.rb index 49621f55f..f8e2c0e11 100644 --- a/app/helpers/application_helper.rb +++ b/app/helpers/application_helper.rb @@ -55,7 +55,7 @@ module ApplicationHelper def fa_icon(icon, attributes = {}) class_names = attributes[:class]&.split(' ') || [] - class_names << 'fas' + class_names << 'fa' class_names += icon.split(' ').map { |cl| "fa-#{cl}" } content_tag(:i, nil, attributes.merge(class: class_names.join(' '))) diff --git a/app/javascript/mastodon/common.js b/app/javascript/mastodon/common.js index fdd3431ab..2b10b8c30 100644 --- a/app/javascript/mastodon/common.js +++ b/app/javascript/mastodon/common.js @@ -1,8 +1,7 @@ import Rails from 'rails-ujs'; export function start() { - require('@fortawesome/fontawesome-free/css/fontawesome.css'); - require('@fortawesome/fontawesome-free/css/solid.css'); + require('font-awesome/css/font-awesome.css'); require.context('../images/', true); Rails.start(); diff --git a/app/javascript/mastodon/components/__tests__/__snapshots__/avatar-test.js.snap b/app/javascript/mastodon/components/__tests__/__snapshots__/avatar-test.js.snap index 1ab59836a..76ab3374a 100644 --- a/app/javascript/mastodon/components/__tests__/__snapshots__/avatar-test.js.snap +++ b/app/javascript/mastodon/components/__tests__/__snapshots__/avatar-test.js.snap @@ -13,11 +13,7 @@ exports[`<Avatar /> Autoplay renders a animated avatar 1`] = ` "width": "100px", } } -> - <i - className="fas fa-fw fa-robot bot-icon" - /> -</div> +/> `; exports[`<Avatar /> Still renders a still avatar 1`] = ` @@ -33,9 +29,5 @@ exports[`<Avatar /> Still renders a still avatar 1`] = ` "width": "100px", } } -> - <i - className="fas fa-fw fa-robot bot-icon" - /> -</div> +/> `; diff --git a/app/javascript/mastodon/components/__tests__/avatar-test.js b/app/javascript/mastodon/components/__tests__/avatar-test.js index cc99d3a53..dd3f7b7d2 100644 --- a/app/javascript/mastodon/components/__tests__/avatar-test.js +++ b/app/javascript/mastodon/components/__tests__/avatar-test.js @@ -10,7 +10,6 @@ describe('<Avatar />', () => { display_name: 'Alice', avatar: '/animated/alice.gif', avatar_static: '/static/alice.jpg', - bot: true, }); const size = 100; diff --git a/app/javascript/mastodon/components/attachment_list.js b/app/javascript/mastodon/components/attachment_list.js index 14e6cfc65..8e5bb0e0b 100644 --- a/app/javascript/mastodon/components/attachment_list.js +++ b/app/javascript/mastodon/components/attachment_list.js @@ -24,7 +24,7 @@ export default class AttachmentList extends ImmutablePureComponent { return ( <li key={attachment.get('id')}> - <a href={displayUrl} target='_blank' rel='noopener'><i className='fas fa-link' /> {filename(displayUrl)}</a> + <a href={displayUrl} target='_blank' rel='noopener'><i className='fa fa-link' /> {filename(displayUrl)}</a> </li> ); })} @@ -36,7 +36,7 @@ export default class AttachmentList extends ImmutablePureComponent { return ( <div className='attachment-list'> <div className='attachment-list__icon'> - <i className='fas fa-link' /> + <i className='fa fa-link' /> </div> <ul className='attachment-list__list'> diff --git a/app/javascript/mastodon/components/avatar.js b/app/javascript/mastodon/components/avatar.js index e46f1ed76..570505833 100644 --- a/app/javascript/mastodon/components/avatar.js +++ b/app/javascript/mastodon/components/avatar.js @@ -1,7 +1,6 @@ import React from 'react'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; -import BotIcon from './bot_icon'; import { autoPlayGif } from '../initial_state'; export default class Avatar extends React.PureComponent { @@ -66,9 +65,7 @@ export default class Avatar extends React.PureComponent { onMouseEnter={this.handleMouseEnter} onMouseLeave={this.handleMouseLeave} style={style} - > - <BotIcon account={account} /> - </div> + /> ); } diff --git a/app/javascript/mastodon/components/bot_icon.js b/app/javascript/mastodon/components/bot_icon.js deleted file mode 100644 index 4d824e762..000000000 --- a/app/javascript/mastodon/components/bot_icon.js +++ /dev/null @@ -1,23 +0,0 @@ -import React from 'react'; -import ImmutablePropTypes from 'react-immutable-proptypes'; -import ImmutablePureComponent from 'react-immutable-pure-component'; - -export default class BotIcon extends ImmutablePureComponent { - - static propTypes = { - account: ImmutablePropTypes.map.isRequired, - }; - - render () { - const { account } = this.props; - - if (account.get('bot')) { - return ( - <i className='fas fa-fw fa-robot bot-icon' /> - ); - } - - return ''; - } - -} diff --git a/app/javascript/mastodon/components/column_back_button.js b/app/javascript/mastodon/components/column_back_button.js index 2560e31ee..8a60c4192 100644 --- a/app/javascript/mastodon/components/column_back_button.js +++ b/app/javascript/mastodon/components/column_back_button.js @@ -19,7 +19,7 @@ export default class ColumnBackButton extends React.PureComponent { render () { return ( <button onClick={this.handleClick} className='column-back-button'> - <i className='fas fa-fw fa-chevron-left column-back-button__icon' /> + <i className='fa fa-fw fa-chevron-left column-back-button__icon' /> <FormattedMessage id='column_back_button.label' defaultMessage='Back' /> </button> ); diff --git a/app/javascript/mastodon/components/column_back_button_slim.js b/app/javascript/mastodon/components/column_back_button_slim.js index a0d111aa7..964c100be 100644 --- a/app/javascript/mastodon/components/column_back_button_slim.js +++ b/app/javascript/mastodon/components/column_back_button_slim.js @@ -8,7 +8,7 @@ export default class ColumnBackButtonSlim extends ColumnBackButton { return ( <div className='column-back-button--slim'> <div role='button' tabIndex='0' onClick={this.handleClick} className='column-back-button column-back-button--slim-button'> - <i className='fas fa-fw fa-chevron-left column-back-button__icon' /> + <i className='fa fa-fw fa-chevron-left column-back-button__icon' /> <FormattedMessage id='column_back_button.label' defaultMessage='Back' /> </div> </div> diff --git a/app/javascript/mastodon/components/column_header.js b/app/javascript/mastodon/components/column_header.js index 420ce3eef..457508d13 100644 --- a/app/javascript/mastodon/components/column_header.js +++ b/app/javascript/mastodon/components/column_header.js @@ -95,22 +95,22 @@ class ColumnHeader extends React.PureComponent { } if (multiColumn && pinned) { - pinButton = <button key='pin-button' className='text-btn column-header__setting-btn' onClick={onPin}><i className='fas fa-times' /> <FormattedMessage id='column_header.unpin' defaultMessage='Unpin' /></button>; + pinButton = <button key='pin-button' className='text-btn column-header__setting-btn' onClick={onPin}><i className='fa fa fa-times' /> <FormattedMessage id='column_header.unpin' defaultMessage='Unpin' /></button>; moveButtons = ( <div key='move-buttons' className='column-header__setting-arrows'> - <button title={formatMessage(messages.moveLeft)} aria-label={formatMessage(messages.moveLeft)} className='text-btn column-header__setting-btn' onClick={this.handleMoveLeft}><i className='fas fa-chevron-left' /></button> - <button title={formatMessage(messages.moveRight)} aria-label={formatMessage(messages.moveRight)} className='text-btn column-header__setting-btn' onClick={this.handleMoveRight}><i className='fas fa-chevron-right' /></button> + <button title={formatMessage(messages.moveLeft)} aria-label={formatMessage(messages.moveLeft)} className='text-btn column-header__setting-btn' onClick={this.handleMoveLeft}><i className='fa fa-chevron-left' /></button> + <button title={formatMessage(messages.moveRight)} aria-label={formatMessage(messages.moveRight)} className='text-btn column-header__setting-btn' onClick={this.handleMoveRight}><i className='fa fa-chevron-right' /></button> </div> ); } else if (multiColumn) { - pinButton = <button key='pin-button' className='text-btn column-header__setting-btn' onClick={onPin}><i className='fas fa-plus' /> <FormattedMessage id='column_header.pin' defaultMessage='Pin' /></button>; + pinButton = <button key='pin-button' className='text-btn column-header__setting-btn' onClick={onPin}><i className='fa fa fa-plus' /> <FormattedMessage id='column_header.pin' defaultMessage='Pin' /></button>; } if (!pinned && (multiColumn || showBackButton)) { backButton = ( <button onClick={this.handleBackClick} className='column-header__back-button'> - <i className='fas fa-fw fa-chevron-left column-back-button__icon' /> + <i className='fa fa-fw fa-chevron-left column-back-button__icon' /> <FormattedMessage id='column_back_button.label' defaultMessage='Back' /> </button> ); @@ -126,7 +126,7 @@ class ColumnHeader extends React.PureComponent { } if (children || multiColumn) { - collapseButton = <button className={collapsibleButtonClassName} title={formatMessage(collapsed ? messages.show : messages.hide)} aria-label={formatMessage(collapsed ? messages.show : messages.hide)} aria-pressed={collapsed ? 'false' : 'true'} onClick={this.handleToggleClick}><i className='fas fa-sliders-h' /></button>; + collapseButton = <button className={collapsibleButtonClassName} title={formatMessage(collapsed ? messages.show : messages.hide)} aria-label={formatMessage(collapsed ? messages.show : messages.hide)} aria-pressed={collapsed ? 'false' : 'true'} onClick={this.handleToggleClick}><i className='fa fa-sliders' /></button>; } const hasTitle = icon && title; @@ -136,7 +136,7 @@ class ColumnHeader extends React.PureComponent { <h1 className={buttonClassName}> {hasTitle && ( <button onClick={this.handleTitleClick}> - <i className={`fas fa-fw fa-${icon} column-header__icon`} /> + <i className={`fa fa-fw fa-${icon} column-header__icon`} /> {title} </button> )} diff --git a/app/javascript/mastodon/components/icon_button.js b/app/javascript/mastodon/components/icon_button.js index a303064ff..b96e48fd0 100644 --- a/app/javascript/mastodon/components/icon_button.js +++ b/app/javascript/mastodon/components/icon_button.js @@ -86,7 +86,7 @@ export default class IconButton extends React.PureComponent { style={style} tabIndex={tabIndex} > - <i className={`fas fa-fw fa-${icon}`} aria-hidden='true' /> + <i className={`fa fa-fw fa-${icon}`} aria-hidden='true' /> </button> ); } @@ -104,7 +104,7 @@ export default class IconButton extends React.PureComponent { style={style} tabIndex={tabIndex} > - <i style={{ transform: `rotate(${rotate}deg)` }} className={`fas fa-fw fa-${icon}`} aria-hidden='true' /> + <i style={{ transform: `rotate(${rotate}deg)` }} className={`fa fa-fw fa-${icon}`} aria-hidden='true' /> </button> )} </Motion> diff --git a/app/javascript/mastodon/components/load_gap.js b/app/javascript/mastodon/components/load_gap.js index 7c7e8fe1e..ed4d445d0 100644 --- a/app/javascript/mastodon/components/load_gap.js +++ b/app/javascript/mastodon/components/load_gap.js @@ -25,7 +25,7 @@ class LoadGap extends React.PureComponent { return ( <button className='load-more load-gap' disabled={disabled} onClick={this.handleClick} aria-label={intl.formatMessage(messages.load_more)}> - <i className='fas fa-ellipsis-h' /> + <i className='fa fa-ellipsis-h' /> </button> ); } diff --git a/app/javascript/mastodon/components/status.js b/app/javascript/mastodon/components/status.js index 08fecce5a..90c689a75 100644 --- a/app/javascript/mastodon/components/status.js +++ b/app/javascript/mastodon/components/status.js @@ -193,7 +193,7 @@ class Status extends ImmutablePureComponent { if (featured) { prepend = ( <div className='status__prepend'> - <div className='status__prepend-icon-wrapper'><i className='fas fa-fw fa-thumbtack status__prepend-icon' /></div> + <div className='status__prepend-icon-wrapper'><i className='fa fa-fw fa-thumb-tack status__prepend-icon' /></div> <FormattedMessage id='status.pinned' defaultMessage='Pinned toot' /> </div> ); @@ -202,7 +202,7 @@ class Status extends ImmutablePureComponent { prepend = ( <div className='status__prepend'> - <div className='status__prepend-icon-wrapper'><i className='fas fa-fw fa-retweet status__prepend-icon' /></div> + <div className='status__prepend-icon-wrapper'><i className='fa fa-fw fa-retweet status__prepend-icon' /></div> <FormattedMessage id='status.reblogged_by' defaultMessage='{name} boosted' values={{ name: <a onClick={this.handleAccountClick} data-id={status.getIn(['account', 'id'])} href={status.getIn(['account', 'url'])} className='status__display-name muted'><bdi><strong dangerouslySetInnerHTML={display_name_html} /></bdi></a> }} /> </div> ); diff --git a/app/javascript/mastodon/features/account/components/header.js b/app/javascript/mastodon/features/account/components/header.js index 4934e7a27..11ae58905 100644 --- a/app/javascript/mastodon/features/account/components/header.js +++ b/app/javascript/mastodon/features/account/components/header.js @@ -3,7 +3,6 @@ import ImmutablePropTypes from 'react-immutable-proptypes'; import PropTypes from 'prop-types'; import { defineMessages, injectIntl, FormattedMessage } from 'react-intl'; import IconButton from '../../../components/icon_button'; -import BotIcon from '../../../components/bot_icon'; import Motion from '../../ui/util/optional_motion'; import spring from 'react-motion/lib/spring'; import ImmutablePureComponent from 'react-immutable-pure-component'; @@ -68,7 +67,6 @@ class Avatar extends ImmutablePureComponent { onBlur={this.handleMouseOut} > <span style={{ display: 'none' }}>{account.get('acct')}</span> - <BotIcon account={account} /> </a> )} </Motion> @@ -140,7 +138,7 @@ class Header extends ImmutablePureComponent { } else { actionBtn = ( <div className='account--action-button'> - <IconButton size={26} icon='pencil-alt' title={intl.formatMessage(messages.edit_profile)} onClick={this.openEditProfile} /> + <IconButton size={26} icon='pencil' title={intl.formatMessage(messages.edit_profile)} onClick={this.openEditProfile} /> </div> ); } @@ -150,7 +148,7 @@ class Header extends ImmutablePureComponent { } if (account.get('locked')) { - lockedIcon = <i className='fas fa-lock' />; + lockedIcon = <i className='fa fa-lock' />; } const content = { __html: account.get('note_emojified') }; @@ -177,7 +175,7 @@ class Header extends ImmutablePureComponent { <dt dangerouslySetInnerHTML={{ __html: pair.get('name_emojified') }} title={pair.get('name')} /> <dd className={pair.get('verified_at') && 'verified'} title={pair.get('value_plain')}> - {pair.get('verified_at') && <span title={intl.formatMessage(messages.linkVerifiedOn, { date: intl.formatDate(pair.get('verified_at'), dateFormatOptions) })}><i className='fas fa-check verified__mark' /></span>} <span dangerouslySetInnerHTML={{ __html: pair.get('value_emojified') }} /> + {pair.get('verified_at') && <span title={intl.formatMessage(messages.linkVerifiedOn, { date: intl.formatDate(pair.get('verified_at'), dateFormatOptions) })}><i className='fa fa-check verified__mark' /></span>} <span dangerouslySetInnerHTML={{ __html: pair.get('value_emojified') }} /> </dd> </dl> ))} diff --git a/app/javascript/mastodon/features/account_timeline/components/moved_note.js b/app/javascript/mastodon/features/account_timeline/components/moved_note.js index ff3290031..280389bba 100644 --- a/app/javascript/mastodon/features/account_timeline/components/moved_note.js +++ b/app/javascript/mastodon/features/account_timeline/components/moved_note.js @@ -33,7 +33,7 @@ export default class MovedNote extends ImmutablePureComponent { return ( <div className='account__moved-note'> <div className='account__moved-note__message'> - <div className='account__moved-note__icon-wrapper'><i className='fas fa-fw fa-suitcase account__moved-note__icon' /></div> + <div className='account__moved-note__icon-wrapper'><i className='fa fa-fw fa-suitcase account__moved-note__icon' /></div> <FormattedMessage id='account.moved_to' defaultMessage='{name} has moved to:' values={{ name: <bdi><strong dangerouslySetInnerHTML={displayNameHtml} /></bdi> }} /> </div> diff --git a/app/javascript/mastodon/features/compose/components/compose_form.js b/app/javascript/mastodon/features/compose/components/compose_form.js index 199d11fcb..365114b93 100644 --- a/app/javascript/mastodon/features/compose/components/compose_form.js +++ b/app/javascript/mastodon/features/compose/components/compose_form.js @@ -160,7 +160,7 @@ class ComposeForm extends ImmutablePureComponent { let publishText = ''; if (this.props.privacy === 'private' || this.props.privacy === 'direct') { - publishText = <span className='compose-form__publish-private'><i className='fas fa-lock' /> {intl.formatMessage(messages.publish)}</span>; + publishText = <span className='compose-form__publish-private'><i className='fa fa-lock' /> {intl.formatMessage(messages.publish)}</span>; } else { publishText = this.props.privacy !== 'unlisted' ? intl.formatMessage(messages.publishLoud, { publish: intl.formatMessage(messages.publish) }) : intl.formatMessage(messages.publish); } diff --git a/app/javascript/mastodon/features/compose/components/privacy_dropdown.js b/app/javascript/mastodon/features/compose/components/privacy_dropdown.js index 43d0c73a4..7b5482f05 100644 --- a/app/javascript/mastodon/features/compose/components/privacy_dropdown.js +++ b/app/javascript/mastodon/features/compose/components/privacy_dropdown.js @@ -132,7 +132,7 @@ class PrivacyDropdownMenu extends React.PureComponent { {items.map(item => ( <div role='option' tabIndex='0' key={item.value} data-index={item.value} onKeyDown={this.handleKeyDown} onClick={this.handleClick} className={classNames('privacy-dropdown__option', { active: item.value === value })} aria-selected={item.value === value} ref={item.value === value ? this.setFocusRef : null}> <div className='privacy-dropdown__option__icon'> - <i className={`fas fa-fw fa-${item.icon}`} /> + <i className={`fa fa-fw fa-${item.icon}`} /> </div> <div className='privacy-dropdown__option__content'> diff --git a/app/javascript/mastodon/features/compose/components/search.js b/app/javascript/mastodon/features/compose/components/search.js index 8245dadd6..d203d8780 100644 --- a/app/javascript/mastodon/features/compose/components/search.js +++ b/app/javascript/mastodon/features/compose/components/search.js @@ -116,8 +116,8 @@ class Search extends React.PureComponent { </label> <div role='button' tabIndex='0' className='search__icon' onClick={this.handleClear}> - <i className={`fas fa-search ${hasValue ? '' : 'active'}`} /> - <i aria-label={intl.formatMessage(messages.placeholder)} className={`fas fa-times-circle ${hasValue ? 'active' : ''}`} /> + <i className={`fa fa-search ${hasValue ? '' : 'active'}`} /> + <i aria-label={intl.formatMessage(messages.placeholder)} className={`fa fa-times-circle ${hasValue ? 'active' : ''}`} /> </div> <Overlay show={expanded && !hasValue} placement='bottom' target={this}> diff --git a/app/javascript/mastodon/features/compose/components/search_results.js b/app/javascript/mastodon/features/compose/components/search_results.js index 51496c00b..c351b84bb 100644 --- a/app/javascript/mastodon/features/compose/components/search_results.js +++ b/app/javascript/mastodon/features/compose/components/search_results.js @@ -22,7 +22,7 @@ export default class SearchResults extends ImmutablePureComponent { count += results.get('accounts').size; accounts = ( <div className='search-results__section'> - <h5><i className='fas fa-fw fa-users' /><FormattedMessage id='search_results.accounts' defaultMessage='People' /></h5> + <h5><i className='fa fa-fw fa-users' /><FormattedMessage id='search_results.accounts' defaultMessage='People' /></h5> {results.get('accounts').map(accountId => <AccountContainer key={accountId} id={accountId} />)} </div> @@ -33,7 +33,7 @@ export default class SearchResults extends ImmutablePureComponent { count += results.get('statuses').size; statuses = ( <div className='search-results__section'> - <h5><i className='fas fa-fw fa-quote-right' /><FormattedMessage id='search_results.statuses' defaultMessage='Toots' /></h5> + <h5><i className='fa fa-fw fa-quote-right' /><FormattedMessage id='search_results.statuses' defaultMessage='Toots' /></h5> {results.get('statuses').map(statusId => <StatusContainer key={statusId} id={statusId} />)} </div> @@ -44,7 +44,7 @@ export default class SearchResults extends ImmutablePureComponent { count += results.get('hashtags').size; hashtags = ( <div className='search-results__section'> - <h5><i className='fas fa-fw fa-hashtag' /><FormattedMessage id='search_results.hashtags' defaultMessage='Hashtags' /></h5> + <h5><i className='fa fa-fw fa-hashtag' /><FormattedMessage id='search_results.hashtags' defaultMessage='Hashtags' /></h5> {results.get('hashtags').map(hashtag => <Hashtag key={hashtag.get('name')} hashtag={hashtag} />)} </div> @@ -54,7 +54,7 @@ export default class SearchResults extends ImmutablePureComponent { return ( <div className='search-results'> <div className='search-results__header'> - <i className='fas fa-search fa-fw' /> + <i className='fa fa-search fa-fw' /> <FormattedMessage id='search_results.total' defaultMessage='{count, number} {count, plural, one {result} other {results}}' values={{ count }} /> </div> diff --git a/app/javascript/mastodon/features/compose/components/upload.js b/app/javascript/mastodon/features/compose/components/upload.js index fd3f9f94f..e377da90c 100644 --- a/app/javascript/mastodon/features/compose/components/upload.js +++ b/app/javascript/mastodon/features/compose/components/upload.js @@ -89,8 +89,8 @@ class Upload extends ImmutablePureComponent { {({ scale }) => ( <div className='compose-form__upload-thumbnail' style={{ transform: `scale(${scale})`, backgroundImage: `url(${media.get('preview_url')})`, backgroundPosition: `${x}% ${y}%` }}> <div className={classNames('compose-form__upload__actions', { active })}> - <button className='icon-button' onClick={this.handleUndoClick}><i className='fas fa-times' /> <FormattedMessage id='upload_form.undo' defaultMessage='Delete' /></button> - {media.get('type') === 'image' && <button className='icon-button' onClick={this.handleFocalPointClick}><i className='fas fa-crosshairs' /> <FormattedMessage id='upload_form.focus' defaultMessage='Crop' /></button>} + <button className='icon-button' onClick={this.handleUndoClick}><i className='fa fa-times' /> <FormattedMessage id='upload_form.undo' defaultMessage='Delete' /></button> + {media.get('type') === 'image' && <button className='icon-button' onClick={this.handleFocalPointClick}><i className='fa fa-crosshairs' /> <FormattedMessage id='upload_form.focus' defaultMessage='Crop' /></button>} </div> <div className={classNames('compose-form__upload-description', { active })}> diff --git a/app/javascript/mastodon/features/compose/components/upload_progress.js b/app/javascript/mastodon/features/compose/components/upload_progress.js index 949989b26..d5e6f19cd 100644 --- a/app/javascript/mastodon/features/compose/components/upload_progress.js +++ b/app/javascript/mastodon/features/compose/components/upload_progress.js @@ -21,7 +21,7 @@ export default class UploadProgress extends React.PureComponent { return ( <div className='upload-progress'> <div className='upload-progress__icon'> - <i className='fas fa-upload' /> + <i className='fa fa-upload' /> </div> <div className='upload-progress__message'> diff --git a/app/javascript/mastodon/features/compose/index.js b/app/javascript/mastodon/features/compose/index.js index 398e1fc97..cf1714b71 100644 --- a/app/javascript/mastodon/features/compose/index.js +++ b/app/javascript/mastodon/features/compose/index.js @@ -76,21 +76,21 @@ class Compose extends React.PureComponent { const { columns } = this.props; header = ( <nav className='drawer__header'> - <Link to='/getting-started' className='drawer__tab' title={intl.formatMessage(messages.start)} aria-label={intl.formatMessage(messages.start)}><i role='img' className='fas fa-fw fa-bars' /></Link> + <Link to='/getting-started' className='drawer__tab' title={intl.formatMessage(messages.start)} aria-label={intl.formatMessage(messages.start)}><i role='img' className='fa fa-fw fa-bars' /></Link> {!columns.some(column => column.get('id') === 'HOME') && ( - <Link to='/timelines/home' className='drawer__tab' title={intl.formatMessage(messages.home_timeline)} aria-label={intl.formatMessage(messages.home_timeline)}><i role='img' className='fas fa-fw fa-home' /></Link> + <Link to='/timelines/home' className='drawer__tab' title={intl.formatMessage(messages.home_timeline)} aria-label={intl.formatMessage(messages.home_timeline)}><i role='img' className='fa fa-fw fa-home' /></Link> )} {!columns.some(column => column.get('id') === 'NOTIFICATIONS') && ( - <Link to='/notifications' className='drawer__tab' title={intl.formatMessage(messages.notifications)} aria-label={intl.formatMessage(messages.notifications)}><i role='img' className='fas fa-fw fa-bell' /></Link> + <Link to='/notifications' className='drawer__tab' title={intl.formatMessage(messages.notifications)} aria-label={intl.formatMessage(messages.notifications)}><i role='img' className='fa fa-fw fa-bell' /></Link> )} {!columns.some(column => column.get('id') === 'COMMUNITY') && ( - <Link to='/timelines/public/local' className='drawer__tab' title={intl.formatMessage(messages.community)} aria-label={intl.formatMessage(messages.community)}><i role='img' className='fas fa-fw fa-users' /></Link> + <Link to='/timelines/public/local' className='drawer__tab' title={intl.formatMessage(messages.community)} aria-label={intl.formatMessage(messages.community)}><i role='img' className='fa fa-fw fa-users' /></Link> )} {!columns.some(column => column.get('id') === 'PUBLIC') && ( - <Link to='/timelines/public' className='drawer__tab' title={intl.formatMessage(messages.public)} aria-label={intl.formatMessage(messages.public)}><i role='img' className='fas fa-fw fa-globe' /></Link> + <Link to='/timelines/public' className='drawer__tab' title={intl.formatMessage(messages.public)} aria-label={intl.formatMessage(messages.public)}><i role='img' className='fa fa-fw fa-globe' /></Link> )} - <a href='/settings/preferences' className='drawer__tab' title={intl.formatMessage(messages.preferences)} aria-label={intl.formatMessage(messages.preferences)}><i role='img' className='fas fa-fw fa-cog' /></a> - <a href='/auth/sign_out' className='drawer__tab' data-method='delete' title={intl.formatMessage(messages.logout)} aria-label={intl.formatMessage(messages.logout)}><i role='img' className='fas fa-fw fa-sign-out-alt' /></a> + <a href='/settings/preferences' className='drawer__tab' title={intl.formatMessage(messages.preferences)} aria-label={intl.formatMessage(messages.preferences)}><i role='img' className='fa fa-fw fa-cog' /></a> + <a href='/auth/sign_out' className='drawer__tab' data-method='delete' title={intl.formatMessage(messages.logout)} aria-label={intl.formatMessage(messages.logout)}><i role='img' className='fa fa-fw fa-sign-out' /></a> </nav> ); } diff --git a/app/javascript/mastodon/features/getting_started/index.js b/app/javascript/mastodon/features/getting_started/index.js index 2b70b7501..d5ba5cbce 100644 --- a/app/javascript/mastodon/features/getting_started/index.js +++ b/app/javascript/mastodon/features/getting_started/index.js @@ -109,7 +109,7 @@ class GettingStarted extends ImmutablePureComponent { if (!multiColumn) { navItems.push( <ColumnSubheading key={i++} text={intl.formatMessage(messages.settings_subheading)} />, - <ColumnLink key={i++} icon='cogs' text={intl.formatMessage(messages.preferences)} href='/settings/preferences' />, + <ColumnLink key={i++} icon='gears' text={intl.formatMessage(messages.preferences)} href='/settings/preferences' />, ); height += 34 + 48; @@ -120,7 +120,7 @@ class GettingStarted extends ImmutablePureComponent { {multiColumn && <div className='column-header__wrapper'> <h1 className='column-header'> <button> - <i className='fas fa-bars fa-fw column-header__icon' /> + <i className='fa fa-bars fa-fw column-header__icon' /> <FormattedMessage id='getting_started.heading' defaultMessage='Getting started' /> </button> </h1> diff --git a/app/javascript/mastodon/features/list_editor/components/search.js b/app/javascript/mastodon/features/list_editor/components/search.js index 24f2c7d5d..f7617fe58 100644 --- a/app/javascript/mastodon/features/list_editor/components/search.js +++ b/app/javascript/mastodon/features/list_editor/components/search.js @@ -65,8 +65,8 @@ class Search extends React.PureComponent { </label> <div role='button' tabIndex='0' className='search__icon' onClick={this.handleClear}> - <i className={classNames('fas fa-search', { active: !hasValue })} /> - <i aria-label={intl.formatMessage(messages.search)} className={classNames('fas fa-times-circle', { active: hasValue })} /> + <i className={classNames('fa fa-search', { active: !hasValue })} /> + <i aria-label={intl.formatMessage(messages.search)} className={classNames('fa fa-times-circle', { active: hasValue })} /> </div> </div> ); diff --git a/app/javascript/mastodon/features/list_timeline/index.js b/app/javascript/mastodon/features/list_timeline/index.js index cdfb068cf..5b047ace4 100644 --- a/app/javascript/mastodon/features/list_timeline/index.js +++ b/app/javascript/mastodon/features/list_timeline/index.js @@ -150,11 +150,11 @@ class ListTimeline extends React.PureComponent { > <div className='column-header__links'> <button className='text-btn column-header__setting-btn' tabIndex='0' onClick={this.handleEditClick}> - <i className='fas fa-pencil-alt' /> <FormattedMessage id='lists.edit' defaultMessage='Edit list' /> + <i className='fa fa-pencil' /> <FormattedMessage id='lists.edit' defaultMessage='Edit list' /> </button> <button className='text-btn column-header__setting-btn' tabIndex='0' onClick={this.handleDeleteClick}> - <i className='fas fa-trash-alt' /> <FormattedMessage id='lists.delete' defaultMessage='Delete list' /> + <i className='fa fa-trash' /> <FormattedMessage id='lists.delete' defaultMessage='Delete list' /> </button> </div> diff --git a/app/javascript/mastodon/features/notifications/components/clear_column_button.js b/app/javascript/mastodon/features/notifications/components/clear_column_button.js index ea1249e86..e0bf4c82d 100644 --- a/app/javascript/mastodon/features/notifications/components/clear_column_button.js +++ b/app/javascript/mastodon/features/notifications/components/clear_column_button.js @@ -10,7 +10,7 @@ export default class ClearColumnButton extends React.PureComponent { render () { return ( - <button className='text-btn column-header__setting-btn' tabIndex='0' onClick={this.props.onClick}><i className='fas fa-eraser' /> <FormattedMessage id='notifications.clear' defaultMessage='Clear notifications' /></button> + <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> ); } diff --git a/app/javascript/mastodon/features/notifications/components/notification.js b/app/javascript/mastodon/features/notifications/components/notification.js index 8776f8be0..8df6830c5 100644 --- a/app/javascript/mastodon/features/notifications/components/notification.js +++ b/app/javascript/mastodon/features/notifications/components/notification.js @@ -83,7 +83,7 @@ class Notification extends ImmutablePureComponent { <div className='notification notification-follow focusable' tabIndex='0' aria-label={notificationForScreenReader(intl, intl.formatMessage({ id: 'notification.follow', defaultMessage: '{name} followed you' }, { name: account.get('acct') }), notification.get('created_at'))}> <div className='notification__message'> <div className='notification__favourite-icon-wrapper'> - <i className='fas fa-fw fa-user-plus' /> + <i className='fa fa-fw fa-user-plus' /> </div> <span title={notification.get('created_at')}> <FormattedMessage id='notification.follow' defaultMessage='{name} followed you' values={{ name: link }} /> @@ -117,7 +117,7 @@ class Notification extends ImmutablePureComponent { <div className='notification notification-favourite focusable' tabIndex='0' aria-label={notificationForScreenReader(intl, intl.formatMessage({ id: 'notification.favourite', defaultMessage: '{name} favourited your status' }, { name: notification.getIn(['account', 'acct']) }), notification.get('created_at'))}> <div className='notification__message'> <div className='notification__favourite-icon-wrapper'> - <i className='fas fa-fw fa-star star-icon' /> + <i className='fa fa-fw fa-star star-icon' /> </div> <FormattedMessage id='notification.favourite' defaultMessage='{name} favourited your status' values={{ name: link }} /> </div> @@ -136,7 +136,7 @@ class Notification extends ImmutablePureComponent { <div className='notification notification-reblog focusable' tabIndex='0' aria-label={notificationForScreenReader(intl, intl.formatMessage({ id: 'notification.reblog', defaultMessage: '{name} boosted your status' }, { name: notification.getIn(['account', 'acct']) }), notification.get('created_at'))}> <div className='notification__message'> <div className='notification__favourite-icon-wrapper'> - <i className='fas fa-fw fa-retweet' /> + <i className='fa fa-fw fa-retweet' /> </div> <FormattedMessage id='notification.reblog' defaultMessage='{name} boosted your status' values={{ name: link }} /> </div> diff --git a/app/javascript/mastodon/features/pinned_statuses/index.js b/app/javascript/mastodon/features/pinned_statuses/index.js index 298d0f8c5..98cdbda3c 100644 --- a/app/javascript/mastodon/features/pinned_statuses/index.js +++ b/app/javascript/mastodon/features/pinned_statuses/index.js @@ -46,7 +46,7 @@ class PinnedStatuses extends ImmutablePureComponent { const { intl, shouldUpdateScroll, statusIds, hasMore } = this.props; return ( - <Column icon='thumbtack' heading={intl.formatMessage(messages.heading)} ref={this.setRef}> + <Column icon='thumb-tack' heading={intl.formatMessage(messages.heading)} ref={this.setRef}> <ColumnBackButtonSlim /> <StatusList statusIds={statusIds} diff --git a/app/javascript/mastodon/features/status/components/card.js b/app/javascript/mastodon/features/status/components/card.js index 65259cb84..b52f3c4fa 100644 --- a/app/javascript/mastodon/features/status/components/card.js +++ b/app/javascript/mastodon/features/status/components/card.js @@ -173,8 +173,8 @@ export default class Card extends React.PureComponent { <div className='status-card__actions'> <div> - <button onClick={this.handleEmbedClick}><i className={`fas fa-${iconVariant}`} /></button> - <a href={card.get('url')} target='_blank' rel='noopener'><i className='fas fa-external-link-alt' /></a> + <button onClick={this.handleEmbedClick}><i className={`fa fa-${iconVariant}`} /></button> + <a href={card.get('url')} target='_blank' rel='noopener'><i className='fa fa-external-link' /></a> </div> </div> </div> diff --git a/app/javascript/mastodon/features/status/components/detailed_status.js b/app/javascript/mastodon/features/status/components/detailed_status.js index 7f5d50743..b4bbda161 100644 --- a/app/javascript/mastodon/features/status/components/detailed_status.js +++ b/app/javascript/mastodon/features/status/components/detailed_status.js @@ -94,10 +94,10 @@ export default class DetailedStatus extends ImmutablePureComponent { } if (status.get('visibility') === 'private') { - reblogLink = <i className={`fas fa-${reblogIcon}`} />; + reblogLink = <i className={`fa fa-${reblogIcon}`} />; } else { reblogLink = (<Link to={`/statuses/${status.get('id')}/reblogs`} className='detailed-status__link'> - <i className={`fas fa-${reblogIcon}`} /> + <i className={`fa fa-${reblogIcon}`} /> <span className='detailed-status__reblogs'> <FormattedNumber value={status.get('reblogs_count')} /> </span> @@ -119,7 +119,7 @@ export default class DetailedStatus extends ImmutablePureComponent { <a className='detailed-status__datetime' href={status.get('url')} target='_blank' rel='noopener'> <FormattedDate value={new Date(status.get('created_at'))} hour12={false} year='numeric' month='short' day='2-digit' hour='2-digit' minute='2-digit' /> </a>{applicationLink} · {reblogLink} · <Link to={`/statuses/${status.get('id')}/favourites`} className='detailed-status__link'> - <i className='fas fa-star' /> + <i className='fa fa-star' /> <span className='detailed-status__favorites'> <FormattedNumber value={status.get('favourites_count')} /> </span> diff --git a/app/javascript/mastodon/features/status/index.js b/app/javascript/mastodon/features/status/index.js index a9fe4c885..7d1bc2ca4 100644 --- a/app/javascript/mastodon/features/status/index.js +++ b/app/javascript/mastodon/features/status/index.js @@ -410,7 +410,7 @@ class Status extends ImmutablePureComponent { <ColumnHeader showBackButton extraButton={( - <button className='column-header__button' title={intl.formatMessage(status.get('hidden') ? messages.revealAll : messages.hideAll)} aria-label={intl.formatMessage(status.get('hidden') ? messages.revealAll : messages.hideAll)} onClick={this.handleToggleAll} aria-pressed={status.get('hidden') ? 'false' : 'true'}><i className={`fas fa-${status.get('hidden') ? 'eye-slash' : 'eye'}`} /></button> + <button className='column-header__button' title={intl.formatMessage(status.get('hidden') ? messages.revealAll : messages.hideAll)} aria-label={intl.formatMessage(status.get('hidden') ? messages.revealAll : messages.hideAll)} onClick={this.handleToggleAll} aria-pressed={status.get('hidden') ? 'false' : 'true'}><i className={`fa fa-${status.get('hidden') ? 'eye-slash' : 'eye'}`} /></button> )} /> diff --git a/app/javascript/mastodon/features/ui/components/boost_modal.js b/app/javascript/mastodon/features/ui/components/boost_modal.js index f20ea4c36..b128e67d2 100644 --- a/app/javascript/mastodon/features/ui/components/boost_modal.js +++ b/app/javascript/mastodon/features/ui/components/boost_modal.js @@ -74,7 +74,7 @@ class BoostModal extends ImmutablePureComponent { </div> <div className='boost-modal__action-bar'> - <div><FormattedMessage id='boost_modal.combo' defaultMessage='You can press {combo} to skip this next time' values={{ combo: <span>Shift + <i className='fas fa-retweet' /></span> }} /></div> + <div><FormattedMessage id='boost_modal.combo' defaultMessage='You can press {combo} to skip this next time' values={{ combo: <span>Shift + <i className='fa fa-retweet' /></span> }} /></div> <Button text={intl.formatMessage(messages.reblog)} onClick={this.handleReblog} ref={this.setRef} /> </div> </div> diff --git a/app/javascript/mastodon/features/ui/components/column_header.js b/app/javascript/mastodon/features/ui/components/column_header.js index db544b7d6..e8bdd8054 100644 --- a/app/javascript/mastodon/features/ui/components/column_header.js +++ b/app/javascript/mastodon/features/ui/components/column_header.js @@ -21,7 +21,7 @@ export default class ColumnHeader extends React.PureComponent { let iconElement = ''; if (icon) { - iconElement = <i className={`fas fa-fw fa-${icon} column-header__icon`} />; + iconElement = <i className={`fa fa-fw fa-${icon} column-header__icon`} />; } return ( diff --git a/app/javascript/mastodon/features/ui/components/column_link.js b/app/javascript/mastodon/features/ui/components/column_link.js index f6bb4f6f6..25c2d1cf8 100644 --- a/app/javascript/mastodon/features/ui/components/column_link.js +++ b/app/javascript/mastodon/features/ui/components/column_link.js @@ -8,7 +8,7 @@ const ColumnLink = ({ icon, text, to, href, method, badge }) => { if (href) { return ( <a href={href} className='column-link' data-method={method}> - <i className={`fas fa-fw fa-${icon} column-link__icon`} /> + <i className={`fa fa-fw fa-${icon} column-link__icon`} /> {text} {badgeElement} </a> @@ -16,7 +16,7 @@ const ColumnLink = ({ icon, text, to, href, method, badge }) => { } else { return ( <Link to={to} className='column-link'> - <i className={`fas fa-fw fa-${icon} column-link__icon`} /> + <i className={`fa fa-fw fa-${icon} column-link__icon`} /> {text} {badgeElement} </Link> diff --git a/app/javascript/mastodon/features/ui/components/columns_area.js b/app/javascript/mastodon/features/ui/components/columns_area.js index f3ba3ba13..ed338c2eb 100644 --- a/app/javascript/mastodon/features/ui/components/columns_area.js +++ b/app/javascript/mastodon/features/ui/components/columns_area.js @@ -160,7 +160,7 @@ class ColumnsArea extends ImmutablePureComponent { this.pendingIndex = null; if (singleColumn) { - const floatingActionButton = shouldHideFAB(this.context.router.history.location.pathname) ? null : <Link key='floating-action-button' to='/statuses/new' className='floating-action-button' aria-label={intl.formatMessage(messages.publish)}><i className='fas fa-pencil-alt' /></Link>; + const floatingActionButton = shouldHideFAB(this.context.router.history.location.pathname) ? null : <Link key='floating-action-button' to='/statuses/new' className='floating-action-button' aria-label={intl.formatMessage(messages.publish)}><i className='fa fa-pencil' /></Link>; return columnIndex !== -1 ? [ <ReactSwipeableViews key='content' index={columnIndex} onChangeIndex={this.handleSwipe} onTransitionEnd={this.handleAnimationEnd} animateTransitions={shouldAnimate} springConfig={{ duration: '400ms', delay: '0s', easeFunction: 'ease' }} style={{ height: '100%' }}> diff --git a/app/javascript/mastodon/features/ui/components/media_modal.js b/app/javascript/mastodon/features/ui/components/media_modal.js index 9aa336e37..d29a4a6a7 100644 --- a/app/javascript/mastodon/features/ui/components/media_modal.js +++ b/app/javascript/mastodon/features/ui/components/media_modal.js @@ -108,8 +108,8 @@ class MediaModal extends ImmutablePureComponent { const index = this.getIndex(); let pagination = []; - const leftNav = media.size > 1 && <button tabIndex='0' className='media-modal__nav media-modal__nav--left' onClick={this.handlePrevClick} aria-label={intl.formatMessage(messages.previous)}><i className='fas fa-fw fa-chevron-left' /></button>; - const rightNav = media.size > 1 && <button tabIndex='0' className='media-modal__nav media-modal__nav--right' onClick={this.handleNextClick} aria-label={intl.formatMessage(messages.next)}><i className='fas fa-fw fa-chevron-right' /></button>; + const leftNav = media.size > 1 && <button tabIndex='0' className='media-modal__nav media-modal__nav--left' onClick={this.handlePrevClick} aria-label={intl.formatMessage(messages.previous)}><i className='fa fa-fw fa-chevron-left' /></button>; + const rightNav = media.size > 1 && <button tabIndex='0' className='media-modal__nav media-modal__nav--right' onClick={this.handleNextClick} aria-label={intl.formatMessage(messages.next)}><i className='fa fa-fw fa-chevron-right' /></button>; if (media.size > 1) { pagination = media.map((item, i) => { diff --git a/app/javascript/mastodon/features/ui/components/onboarding_modal.js b/app/javascript/mastodon/features/ui/components/onboarding_modal.js index 3688d9412..25241bcd0 100644 --- a/app/javascript/mastodon/features/ui/components/onboarding_modal.js +++ b/app/javascript/mastodon/features/ui/components/onboarding_modal.js @@ -262,11 +262,11 @@ class OnboardingModal extends React.PureComponent { const nextOrDoneBtn = hasMore ? ( <button onClick={this.handleNext} className='onboarding-modal__nav onboarding-modal__next shake-bottom'> - <FormattedMessage id='onboarding.next' defaultMessage='Next' /> <i className='fas fa-fw fa-chevron-right' /> + <FormattedMessage id='onboarding.next' defaultMessage='Next' /> <i className='fa fa-fw fa-chevron-right' /> </button> ) : ( <button onClick={this.handleClose} className='onboarding-modal__nav onboarding-modal__done shake-bottom'> - <FormattedMessage id='onboarding.done' defaultMessage='Done' /> <i className='fas fa-fw fa-check' /> + <FormattedMessage id='onboarding.done' defaultMessage='Done' /> <i className='fa fa-fw fa-check' /> </button> ); diff --git a/app/javascript/mastodon/features/ui/components/tabs_bar.js b/app/javascript/mastodon/features/ui/components/tabs_bar.js index 3f2e5478a..16236ea51 100644 --- a/app/javascript/mastodon/features/ui/components/tabs_bar.js +++ b/app/javascript/mastodon/features/ui/components/tabs_bar.js @@ -6,14 +6,14 @@ import { debounce } from 'lodash'; import { isUserTouching } from '../../../is_mobile'; export const links = [ - <NavLink className='tabs-bar__link primary' to='/timelines/home' data-preview-title-id='column.home' data-preview-icon='home' ><i className='fas fa-fw fa-home' /><FormattedMessage id='tabs_bar.home' defaultMessage='Home' /></NavLink>, - <NavLink className='tabs-bar__link primary' to='/notifications' data-preview-title-id='column.notifications' data-preview-icon='bell' ><i className='fas fa-fw fa-bell' /><FormattedMessage id='tabs_bar.notifications' defaultMessage='Notifications' /></NavLink>, + <NavLink className='tabs-bar__link primary' to='/timelines/home' data-preview-title-id='column.home' data-preview-icon='home' ><i className='fa fa-fw fa-home' /><FormattedMessage id='tabs_bar.home' defaultMessage='Home' /></NavLink>, + <NavLink className='tabs-bar__link primary' to='/notifications' data-preview-title-id='column.notifications' data-preview-icon='bell' ><i className='fa fa-fw fa-bell' /><FormattedMessage id='tabs_bar.notifications' defaultMessage='Notifications' /></NavLink>, - <NavLink className='tabs-bar__link secondary' to='/timelines/public/local' data-preview-title-id='column.community' data-preview-icon='users' ><i className='fas fa-fw fa-users' /><FormattedMessage id='tabs_bar.local_timeline' defaultMessage='Local' /></NavLink>, - <NavLink className='tabs-bar__link secondary' exact to='/timelines/public' data-preview-title-id='column.public' data-preview-icon='globe' ><i className='fas fa-fw fa-globe' /><FormattedMessage id='tabs_bar.federated_timeline' defaultMessage='Federated' /></NavLink>, - <NavLink className='tabs-bar__link primary' to='/search' data-preview-title-id='tabs_bar.search' data-preview-icon='bell' ><i className='fas fa-fw fa-search' /><FormattedMessage id='tabs_bar.search' defaultMessage='Search' /></NavLink>, + <NavLink className='tabs-bar__link secondary' to='/timelines/public/local' data-preview-title-id='column.community' data-preview-icon='users' ><i className='fa fa-fw fa-users' /><FormattedMessage id='tabs_bar.local_timeline' defaultMessage='Local' /></NavLink>, + <NavLink className='tabs-bar__link secondary' exact to='/timelines/public' data-preview-title-id='column.public' data-preview-icon='globe' ><i className='fa fa-fw fa-globe' /><FormattedMessage id='tabs_bar.federated_timeline' defaultMessage='Federated' /></NavLink>, + <NavLink className='tabs-bar__link primary' to='/search' data-preview-title-id='tabs_bar.search' data-preview-icon='bell' ><i className='fa fa-fw fa-search' /><FormattedMessage id='tabs_bar.search' defaultMessage='Search' /></NavLink>, - <NavLink className='tabs-bar__link primary' style={{ flexGrow: '0', flexBasis: '30px' }} to='/getting-started' data-preview-title-id='getting_started.heading' data-preview-icon='bars' ><i className='fas fa-fw fa-bars' /></NavLink>, + <NavLink className='tabs-bar__link primary' style={{ flexGrow: '0', flexBasis: '30px' }} to='/getting-started' data-preview-title-id='getting_started.heading' data-preview-icon='bars' ><i className='fa fa-fw fa-bars' /></NavLink>, ]; export function getIndex (path) { diff --git a/app/javascript/mastodon/features/video/index.js b/app/javascript/mastodon/features/video/index.js index e1e284b5a..67f7580b9 100644 --- a/app/javascript/mastodon/features/video/index.js +++ b/app/javascript/mastodon/features/video/index.js @@ -353,10 +353,10 @@ class Video extends React.PureComponent { <div className='video-player__buttons-bar'> <div className='video-player__buttons left'> - <button type='button' aria-label={intl.formatMessage(paused ? messages.play : messages.pause)} onClick={this.togglePlay}><i className={classNames('fas fa-fw', { 'fa-play': paused, 'fa-pause': !paused })} /></button> - <button type='button' aria-label={intl.formatMessage(muted ? messages.unmute : messages.mute)} onClick={this.toggleMute}><i className={classNames('fas fa-fw', { 'fa-volume-off': muted, 'fa-volume-up': !muted })} /></button> + <button type='button' aria-label={intl.formatMessage(paused ? messages.play : messages.pause)} onClick={this.togglePlay}><i className={classNames('fa fa-fw', { 'fa-play': paused, 'fa-pause': !paused })} /></button> + <button type='button' aria-label={intl.formatMessage(muted ? messages.unmute : messages.mute)} onClick={this.toggleMute}><i className={classNames('fa fa-fw', { 'fa-volume-off': muted, 'fa-volume-up': !muted })} /></button> - {!onCloseVideo && <button type='button' aria-label={intl.formatMessage(messages.hide)} onClick={this.toggleReveal}><i className='fas fa-fw fa-eye' /></button>} + {!onCloseVideo && <button type='button' aria-label={intl.formatMessage(messages.hide)} onClick={this.toggleReveal}><i className='fa fa-fw fa-eye' /></button>} {(detailed || fullscreen) && <span> @@ -368,9 +368,9 @@ class Video extends React.PureComponent { </div> <div className='video-player__buttons right'> - {(!fullscreen && onOpenVideo) && <button type='button' aria-label={intl.formatMessage(messages.expand)} onClick={this.handleOpenVideo}><i className='fas fa-fw fa-expand' /></button>} - {onCloseVideo && <button type='button' aria-label={intl.formatMessage(messages.close)} onClick={this.handleCloseVideo}><i className='fas fa-fw fa-compress' /></button>} - <button type='button' aria-label={intl.formatMessage(fullscreen ? messages.exit_fullscreen : messages.fullscreen)} onClick={this.toggleFullscreen}><i className={classNames('fas fa-fw', { 'fa-expand-arrows-alt': !fullscreen, 'fa-compress': fullscreen })} /></button> + {(!fullscreen && onOpenVideo) && <button type='button' aria-label={intl.formatMessage(messages.expand)} onClick={this.handleOpenVideo}><i className='fa fa-fw fa-expand' /></button>} + {onCloseVideo && <button type='button' aria-label={intl.formatMessage(messages.close)} onClick={this.handleCloseVideo}><i className='fa fa-fw fa-compress' /></button>} + <button type='button' aria-label={intl.formatMessage(fullscreen ? messages.exit_fullscreen : messages.fullscreen)} onClick={this.toggleFullscreen}><i className={classNames('fa fa-fw', { 'fa-arrows-alt': !fullscreen, 'fa-compress': fullscreen })} /></button> </div> </div> </div> diff --git a/app/javascript/styles/mastodon/about.scss b/app/javascript/styles/mastodon/about.scss index 06a5f83d1..dc456be3e 100644 --- a/app/javascript/styles/mastodon/about.scss +++ b/app/javascript/styles/mastodon/about.scss @@ -1113,7 +1113,7 @@ $small-breakpoint: 960px; align-items: center; margin-left: 15px; - .fas { + .fa { display: block; color: $darker-text-color; font-size: 48px; diff --git a/app/javascript/styles/mastodon/accounts.scss b/app/javascript/styles/mastodon/accounts.scss index 830c64d50..06effbdb2 100644 --- a/app/javascript/styles/mastodon/accounts.scss +++ b/app/javascript/styles/mastodon/accounts.scss @@ -136,7 +136,7 @@ float: left; padding-left: 0; - .fas { + .fa { display: inline-block; margin-right: 5px; } @@ -146,7 +146,7 @@ float: right; padding-right: 0; - .fas { + .fa { display: inline-block; margin-left: 5px; } diff --git a/app/javascript/styles/mastodon/admin.scss b/app/javascript/styles/mastodon/admin.scss index 1ae4aa1fe..b6c771abf 100644 --- a/app/javascript/styles/mastodon/admin.scss +++ b/app/javascript/styles/mastodon/admin.scss @@ -50,7 +50,7 @@ $no-columns-breakpoint: 600px; transition: all 200ms linear; border-radius: 4px 0 0 4px; - i.fas { + i.fa { margin-right: 5px; } diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss index dd440d16f..90e2ed5a5 100644 --- a/app/javascript/styles/mastodon/components.scss +++ b/app/javascript/styles/mastodon/components.scss @@ -675,7 +675,7 @@ &:hover { text-decoration: underline; - .fas { + .fa { color: lighten($dark-text-color, 7%); } } @@ -690,7 +690,7 @@ } } - .fas { + .fa { color: $dark-text-color; } } @@ -1132,12 +1132,6 @@ vertical-align: middle; margin-right: 5px; } - - .bot-icon { - position: absolute; - bottom: -.333em; - left: -.333em; - } } a .account__avatar { @@ -1355,22 +1349,10 @@ a .account__avatar { .account__header__avatar { background-size: 90px 90px; display: block; - font-size: 1.5em; height: 90px; margin: 0 auto 10px; - position: relative; + overflow: hidden; width: 90px; - - .bot-icon { - color: $dark-text-color; - position: absolute; - bottom: 0; - left: 0; - - .light & { - color: $inverted-text-color; - } - } } .account-authorize { @@ -1496,7 +1478,7 @@ a.account__display-name { font-size: 15px; position: relative; - .fas { + .fa { color: $highlight-text-color; } @@ -2044,7 +2026,7 @@ a.account__display-name { border-bottom: 2px solid lighten($ui-base-color, 8%); transition: all 50ms linear; - .fas { + .fa { font-weight: 400; font-size: 16px; } @@ -3274,7 +3256,7 @@ a.status-card { overflow: hidden; display: flex; - .fas { + .fa { font-size: 34px; margin-right: 10px; } @@ -3491,7 +3473,7 @@ a.status-card { outline: 0 !important; } - .fas { + .fa { position: absolute; top: 10px; right: 10px; @@ -3545,7 +3527,7 @@ a.status-card { font-size: 16px; cursor: default; - .fas { + .fa { display: inline-block; margin-right: 5px; } @@ -3564,7 +3546,7 @@ a.status-card { font-size: 16px; color: $dark-text-color; - .fas { + .fa { display: inline-block; margin-right: 5px; } @@ -4462,7 +4444,7 @@ a.status-card { justify-content: center; font-size: 26px; - .fas { + .fa { display: block; } } @@ -4500,7 +4482,7 @@ a.status-card { display: block; } - .fas { + .fa { color: $dark-text-color; } } @@ -5447,7 +5429,7 @@ noscript { font-size: 16px; cursor: default; - .fas { + .fa { display: inline-block; margin-right: 5px; } diff --git a/app/javascript/styles/mastodon/forms.scss b/app/javascript/styles/mastodon/forms.scss index c829023ee..be2bf7cea 100644 --- a/app/javascript/styles/mastodon/forms.scss +++ b/app/javascript/styles/mastodon/forms.scss @@ -656,7 +656,7 @@ code { } } - .fas { + .fa { font-weight: 400; } } diff --git a/app/javascript/styles/mastodon/rtl.scss b/app/javascript/styles/mastodon/rtl.scss index 16d09fa41..11588d47f 100644 --- a/app/javascript/styles/mastodon/rtl.scss +++ b/app/javascript/styles/mastodon/rtl.scss @@ -38,7 +38,7 @@ body.rtl { padding-left: 30px; } - .search__icon .fas { + .search__icon .fa { right: auto; left: 10px; } @@ -197,7 +197,7 @@ body.rtl { } .admin-wrapper .sidebar ul a i.fa, - a.table-action-link i.fas { + a.table-action-link i.fa { margin-right: 0; margin-left: 5px; } @@ -264,7 +264,7 @@ body.rtl { left: 0; } - .landing-page .fa-external-link-alt { + .landing-page .fa-external-link { padding-right: 5px; padding-left: 0 !important; } diff --git a/app/javascript/styles/mastodon/tables.scss b/app/javascript/styles/mastodon/tables.scss index 73195ac0a..adb75afe5 100644 --- a/app/javascript/styles/mastodon/tables.scss +++ b/app/javascript/styles/mastodon/tables.scss @@ -112,7 +112,7 @@ a.table-action-link { color: $primary-text-color; } - i.fas { + i.fa { font-weight: 400; margin-right: 5px; } diff --git a/app/javascript/styles/mastodon/widgets.scss b/app/javascript/styles/mastodon/widgets.scss index 8267c3f4b..f843f0b42 100644 --- a/app/javascript/styles/mastodon/widgets.scss +++ b/app/javascript/styles/mastodon/widgets.scss @@ -196,7 +196,7 @@ &__message { margin-bottom: 15px; - .fas { + .fa { margin-right: 5px; color: $darker-text-color; } diff --git a/app/views/about/_links.html.haml b/app/views/about/_links.html.haml index b392b1789..f79c37e65 100644 --- a/app/views/about/_links.html.haml +++ b/app/views/about/_links.html.haml @@ -13,4 +13,4 @@ %li = link_to 'https://joinmastodon.org/' do = "#{t('about.other_instances')}" - %i.fa.fa-external-link-alt{ style: 'padding-left: 5px;' } + %i.fa.fa-external-link{ style: 'padding-left: 5px;' } diff --git a/app/views/layouts/modal.html.haml b/app/views/layouts/modal.html.haml index fc8b00e0d..2ef49e413 100644 --- a/app/views/layouts/modal.html.haml +++ b/app/views/layouts/modal.html.haml @@ -9,7 +9,7 @@ = t 'users.signed_in_as' %span.username @#{current_account.local_username_and_domain} = link_to destroy_user_session_path(continue: true), method: :delete, class: 'logout-link icon-button' do - = fa_icon 'sign-out-alt' + = fa_icon 'sign-out' .container-alt= yield .modal-layout__mastodon diff --git a/app/views/stream_entries/_status.html.haml b/app/views/stream_entries/_status.html.haml index e5b7e695d..83887cd87 100644 --- a/app/views/stream_entries/_status.html.haml +++ b/app/views/stream_entries/_status.html.haml @@ -35,7 +35,7 @@ - elsif pinned .status__prepend .status__prepend-icon-wrapper - %i.status__prepend-icon.fa.fa-fw.fa-thumbtack + %i.status__prepend-icon.fa.fa-fw.fa-thumb-tack %span = t('stream_entries.pinned') |