Show boosted user's avatar (#2518)

* Show boosted user's avatar

* add .status__avatar-boost

* margin

* apply to notifications too.

* account__avatar-boost

* Add inline prop to Avatar component

* Add AvatarOverlay component

* rename mixins.scss

* move files for latest master

* fixed for webpack

1 files changed, 13 insertions, 4 deletions

diff --git a/app/javascript/mastodon/components/avatar.js b/app/javascript/mastodon/components/avatar.js
index 47f2715c7..76c561c91 100644
--- a/app/javascript/mastodon/components/avatar.js
+++ b/app/javascript/mastodon/components/avatar.js
@@ -25,9 +25,15 @@ class Avatar extends React.PureComponent {
   }
 
   render () {
-    const { src, size, staticSrc, animate } = this.props;
+    const { src, size, staticSrc, animate, inline } = this.props;
     const { hovering } = this.state;
 
+    let className = 'account__avatar';
+
+    if (inline) {
+      className = className + ' account__avatar-inline';
+    }
+
     const style = {
       ...this.props.style,
       width: `${size}px`,
@@ -43,7 +49,7 @@ class Avatar extends React.PureComponent {
 
     return (
       <div
-        className='account__avatar'
+        className={className}
         onMouseEnter={this.handleMouseEnter}
         onMouseLeave={this.handleMouseLeave}
         style={style}
@@ -58,11 +64,14 @@ Avatar.propTypes = {
   staticSrc: PropTypes.string,
   size: PropTypes.number.isRequired,
   style: PropTypes.object,
-  animate: PropTypes.bool
+  animate: PropTypes.bool,
+  inline: PropTypes.bool
 };
 
 Avatar.defaultProps = {
-  animate: false
+  animate: false,
+  size: 20,
+  inline: false
 };
 
 export default Avatar;