diff options
Diffstat (limited to 'app')
7 files changed, 61 insertions, 5 deletions
diff --git a/app/javascript/mastodon/common.js b/app/javascript/mastodon/common.js index 2b10b8c30..fdd3431ab 100644 --- a/app/javascript/mastodon/common.js +++ b/app/javascript/mastodon/common.js @@ -1,7 +1,8 @@ import Rails from 'rails-ujs'; export function start() { - require('font-awesome/css/font-awesome.css'); + require('@fortawesome/fontawesome-free/css/fontawesome.css'); + require('@fortawesome/fontawesome-free/css/solid.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 76ab3374a..f6f6bfbf4 100644 --- a/app/javascript/mastodon/components/__tests__/__snapshots__/avatar-test.js.snap +++ b/app/javascript/mastodon/components/__tests__/__snapshots__/avatar-test.js.snap @@ -13,7 +13,11 @@ exports[`<Avatar /> Autoplay renders a animated avatar 1`] = ` "width": "100px", } } -/> +> + <i + className="fa fa-fw fa-robot bot-icon" + /> +</div> `; exports[`<Avatar /> Still renders a still avatar 1`] = ` @@ -29,5 +33,9 @@ exports[`<Avatar /> Still renders a still avatar 1`] = ` "width": "100px", } } -/> +> + <i + className="fa 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 dd3f7b7d2..cc99d3a53 100644 --- a/app/javascript/mastodon/components/__tests__/avatar-test.js +++ b/app/javascript/mastodon/components/__tests__/avatar-test.js @@ -10,6 +10,7 @@ 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/avatar.js b/app/javascript/mastodon/components/avatar.js index 570505833..e46f1ed76 100644 --- a/app/javascript/mastodon/components/avatar.js +++ b/app/javascript/mastodon/components/avatar.js @@ -1,6 +1,7 @@ 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 { @@ -65,7 +66,9 @@ 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 new file mode 100644 index 000000000..f4bd70282 --- /dev/null +++ b/app/javascript/mastodon/components/bot_icon.js @@ -0,0 +1,23 @@ +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='fa fa-fw fa-robot bot-icon' /> + ); + } + + return ''; + } + +} diff --git a/app/javascript/mastodon/features/account/components/header.js b/app/javascript/mastodon/features/account/components/header.js index 11ae58905..e498ba5cc 100644 --- a/app/javascript/mastodon/features/account/components/header.js +++ b/app/javascript/mastodon/features/account/components/header.js @@ -3,6 +3,7 @@ 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'; @@ -67,6 +68,7 @@ class Avatar extends ImmutablePureComponent { onBlur={this.handleMouseOut} > <span style={{ display: 'none' }}>{account.get('acct')}</span> + <BotIcon account={account} /> </a> )} </Motion> diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss index 3fb924aa4..b3f3347df 100644 --- a/app/javascript/styles/mastodon/components.scss +++ b/app/javascript/styles/mastodon/components.scss @@ -1110,6 +1110,12 @@ vertical-align: middle; margin-right: 5px; } + + .bot-icon { + position: absolute; + bottom: -.333em; + left: -.333em; + } } a .account__avatar { @@ -1327,10 +1333,22 @@ a .account__avatar { .account__header__avatar { background-size: 90px 90px; display: block; + font-size: 1.5em; height: 90px; margin: 0 auto 10px; - overflow: hidden; + position: relative; width: 90px; + + .bot-icon { + color: $dark-text-color; + position: absolute; + bottom: 0; + left: 0; + + .light & { + color: $inverted-text-color; + } + } } .account-authorize { |