className='status__avatar'
onClick={this.handleAccountClick}
>
- {
- friend ? (
- <AvatarOverlay account={account} friend={friend} />
- ) : (
- <Avatar account={account} size={48} />
- )
- }
+ {
+ friend ? (
+ <AvatarOverlay account={account} friend={friend} />
+ ) : (
+ <Avatar account={account} size={48} />
+ )
+ }
</a>
<a
href={account.get('url')}
classes.push(this.props.className);
}
+ const flipDeg = this.props.flip ? -180 : -360;
+ const rotateDeg = this.props.active ? flipDeg : 0;
+
+ const motionDefaultStyle = {
+ rotate: rotateDeg,
+ };
+
+ const springOpts = {
+ stiffness: this.props.flip ? 60 : 120,
+ damping: 7,
+ };
+ const motionStyle = {
+ rotate: this.props.animate ? spring(rotateDeg, springOpts) : 0,
+ };
+
return (
- <Motion defaultStyle={{ rotate: this.props.active ? (this.props.flip ? -180 : -360) : 0 }} style={{ rotate: this.props.animate ? spring(this.props.active ? (this.props.flip ? -180 : -360) : 0, { stiffness: this.props.flip ? 60 : 120, damping: 7 }) : 0 }}>
+ <Motion defaultStyle={motionDefaultStyle} style={motionStyle}>
{({ rotate }) =>
<button
aria-label={this.props.title}