forked from treehouse/mastodon
Revert Font Awesome 5 upgrade (#8810)
* Revert "Fix some icon names changed by the Font Awesome 5. (#8796)" This reverts commitrebase/4.0.0rc23f9ec3de82
. * Revert "Migrate to font-awesome 5.0. (#8799)" This reverts commit8bae14591b
. * Revert "Fix some icons names, unavailable in fontawesome5 (free license). (#8792)" This reverts commitb9c727a945
. * Revert "Update the icon name changed by the Font Awesome 5. (#8776)" This reverts commit17af4d27da
. * Revert "Add bot icon to bot avatars and migrate to newer version of Font Awesome (#8484)" This reverts commit4b794e134d
.
parent
4b78546135
commit
3d7f68c273
|
@ -55,7 +55,7 @@ module ApplicationHelper
|
||||||
|
|
||||||
def fa_icon(icon, attributes = {})
|
def fa_icon(icon, attributes = {})
|
||||||
class_names = attributes[:class]&.split(' ') || []
|
class_names = attributes[:class]&.split(' ') || []
|
||||||
class_names << 'fas'
|
class_names << 'fa'
|
||||||
class_names += icon.split(' ').map { |cl| "fa-#{cl}" }
|
class_names += icon.split(' ').map { |cl| "fa-#{cl}" }
|
||||||
|
|
||||||
content_tag(:i, nil, attributes.merge(class: class_names.join(' ')))
|
content_tag(:i, nil, attributes.merge(class: class_names.join(' ')))
|
||||||
|
|
|
@ -1,8 +1,7 @@
|
||||||
import Rails from 'rails-ujs';
|
import Rails from 'rails-ujs';
|
||||||
|
|
||||||
export function start() {
|
export function start() {
|
||||||
require('@fortawesome/fontawesome-free/css/fontawesome.css');
|
require('font-awesome/css/font-awesome.css');
|
||||||
require('@fortawesome/fontawesome-free/css/solid.css');
|
|
||||||
require.context('../images/', true);
|
require.context('../images/', true);
|
||||||
|
|
||||||
Rails.start();
|
Rails.start();
|
||||||
|
|
|
@ -13,11 +13,7 @@ exports[`<Avatar /> Autoplay renders a animated avatar 1`] = `
|
||||||
"width": "100px",
|
"width": "100px",
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
>
|
|
||||||
<i
|
|
||||||
className="fas fa-fw fa-robot bot-icon"
|
|
||||||
/>
|
/>
|
||||||
</div>
|
|
||||||
`;
|
`;
|
||||||
|
|
||||||
exports[`<Avatar /> Still renders a still avatar 1`] = `
|
exports[`<Avatar /> Still renders a still avatar 1`] = `
|
||||||
|
@ -33,9 +29,5 @@ exports[`<Avatar /> Still renders a still avatar 1`] = `
|
||||||
"width": "100px",
|
"width": "100px",
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
>
|
|
||||||
<i
|
|
||||||
className="fas fa-fw fa-robot bot-icon"
|
|
||||||
/>
|
/>
|
||||||
</div>
|
|
||||||
`;
|
`;
|
||||||
|
|
|
@ -10,7 +10,6 @@ describe('<Avatar />', () => {
|
||||||
display_name: 'Alice',
|
display_name: 'Alice',
|
||||||
avatar: '/animated/alice.gif',
|
avatar: '/animated/alice.gif',
|
||||||
avatar_static: '/static/alice.jpg',
|
avatar_static: '/static/alice.jpg',
|
||||||
bot: true,
|
|
||||||
});
|
});
|
||||||
|
|
||||||
const size = 100;
|
const size = 100;
|
||||||
|
|
|
@ -24,7 +24,7 @@ export default class AttachmentList extends ImmutablePureComponent {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<li key={attachment.get('id')}>
|
<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>
|
</li>
|
||||||
);
|
);
|
||||||
})}
|
})}
|
||||||
|
@ -36,7 +36,7 @@ export default class AttachmentList extends ImmutablePureComponent {
|
||||||
return (
|
return (
|
||||||
<div className='attachment-list'>
|
<div className='attachment-list'>
|
||||||
<div className='attachment-list__icon'>
|
<div className='attachment-list__icon'>
|
||||||
<i className='fas fa-link' />
|
<i className='fa fa-link' />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<ul className='attachment-list__list'>
|
<ul className='attachment-list__list'>
|
||||||
|
|
|
@ -1,7 +1,6 @@
|
||||||
import React from 'react';
|
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 BotIcon from './bot_icon';
|
|
||||||
import { autoPlayGif } from '../initial_state';
|
import { autoPlayGif } from '../initial_state';
|
||||||
|
|
||||||
export default class Avatar extends React.PureComponent {
|
export default class Avatar extends React.PureComponent {
|
||||||
|
@ -66,9 +65,7 @@ export default class Avatar extends React.PureComponent {
|
||||||
onMouseEnter={this.handleMouseEnter}
|
onMouseEnter={this.handleMouseEnter}
|
||||||
onMouseLeave={this.handleMouseLeave}
|
onMouseLeave={this.handleMouseLeave}
|
||||||
style={style}
|
style={style}
|
||||||
>
|
/>
|
||||||
<BotIcon account={account} />
|
|
||||||
</div>
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -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 '';
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
|
@ -19,7 +19,7 @@ export default class ColumnBackButton extends React.PureComponent {
|
||||||
render () {
|
render () {
|
||||||
return (
|
return (
|
||||||
<button onClick={this.handleClick} className='column-back-button'>
|
<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' />
|
<FormattedMessage id='column_back_button.label' defaultMessage='Back' />
|
||||||
</button>
|
</button>
|
||||||
);
|
);
|
||||||
|
|
|
@ -8,7 +8,7 @@ export default class ColumnBackButtonSlim extends ColumnBackButton {
|
||||||
return (
|
return (
|
||||||
<div className='column-back-button--slim'>
|
<div className='column-back-button--slim'>
|
||||||
<div role='button' tabIndex='0' onClick={this.handleClick} className='column-back-button column-back-button--slim-button'>
|
<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' />
|
<FormattedMessage id='column_back_button.label' defaultMessage='Back' />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -95,22 +95,22 @@ class ColumnHeader extends React.PureComponent {
|
||||||
}
|
}
|
||||||
|
|
||||||
if (multiColumn && pinned) {
|
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 = (
|
moveButtons = (
|
||||||
<div key='move-buttons' className='column-header__setting-arrows'>
|
<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.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='fas fa-chevron-right' /></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>
|
</div>
|
||||||
);
|
);
|
||||||
} else if (multiColumn) {
|
} 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)) {
|
if (!pinned && (multiColumn || showBackButton)) {
|
||||||
backButton = (
|
backButton = (
|
||||||
<button onClick={this.handleBackClick} className='column-header__back-button'>
|
<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' />
|
<FormattedMessage id='column_back_button.label' defaultMessage='Back' />
|
||||||
</button>
|
</button>
|
||||||
);
|
);
|
||||||
|
@ -126,7 +126,7 @@ class ColumnHeader extends React.PureComponent {
|
||||||
}
|
}
|
||||||
|
|
||||||
if (children || multiColumn) {
|
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;
|
const hasTitle = icon && title;
|
||||||
|
@ -136,7 +136,7 @@ class ColumnHeader extends React.PureComponent {
|
||||||
<h1 className={buttonClassName}>
|
<h1 className={buttonClassName}>
|
||||||
{hasTitle && (
|
{hasTitle && (
|
||||||
<button onClick={this.handleTitleClick}>
|
<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}
|
{title}
|
||||||
</button>
|
</button>
|
||||||
)}
|
)}
|
||||||
|
|
|
@ -86,7 +86,7 @@ export default class IconButton extends React.PureComponent {
|
||||||
style={style}
|
style={style}
|
||||||
tabIndex={tabIndex}
|
tabIndex={tabIndex}
|
||||||
>
|
>
|
||||||
<i className={`fas fa-fw fa-${icon}`} aria-hidden='true' />
|
<i className={`fa fa-fw fa-${icon}`} aria-hidden='true' />
|
||||||
</button>
|
</button>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -104,7 +104,7 @@ export default class IconButton extends React.PureComponent {
|
||||||
style={style}
|
style={style}
|
||||||
tabIndex={tabIndex}
|
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>
|
</button>
|
||||||
)}
|
)}
|
||||||
</Motion>
|
</Motion>
|
||||||
|
|
|
@ -25,7 +25,7 @@ class LoadGap extends React.PureComponent {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<button className='load-more load-gap' disabled={disabled} onClick={this.handleClick} aria-label={intl.formatMessage(messages.load_more)}>
|
<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>
|
</button>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
@ -193,7 +193,7 @@ class Status extends ImmutablePureComponent {
|
||||||
if (featured) {
|
if (featured) {
|
||||||
prepend = (
|
prepend = (
|
||||||
<div className='status__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' />
|
<FormattedMessage id='status.pinned' defaultMessage='Pinned toot' />
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
@ -202,7 +202,7 @@ class Status extends ImmutablePureComponent {
|
||||||
|
|
||||||
prepend = (
|
prepend = (
|
||||||
<div className='status__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> }} />
|
<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>
|
</div>
|
||||||
);
|
);
|
||||||
|
|
|
@ -3,7 +3,6 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
|
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
|
||||||
import IconButton from '../../../components/icon_button';
|
import IconButton from '../../../components/icon_button';
|
||||||
import BotIcon from '../../../components/bot_icon';
|
|
||||||
import Motion from '../../ui/util/optional_motion';
|
import Motion from '../../ui/util/optional_motion';
|
||||||
import spring from 'react-motion/lib/spring';
|
import spring from 'react-motion/lib/spring';
|
||||||
import ImmutablePureComponent from 'react-immutable-pure-component';
|
import ImmutablePureComponent from 'react-immutable-pure-component';
|
||||||
|
@ -68,7 +67,6 @@ class Avatar extends ImmutablePureComponent {
|
||||||
onBlur={this.handleMouseOut}
|
onBlur={this.handleMouseOut}
|
||||||
>
|
>
|
||||||
<span style={{ display: 'none' }}>{account.get('acct')}</span>
|
<span style={{ display: 'none' }}>{account.get('acct')}</span>
|
||||||
<BotIcon account={account} />
|
|
||||||
</a>
|
</a>
|
||||||
)}
|
)}
|
||||||
</Motion>
|
</Motion>
|
||||||
|
@ -140,7 +138,7 @@ class Header extends ImmutablePureComponent {
|
||||||
} else {
|
} else {
|
||||||
actionBtn = (
|
actionBtn = (
|
||||||
<div className='account--action-button'>
|
<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>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -150,7 +148,7 @@ class Header extends ImmutablePureComponent {
|
||||||
}
|
}
|
||||||
|
|
||||||
if (account.get('locked')) {
|
if (account.get('locked')) {
|
||||||
lockedIcon = <i className='fas fa-lock' />;
|
lockedIcon = <i className='fa fa-lock' />;
|
||||||
}
|
}
|
||||||
|
|
||||||
const content = { __html: account.get('note_emojified') };
|
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')} />
|
<dt dangerouslySetInnerHTML={{ __html: pair.get('name_emojified') }} title={pair.get('name')} />
|
||||||
|
|
||||||
<dd className={pair.get('verified_at') && 'verified'} title={pair.get('value_plain')}>
|
<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>
|
</dd>
|
||||||
</dl>
|
</dl>
|
||||||
))}
|
))}
|
||||||
|
|
|
@ -33,7 +33,7 @@ export default class MovedNote extends ImmutablePureComponent {
|
||||||
return (
|
return (
|
||||||
<div className='account__moved-note'>
|
<div className='account__moved-note'>
|
||||||
<div className='account__moved-note__message'>
|
<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> }} />
|
<FormattedMessage id='account.moved_to' defaultMessage='{name} has moved to:' values={{ name: <bdi><strong dangerouslySetInnerHTML={displayNameHtml} /></bdi> }} />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
|
@ -160,7 +160,7 @@ class ComposeForm extends ImmutablePureComponent {
|
||||||
let publishText = '';
|
let publishText = '';
|
||||||
|
|
||||||
if (this.props.privacy === 'private' || this.props.privacy === 'direct') {
|
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 {
|
} else {
|
||||||
publishText = this.props.privacy !== 'unlisted' ? intl.formatMessage(messages.publishLoud, { publish: intl.formatMessage(messages.publish) }) : intl.formatMessage(messages.publish);
|
publishText = this.props.privacy !== 'unlisted' ? intl.formatMessage(messages.publishLoud, { publish: intl.formatMessage(messages.publish) }) : intl.formatMessage(messages.publish);
|
||||||
}
|
}
|
||||||
|
|
|
@ -132,7 +132,7 @@ class PrivacyDropdownMenu extends React.PureComponent {
|
||||||
{items.map(item => (
|
{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 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'>
|
<div className='privacy-dropdown__option__icon'>
|
||||||
<i className={`fas fa-fw fa-${item.icon}`} />
|
<i className={`fa fa-fw fa-${item.icon}`} />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className='privacy-dropdown__option__content'>
|
<div className='privacy-dropdown__option__content'>
|
||||||
|
|
|
@ -116,8 +116,8 @@ class Search extends React.PureComponent {
|
||||||
</label>
|
</label>
|
||||||
|
|
||||||
<div role='button' tabIndex='0' className='search__icon' onClick={this.handleClear}>
|
<div role='button' tabIndex='0' className='search__icon' onClick={this.handleClear}>
|
||||||
<i className={`fas fa-search ${hasValue ? '' : 'active'}`} />
|
<i className={`fa fa-search ${hasValue ? '' : 'active'}`} />
|
||||||
<i aria-label={intl.formatMessage(messages.placeholder)} className={`fas fa-times-circle ${hasValue ? 'active' : ''}`} />
|
<i aria-label={intl.formatMessage(messages.placeholder)} className={`fa fa-times-circle ${hasValue ? 'active' : ''}`} />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<Overlay show={expanded && !hasValue} placement='bottom' target={this}>
|
<Overlay show={expanded && !hasValue} placement='bottom' target={this}>
|
||||||
|
|
|
@ -22,7 +22,7 @@ export default class SearchResults extends ImmutablePureComponent {
|
||||||
count += results.get('accounts').size;
|
count += results.get('accounts').size;
|
||||||
accounts = (
|
accounts = (
|
||||||
<div className='search-results__section'>
|
<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} />)}
|
{results.get('accounts').map(accountId => <AccountContainer key={accountId} id={accountId} />)}
|
||||||
</div>
|
</div>
|
||||||
|
@ -33,7 +33,7 @@ export default class SearchResults extends ImmutablePureComponent {
|
||||||
count += results.get('statuses').size;
|
count += results.get('statuses').size;
|
||||||
statuses = (
|
statuses = (
|
||||||
<div className='search-results__section'>
|
<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} />)}
|
{results.get('statuses').map(statusId => <StatusContainer key={statusId} id={statusId} />)}
|
||||||
</div>
|
</div>
|
||||||
|
@ -44,7 +44,7 @@ export default class SearchResults extends ImmutablePureComponent {
|
||||||
count += results.get('hashtags').size;
|
count += results.get('hashtags').size;
|
||||||
hashtags = (
|
hashtags = (
|
||||||
<div className='search-results__section'>
|
<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} />)}
|
{results.get('hashtags').map(hashtag => <Hashtag key={hashtag.get('name')} hashtag={hashtag} />)}
|
||||||
</div>
|
</div>
|
||||||
|
@ -54,7 +54,7 @@ export default class SearchResults extends ImmutablePureComponent {
|
||||||
return (
|
return (
|
||||||
<div className='search-results'>
|
<div className='search-results'>
|
||||||
<div className='search-results__header'>
|
<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 }} />
|
<FormattedMessage id='search_results.total' defaultMessage='{count, number} {count, plural, one {result} other {results}}' values={{ count }} />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
|
@ -89,8 +89,8 @@ class Upload extends ImmutablePureComponent {
|
||||||
{({ scale }) => (
|
{({ scale }) => (
|
||||||
<div className='compose-form__upload-thumbnail' style={{ transform: `scale(${scale})`, backgroundImage: `url(${media.get('preview_url')})`, backgroundPosition: `${x}% ${y}%` }}>
|
<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 })}>
|
<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>
|
<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='fas fa-crosshairs' /> <FormattedMessage id='upload_form.focus' defaultMessage='Crop' /></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>
|
||||||
|
|
||||||
<div className={classNames('compose-form__upload-description', { active })}>
|
<div className={classNames('compose-form__upload-description', { active })}>
|
||||||
|
|
|
@ -21,7 +21,7 @@ export default class UploadProgress extends React.PureComponent {
|
||||||
return (
|
return (
|
||||||
<div className='upload-progress'>
|
<div className='upload-progress'>
|
||||||
<div className='upload-progress__icon'>
|
<div className='upload-progress__icon'>
|
||||||
<i className='fas fa-upload' />
|
<i className='fa fa-upload' />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className='upload-progress__message'>
|
<div className='upload-progress__message'>
|
||||||
|
|
|
@ -76,21 +76,21 @@ class Compose extends React.PureComponent {
|
||||||
const { columns } = this.props;
|
const { columns } = this.props;
|
||||||
header = (
|
header = (
|
||||||
<nav className='drawer__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') && (
|
{!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') && (
|
{!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') && (
|
{!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') && (
|
{!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='/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='fas fa-fw fa-sign-out-alt' /></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>
|
</nav>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
@ -109,7 +109,7 @@ class GettingStarted extends ImmutablePureComponent {
|
||||||
if (!multiColumn) {
|
if (!multiColumn) {
|
||||||
navItems.push(
|
navItems.push(
|
||||||
<ColumnSubheading key={i++} text={intl.formatMessage(messages.settings_subheading)} />,
|
<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;
|
height += 34 + 48;
|
||||||
|
@ -120,7 +120,7 @@ class GettingStarted extends ImmutablePureComponent {
|
||||||
{multiColumn && <div className='column-header__wrapper'>
|
{multiColumn && <div className='column-header__wrapper'>
|
||||||
<h1 className='column-header'>
|
<h1 className='column-header'>
|
||||||
<button>
|
<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' />
|
<FormattedMessage id='getting_started.heading' defaultMessage='Getting started' />
|
||||||
</button>
|
</button>
|
||||||
</h1>
|
</h1>
|
||||||
|
|
|
@ -65,8 +65,8 @@ class Search extends React.PureComponent {
|
||||||
</label>
|
</label>
|
||||||
|
|
||||||
<div role='button' tabIndex='0' className='search__icon' onClick={this.handleClear}>
|
<div role='button' tabIndex='0' className='search__icon' onClick={this.handleClear}>
|
||||||
<i className={classNames('fas fa-search', { active: !hasValue })} />
|
<i className={classNames('fa fa-search', { active: !hasValue })} />
|
||||||
<i aria-label={intl.formatMessage(messages.search)} className={classNames('fas fa-times-circle', { active: hasValue })} />
|
<i aria-label={intl.formatMessage(messages.search)} className={classNames('fa fa-times-circle', { active: hasValue })} />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|
|
@ -150,11 +150,11 @@ class ListTimeline extends React.PureComponent {
|
||||||
>
|
>
|
||||||
<div className='column-header__links'>
|
<div className='column-header__links'>
|
||||||
<button className='text-btn column-header__setting-btn' tabIndex='0' onClick={this.handleEditClick}>
|
<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>
|
||||||
|
|
||||||
<button className='text-btn column-header__setting-btn' tabIndex='0' onClick={this.handleDeleteClick}>
|
<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>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
|
@ -10,7 +10,7 @@ export default class ClearColumnButton extends React.PureComponent {
|
||||||
|
|
||||||
render () {
|
render () {
|
||||||
return (
|
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>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -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 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__message'>
|
||||||
<div className='notification__favourite-icon-wrapper'>
|
<div className='notification__favourite-icon-wrapper'>
|
||||||
<i className='fas fa-fw fa-user-plus' />
|
<i className='fa fa-fw fa-user-plus' />
|
||||||
</div>
|
</div>
|
||||||
<span title={notification.get('created_at')}>
|
<span title={notification.get('created_at')}>
|
||||||
<FormattedMessage id='notification.follow' defaultMessage='{name} followed you' values={{ name: link }} />
|
<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 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__message'>
|
||||||
<div className='notification__favourite-icon-wrapper'>
|
<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>
|
</div>
|
||||||
<FormattedMessage id='notification.favourite' defaultMessage='{name} favourited your status' values={{ name: link }} />
|
<FormattedMessage id='notification.favourite' defaultMessage='{name} favourited your status' values={{ name: link }} />
|
||||||
</div>
|
</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 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__message'>
|
||||||
<div className='notification__favourite-icon-wrapper'>
|
<div className='notification__favourite-icon-wrapper'>
|
||||||
<i className='fas fa-fw fa-retweet' />
|
<i className='fa fa-fw fa-retweet' />
|
||||||
</div>
|
</div>
|
||||||
<FormattedMessage id='notification.reblog' defaultMessage='{name} boosted your status' values={{ name: link }} />
|
<FormattedMessage id='notification.reblog' defaultMessage='{name} boosted your status' values={{ name: link }} />
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -46,7 +46,7 @@ class PinnedStatuses extends ImmutablePureComponent {
|
||||||
const { intl, shouldUpdateScroll, statusIds, hasMore } = this.props;
|
const { intl, shouldUpdateScroll, statusIds, hasMore } = this.props;
|
||||||
|
|
||||||
return (
|
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 />
|
<ColumnBackButtonSlim />
|
||||||
<StatusList
|
<StatusList
|
||||||
statusIds={statusIds}
|
statusIds={statusIds}
|
||||||
|
|
|
@ -173,8 +173,8 @@ export default class Card extends React.PureComponent {
|
||||||
|
|
||||||
<div className='status-card__actions'>
|
<div className='status-card__actions'>
|
||||||
<div>
|
<div>
|
||||||
<button onClick={this.handleEmbedClick}><i className={`fas fa-${iconVariant}`} /></button>
|
<button onClick={this.handleEmbedClick}><i className={`fa fa-${iconVariant}`} /></button>
|
||||||
<a href={card.get('url')} target='_blank' rel='noopener'><i className='fas fa-external-link-alt' /></a>
|
<a href={card.get('url')} target='_blank' rel='noopener'><i className='fa fa-external-link' /></a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -94,10 +94,10 @@ export default class DetailedStatus extends ImmutablePureComponent {
|
||||||
}
|
}
|
||||||
|
|
||||||
if (status.get('visibility') === 'private') {
|
if (status.get('visibility') === 'private') {
|
||||||
reblogLink = <i className={`fas fa-${reblogIcon}`} />;
|
reblogLink = <i className={`fa fa-${reblogIcon}`} />;
|
||||||
} else {
|
} else {
|
||||||
reblogLink = (<Link to={`/statuses/${status.get('id')}/reblogs`} className='detailed-status__link'>
|
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'>
|
<span className='detailed-status__reblogs'>
|
||||||
<FormattedNumber value={status.get('reblogs_count')} />
|
<FormattedNumber value={status.get('reblogs_count')} />
|
||||||
</span>
|
</span>
|
||||||
|
@ -119,7 +119,7 @@ export default class DetailedStatus extends ImmutablePureComponent {
|
||||||
<a className='detailed-status__datetime' href={status.get('url')} target='_blank' rel='noopener'>
|
<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' />
|
<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'>
|
</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'>
|
<span className='detailed-status__favorites'>
|
||||||
<FormattedNumber value={status.get('favourites_count')} />
|
<FormattedNumber value={status.get('favourites_count')} />
|
||||||
</span>
|
</span>
|
||||||
|
|
|
@ -410,7 +410,7 @@ class Status extends ImmutablePureComponent {
|
||||||
<ColumnHeader
|
<ColumnHeader
|
||||||
showBackButton
|
showBackButton
|
||||||
extraButton={(
|
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>
|
||||||
)}
|
)}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
|
|
|
@ -74,7 +74,7 @@ class BoostModal extends ImmutablePureComponent {
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className='boost-modal__action-bar'>
|
<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} />
|
<Button text={intl.formatMessage(messages.reblog)} onClick={this.handleReblog} ref={this.setRef} />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -21,7 +21,7 @@ export default class ColumnHeader extends React.PureComponent {
|
||||||
let iconElement = '';
|
let iconElement = '';
|
||||||
|
|
||||||
if (icon) {
|
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 (
|
return (
|
||||||
|
|
|
@ -8,7 +8,7 @@ const ColumnLink = ({ icon, text, to, href, method, badge }) => {
|
||||||
if (href) {
|
if (href) {
|
||||||
return (
|
return (
|
||||||
<a href={href} className='column-link' data-method={method}>
|
<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}
|
{text}
|
||||||
{badgeElement}
|
{badgeElement}
|
||||||
</a>
|
</a>
|
||||||
|
@ -16,7 +16,7 @@ const ColumnLink = ({ icon, text, to, href, method, badge }) => {
|
||||||
} else {
|
} else {
|
||||||
return (
|
return (
|
||||||
<Link to={to} className='column-link'>
|
<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}
|
{text}
|
||||||
{badgeElement}
|
{badgeElement}
|
||||||
</Link>
|
</Link>
|
||||||
|
|
|
@ -160,7 +160,7 @@ class ColumnsArea extends ImmutablePureComponent {
|
||||||
this.pendingIndex = null;
|
this.pendingIndex = null;
|
||||||
|
|
||||||
if (singleColumn) {
|
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 ? [
|
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%' }}>
|
<ReactSwipeableViews key='content' index={columnIndex} onChangeIndex={this.handleSwipe} onTransitionEnd={this.handleAnimationEnd} animateTransitions={shouldAnimate} springConfig={{ duration: '400ms', delay: '0s', easeFunction: 'ease' }} style={{ height: '100%' }}>
|
||||||
|
|
|
@ -108,8 +108,8 @@ class MediaModal extends ImmutablePureComponent {
|
||||||
const index = this.getIndex();
|
const index = this.getIndex();
|
||||||
let pagination = [];
|
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 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='fas fa-fw fa-chevron-right' /></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) {
|
if (media.size > 1) {
|
||||||
pagination = media.map((item, i) => {
|
pagination = media.map((item, i) => {
|
||||||
|
|
|
@ -262,11 +262,11 @@ class OnboardingModal extends React.PureComponent {
|
||||||
|
|
||||||
const nextOrDoneBtn = hasMore ? (
|
const nextOrDoneBtn = hasMore ? (
|
||||||
<button onClick={this.handleNext} className='onboarding-modal__nav onboarding-modal__next shake-bottom'>
|
<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>
|
||||||
) : (
|
) : (
|
||||||
<button onClick={this.handleClose} className='onboarding-modal__nav onboarding-modal__done shake-bottom'>
|
<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>
|
</button>
|
||||||
);
|
);
|
||||||
|
|
||||||
|
|
|
@ -6,14 +6,14 @@ import { debounce } from 'lodash';
|
||||||
import { isUserTouching } from '../../../is_mobile';
|
import { isUserTouching } from '../../../is_mobile';
|
||||||
|
|
||||||
export const links = [
|
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='/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='fas fa-fw fa-bell' /><FormattedMessage id='tabs_bar.notifications' defaultMessage='Notifications' /></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' 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='fas fa-fw fa-globe' /><FormattedMessage id='tabs_bar.federated_timeline' defaultMessage='Federated' /></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='fas fa-fw fa-search' /><FormattedMessage id='tabs_bar.search' defaultMessage='Search' /></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) {
|
export function getIndex (path) {
|
||||||
|
|
|
@ -353,10 +353,10 @@ class Video extends React.PureComponent {
|
||||||
|
|
||||||
<div className='video-player__buttons-bar'>
|
<div className='video-player__buttons-bar'>
|
||||||
<div className='video-player__buttons left'>
|
<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(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('fas fa-fw', { 'fa-volume-off': muted, 'fa-volume-up': !muted })} /></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) &&
|
{(detailed || fullscreen) &&
|
||||||
<span>
|
<span>
|
||||||
|
@ -368,9 +368,9 @@ class Video extends React.PureComponent {
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className='video-player__buttons right'>
|
<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>}
|
{(!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='fas fa-fw fa-compress' /></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('fas fa-fw', { 'fa-expand-arrows-alt': !fullscreen, 'fa-compress': fullscreen })} /></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>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1113,7 +1113,7 @@ $small-breakpoint: 960px;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
margin-left: 15px;
|
margin-left: 15px;
|
||||||
|
|
||||||
.fas {
|
.fa {
|
||||||
display: block;
|
display: block;
|
||||||
color: $darker-text-color;
|
color: $darker-text-color;
|
||||||
font-size: 48px;
|
font-size: 48px;
|
||||||
|
|
|
@ -136,7 +136,7 @@
|
||||||
float: left;
|
float: left;
|
||||||
padding-left: 0;
|
padding-left: 0;
|
||||||
|
|
||||||
.fas {
|
.fa {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
margin-right: 5px;
|
margin-right: 5px;
|
||||||
}
|
}
|
||||||
|
@ -146,7 +146,7 @@
|
||||||
float: right;
|
float: right;
|
||||||
padding-right: 0;
|
padding-right: 0;
|
||||||
|
|
||||||
.fas {
|
.fa {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
margin-left: 5px;
|
margin-left: 5px;
|
||||||
}
|
}
|
||||||
|
|
|
@ -50,7 +50,7 @@ $no-columns-breakpoint: 600px;
|
||||||
transition: all 200ms linear;
|
transition: all 200ms linear;
|
||||||
border-radius: 4px 0 0 4px;
|
border-radius: 4px 0 0 4px;
|
||||||
|
|
||||||
i.fas {
|
i.fa {
|
||||||
margin-right: 5px;
|
margin-right: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -675,7 +675,7 @@
|
||||||
&:hover {
|
&:hover {
|
||||||
text-decoration: underline;
|
text-decoration: underline;
|
||||||
|
|
||||||
.fas {
|
.fa {
|
||||||
color: lighten($dark-text-color, 7%);
|
color: lighten($dark-text-color, 7%);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -690,7 +690,7 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.fas {
|
.fa {
|
||||||
color: $dark-text-color;
|
color: $dark-text-color;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -1132,12 +1132,6 @@
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
margin-right: 5px;
|
margin-right: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.bot-icon {
|
|
||||||
position: absolute;
|
|
||||||
bottom: -.333em;
|
|
||||||
left: -.333em;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
a .account__avatar {
|
a .account__avatar {
|
||||||
|
@ -1355,22 +1349,10 @@ a .account__avatar {
|
||||||
.account__header__avatar {
|
.account__header__avatar {
|
||||||
background-size: 90px 90px;
|
background-size: 90px 90px;
|
||||||
display: block;
|
display: block;
|
||||||
font-size: 1.5em;
|
|
||||||
height: 90px;
|
height: 90px;
|
||||||
margin: 0 auto 10px;
|
margin: 0 auto 10px;
|
||||||
position: relative;
|
overflow: hidden;
|
||||||
width: 90px;
|
width: 90px;
|
||||||
|
|
||||||
.bot-icon {
|
|
||||||
color: $dark-text-color;
|
|
||||||
position: absolute;
|
|
||||||
bottom: 0;
|
|
||||||
left: 0;
|
|
||||||
|
|
||||||
.light & {
|
|
||||||
color: $inverted-text-color;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.account-authorize {
|
.account-authorize {
|
||||||
|
@ -1496,7 +1478,7 @@ a.account__display-name {
|
||||||
font-size: 15px;
|
font-size: 15px;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
||||||
.fas {
|
.fa {
|
||||||
color: $highlight-text-color;
|
color: $highlight-text-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -2044,7 +2026,7 @@ a.account__display-name {
|
||||||
border-bottom: 2px solid lighten($ui-base-color, 8%);
|
border-bottom: 2px solid lighten($ui-base-color, 8%);
|
||||||
transition: all 50ms linear;
|
transition: all 50ms linear;
|
||||||
|
|
||||||
.fas {
|
.fa {
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
}
|
}
|
||||||
|
@ -3274,7 +3256,7 @@ a.status-card {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
||||||
.fas {
|
.fa {
|
||||||
font-size: 34px;
|
font-size: 34px;
|
||||||
margin-right: 10px;
|
margin-right: 10px;
|
||||||
}
|
}
|
||||||
|
@ -3491,7 +3473,7 @@ a.status-card {
|
||||||
outline: 0 !important;
|
outline: 0 !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.fas {
|
.fa {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 10px;
|
top: 10px;
|
||||||
right: 10px;
|
right: 10px;
|
||||||
|
@ -3545,7 +3527,7 @@ a.status-card {
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
cursor: default;
|
cursor: default;
|
||||||
|
|
||||||
.fas {
|
.fa {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
margin-right: 5px;
|
margin-right: 5px;
|
||||||
}
|
}
|
||||||
|
@ -3564,7 +3546,7 @@ a.status-card {
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
color: $dark-text-color;
|
color: $dark-text-color;
|
||||||
|
|
||||||
.fas {
|
.fa {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
margin-right: 5px;
|
margin-right: 5px;
|
||||||
}
|
}
|
||||||
|
@ -4462,7 +4444,7 @@ a.status-card {
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
font-size: 26px;
|
font-size: 26px;
|
||||||
|
|
||||||
.fas {
|
.fa {
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -4500,7 +4482,7 @@ a.status-card {
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
|
|
||||||
.fas {
|
.fa {
|
||||||
color: $dark-text-color;
|
color: $dark-text-color;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -5447,7 +5429,7 @@ noscript {
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
cursor: default;
|
cursor: default;
|
||||||
|
|
||||||
.fas {
|
.fa {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
margin-right: 5px;
|
margin-right: 5px;
|
||||||
}
|
}
|
||||||
|
|
|
@ -656,7 +656,7 @@ code {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.fas {
|
.fa {
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -38,7 +38,7 @@ body.rtl {
|
||||||
padding-left: 30px;
|
padding-left: 30px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.search__icon .fas {
|
.search__icon .fa {
|
||||||
right: auto;
|
right: auto;
|
||||||
left: 10px;
|
left: 10px;
|
||||||
}
|
}
|
||||||
|
@ -197,7 +197,7 @@ body.rtl {
|
||||||
}
|
}
|
||||||
|
|
||||||
.admin-wrapper .sidebar ul a i.fa,
|
.admin-wrapper .sidebar ul a i.fa,
|
||||||
a.table-action-link i.fas {
|
a.table-action-link i.fa {
|
||||||
margin-right: 0;
|
margin-right: 0;
|
||||||
margin-left: 5px;
|
margin-left: 5px;
|
||||||
}
|
}
|
||||||
|
@ -264,7 +264,7 @@ body.rtl {
|
||||||
left: 0;
|
left: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.landing-page .fa-external-link-alt {
|
.landing-page .fa-external-link {
|
||||||
padding-right: 5px;
|
padding-right: 5px;
|
||||||
padding-left: 0 !important;
|
padding-left: 0 !important;
|
||||||
}
|
}
|
||||||
|
|
|
@ -112,7 +112,7 @@ a.table-action-link {
|
||||||
color: $primary-text-color;
|
color: $primary-text-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
i.fas {
|
i.fa {
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
margin-right: 5px;
|
margin-right: 5px;
|
||||||
}
|
}
|
||||||
|
|
|
@ -196,7 +196,7 @@
|
||||||
&__message {
|
&__message {
|
||||||
margin-bottom: 15px;
|
margin-bottom: 15px;
|
||||||
|
|
||||||
.fas {
|
.fa {
|
||||||
margin-right: 5px;
|
margin-right: 5px;
|
||||||
color: $darker-text-color;
|
color: $darker-text-color;
|
||||||
}
|
}
|
||||||
|
|
|
@ -13,4 +13,4 @@
|
||||||
%li
|
%li
|
||||||
= link_to 'https://joinmastodon.org/' do
|
= link_to 'https://joinmastodon.org/' do
|
||||||
= "#{t('about.other_instances')}"
|
= "#{t('about.other_instances')}"
|
||||||
%i.fa.fa-external-link-alt{ style: 'padding-left: 5px;' }
|
%i.fa.fa-external-link{ style: 'padding-left: 5px;' }
|
||||||
|
|
|
@ -9,7 +9,7 @@
|
||||||
= t 'users.signed_in_as'
|
= t 'users.signed_in_as'
|
||||||
%span.username @#{current_account.local_username_and_domain}
|
%span.username @#{current_account.local_username_and_domain}
|
||||||
= link_to destroy_user_session_path(continue: true), method: :delete, class: 'logout-link icon-button' do
|
= 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
|
.container-alt= yield
|
||||||
.modal-layout__mastodon
|
.modal-layout__mastodon
|
||||||
|
|
|
@ -35,7 +35,7 @@
|
||||||
- elsif pinned
|
- elsif pinned
|
||||||
.status__prepend
|
.status__prepend
|
||||||
.status__prepend-icon-wrapper
|
.status__prepend-icon-wrapper
|
||||||
%i.status__prepend-icon.fa.fa-fw.fa-thumbtack
|
%i.status__prepend-icon.fa.fa-fw.fa-thumb-tack
|
||||||
%span
|
%span
|
||||||
= t('stream_entries.pinned')
|
= t('stream_entries.pinned')
|
||||||
|
|
||||||
|
|
|
@ -6,12 +6,12 @@ SimpleNavigation::Configuration.run do |navigation|
|
||||||
|
|
||||||
primary.item :settings, safe_join([fa_icon('cog fw'), t('settings.settings')]), settings_profile_url do |settings|
|
primary.item :settings, safe_join([fa_icon('cog fw'), t('settings.settings')]), settings_profile_url do |settings|
|
||||||
settings.item :profile, safe_join([fa_icon('user fw'), t('settings.edit_profile')]), settings_profile_url, highlights_on: %r{/settings/profile|/settings/migration}
|
settings.item :profile, safe_join([fa_icon('user fw'), t('settings.edit_profile')]), settings_profile_url, highlights_on: %r{/settings/profile|/settings/migration}
|
||||||
settings.item :preferences, safe_join([fa_icon('sliders-h fw'), t('settings.preferences')]), settings_preferences_url
|
settings.item :preferences, safe_join([fa_icon('sliders fw'), t('settings.preferences')]), settings_preferences_url
|
||||||
settings.item :notifications, safe_join([fa_icon('bell fw'), t('settings.notifications')]), settings_notifications_url
|
settings.item :notifications, safe_join([fa_icon('bell fw'), t('settings.notifications')]), settings_notifications_url
|
||||||
settings.item :password, safe_join([fa_icon('lock fw'), t('auth.security')]), edit_user_registration_url, highlights_on: %r{/auth/edit|/settings/delete}
|
settings.item :password, safe_join([fa_icon('lock fw'), t('auth.security')]), edit_user_registration_url, highlights_on: %r{/auth/edit|/settings/delete}
|
||||||
settings.item :two_factor_authentication, safe_join([fa_icon('mobile fw'), t('settings.two_factor_authentication')]), settings_two_factor_authentication_url, highlights_on: %r{/settings/two_factor_authentication}
|
settings.item :two_factor_authentication, safe_join([fa_icon('mobile fw'), t('settings.two_factor_authentication')]), settings_two_factor_authentication_url, highlights_on: %r{/settings/two_factor_authentication}
|
||||||
settings.item :import, safe_join([fa_icon('cloud-upload-alt fw'), t('settings.import')]), settings_import_url
|
settings.item :import, safe_join([fa_icon('cloud-upload fw'), t('settings.import')]), settings_import_url
|
||||||
settings.item :export, safe_join([fa_icon('cloud-download-alt fw'), t('settings.export')]), settings_export_url
|
settings.item :export, safe_join([fa_icon('cloud-download fw'), t('settings.export')]), settings_export_url
|
||||||
settings.item :authorized_apps, safe_join([fa_icon('list fw'), t('settings.authorized_apps')]), oauth_authorized_applications_url
|
settings.item :authorized_apps, safe_join([fa_icon('list fw'), t('settings.authorized_apps')]), oauth_authorized_applications_url
|
||||||
settings.item :follower_domains, safe_join([fa_icon('users fw'), t('settings.followers')]), settings_follower_domains_url
|
settings.item :follower_domains, safe_join([fa_icon('users fw'), t('settings.followers')]), settings_follower_domains_url
|
||||||
end
|
end
|
||||||
|
@ -34,15 +34,15 @@ SimpleNavigation::Configuration.run do |navigation|
|
||||||
end
|
end
|
||||||
|
|
||||||
primary.item :admin, safe_join([fa_icon('cogs fw'), t('admin.title')]), admin_dashboard_url, if: proc { current_user.staff? } do |admin|
|
primary.item :admin, safe_join([fa_icon('cogs fw'), t('admin.title')]), admin_dashboard_url, if: proc { current_user.staff? } do |admin|
|
||||||
admin.item :dashboard, safe_join([fa_icon('tachometer-alt fw'), t('admin.dashboard.title')]), admin_dashboard_url
|
admin.item :dashboard, safe_join([fa_icon('tachometer fw'), t('admin.dashboard.title')]), admin_dashboard_url
|
||||||
admin.item :settings, safe_join([fa_icon('cogs fw'), t('admin.settings.title')]), edit_admin_settings_url, if: -> { current_user.admin? }
|
admin.item :settings, safe_join([fa_icon('cogs fw'), t('admin.settings.title')]), edit_admin_settings_url, if: -> { current_user.admin? }
|
||||||
admin.item :custom_emojis, safe_join([fa_icon('smile fw'), t('admin.custom_emojis.title')]), admin_custom_emojis_url, highlights_on: %r{/admin/custom_emojis}
|
admin.item :custom_emojis, safe_join([fa_icon('smile-o fw'), t('admin.custom_emojis.title')]), admin_custom_emojis_url, highlights_on: %r{/admin/custom_emojis}
|
||||||
admin.item :relays, safe_join([fa_icon('exchange-alt fw'), t('admin.relays.title')]), admin_relays_url, if: -> { current_user.admin? }, highlights_on: %r{/admin/relays}
|
admin.item :relays, safe_join([fa_icon('exchange fw'), t('admin.relays.title')]), admin_relays_url, if: -> { current_user.admin? }, highlights_on: %r{/admin/relays}
|
||||||
admin.item :subscriptions, safe_join([fa_icon('paper-plane fw'), t('admin.subscriptions.title')]), admin_subscriptions_url, if: -> { current_user.admin? }
|
admin.item :subscriptions, safe_join([fa_icon('paper-plane-o fw'), t('admin.subscriptions.title')]), admin_subscriptions_url, if: -> { current_user.admin? }
|
||||||
admin.item :sidekiq, safe_join([fa_icon('gem fw'), 'Sidekiq']), sidekiq_url, link_html: { target: 'sidekiq' }, if: -> { current_user.admin? }
|
admin.item :sidekiq, safe_join([fa_icon('diamond fw'), 'Sidekiq']), sidekiq_url, link_html: { target: 'sidekiq' }, if: -> { current_user.admin? }
|
||||||
admin.item :pghero, safe_join([fa_icon('database fw'), 'PgHero']), pghero_url, link_html: { target: 'pghero' }, if: -> { current_user.admin? }
|
admin.item :pghero, safe_join([fa_icon('database fw'), 'PgHero']), pghero_url, link_html: { target: 'pghero' }, if: -> { current_user.admin? }
|
||||||
end
|
end
|
||||||
|
|
||||||
primary.item :logout, safe_join([fa_icon('sign-out-alt fw'), t('auth.logout')]), destroy_user_session_url, link_html: { 'data-method' => 'delete' }
|
primary.item :logout, safe_join([fa_icon('sign-out fw'), t('auth.logout')]), destroy_user_session_url, link_html: { 'data-method' => 'delete' }
|
||||||
end
|
end
|
||||||
end
|
end
|
||||||
|
|
|
@ -37,7 +37,6 @@
|
||||||
"@babel/preset-env": "^7.0.0",
|
"@babel/preset-env": "^7.0.0",
|
||||||
"@babel/preset-react": "^7.0.0",
|
"@babel/preset-react": "^7.0.0",
|
||||||
"@babel/runtime": "^7.0.0",
|
"@babel/runtime": "^7.0.0",
|
||||||
"@fortawesome/fontawesome-free": "^5.2.0",
|
|
||||||
"array-includes": "^3.0.3",
|
"array-includes": "^3.0.3",
|
||||||
"autoprefixer": "^8.6.5",
|
"autoprefixer": "^8.6.5",
|
||||||
"axios": "~0.16.2",
|
"axios": "~0.16.2",
|
||||||
|
@ -59,6 +58,7 @@
|
||||||
"exif-js": "^2.3.0",
|
"exif-js": "^2.3.0",
|
||||||
"express": "^4.16.2",
|
"express": "^4.16.2",
|
||||||
"file-loader": "^2.0.0",
|
"file-loader": "^2.0.0",
|
||||||
|
"font-awesome": "^4.7.0",
|
||||||
"glob": "^7.1.1",
|
"glob": "^7.1.1",
|
||||||
"history": "^4.7.2",
|
"history": "^4.7.2",
|
||||||
"http-link-header": "^0.8.0",
|
"http-link-header": "^0.8.0",
|
||||||
|
|
|
@ -55,7 +55,7 @@ describe ApplicationHelper do
|
||||||
|
|
||||||
describe 'fa_icon' do
|
describe 'fa_icon' do
|
||||||
it 'returns a tag of fixed-width cog' do
|
it 'returns a tag of fixed-width cog' do
|
||||||
expect(helper.fa_icon('cog fw')).to eq '<i class="fas fa-cog fa-fw"></i>'
|
expect(helper.fa_icon('cog fw')).to eq '<i class="fa fa-cog fa-fw"></i>'
|
||||||
end
|
end
|
||||||
end
|
end
|
||||||
|
|
||||||
|
|
|
@ -647,10 +647,6 @@
|
||||||
version "1.0.0"
|
version "1.0.0"
|
||||||
resolved "https://registry.yarnpkg.com/@csstools/sass-import-resolve/-/sass-import-resolve-1.0.0.tgz#32c3cdb2f7af3cd8f0dca357b592e7271f3831b5"
|
resolved "https://registry.yarnpkg.com/@csstools/sass-import-resolve/-/sass-import-resolve-1.0.0.tgz#32c3cdb2f7af3cd8f0dca357b592e7271f3831b5"
|
||||||
|
|
||||||
"@fortawesome/fontawesome-free@^5.2.0":
|
|
||||||
version "5.2.0"
|
|
||||||
resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-free/-/fontawesome-free-5.2.0.tgz#50cd9856774351c56c0b1b0db4efe122d7913e58"
|
|
||||||
|
|
||||||
"@types/node@*":
|
"@types/node@*":
|
||||||
version "10.9.4"
|
version "10.9.4"
|
||||||
resolved "https://registry.yarnpkg.com/@types/node/-/node-10.9.4.tgz#0f4cb2dc7c1de6096055357f70179043c33e9897"
|
resolved "https://registry.yarnpkg.com/@types/node/-/node-10.9.4.tgz#0f4cb2dc7c1de6096055357f70179043c33e9897"
|
||||||
|
@ -3283,6 +3279,10 @@ follow-redirects@^1.0.0, follow-redirects@^1.2.3:
|
||||||
dependencies:
|
dependencies:
|
||||||
debug "=3.1.0"
|
debug "=3.1.0"
|
||||||
|
|
||||||
|
font-awesome@^4.7.0:
|
||||||
|
version "4.7.0"
|
||||||
|
resolved "https://registry.yarnpkg.com/font-awesome/-/font-awesome-4.7.0.tgz#8fa8cf0411a1a31afd07b06d2902bb9fc815a133"
|
||||||
|
|
||||||
for-in@^0.1.3:
|
for-in@^0.1.3:
|
||||||
version "0.1.8"
|
version "0.1.8"
|
||||||
resolved "https://registry.yarnpkg.com/for-in/-/for-in-0.1.8.tgz#d8773908e31256109952b1fdb9b3fa867d2775e1"
|
resolved "https://registry.yarnpkg.com/for-in/-/for-in-0.1.8.tgz#d8773908e31256109952b1fdb9b3fa867d2775e1"
|
||||||
|
|
Loading…
Reference in New Issue