Co-authored-by: tobi <tobi.smethurst@protonmail.com> Reviewed-on: https://codeberg.org/superseriousbusiness/masto-fe-standalone/pulls/88 Co-authored-by: Zoë Bijl <moiety@noreply.codeberg.org> Co-committed-by: Zoë Bijl <moiety@noreply.codeberg.org>
40 lines
1.1 KiB
JavaScript
40 lines
1.1 KiB
JavaScript
import PropTypes from "prop-types";
|
|
import { PureComponent } from "react";
|
|
|
|
import ImmutablePropTypes from "react-immutable-proptypes";
|
|
|
|
import { autoPlayGif } from "flavours/glitch/initial_state";
|
|
|
|
export default class AvatarOverlay extends PureComponent {
|
|
|
|
static propTypes = {
|
|
account: ImmutablePropTypes.map.isRequired,
|
|
friend: ImmutablePropTypes.map.isRequired,
|
|
animate: PropTypes.bool,
|
|
};
|
|
|
|
static defaultProps = {
|
|
animate: autoPlayGif,
|
|
};
|
|
|
|
render() {
|
|
const { account, friend, animate } = this.props;
|
|
|
|
const baseStyle = {
|
|
backgroundImage: `url(${account.get(animate ? "avatar" : "avatar_static")})`,
|
|
};
|
|
|
|
const overlayStyle = {
|
|
backgroundImage: `url(${friend.get(animate ? "avatar" : "avatar_static")})`,
|
|
};
|
|
|
|
return (
|
|
<div className='account__avatar-overlay'>
|
|
<div className='account__avatar-overlay-base' style={baseStyle} data-avatar-of={`@${account.get("acct")}`} />
|
|
<div className='account__avatar-overlay-overlay' style={overlayStyle} data-avatar-of={`@${friend.get("acct")}`} />
|
|
</div>
|
|
);
|
|
}
|
|
|
|
}
|