diff options
author | ThibG <thib@sitedethib.com> | 2019-09-30 23:29:55 +0200 |
---|---|---|
committer | GitHub <noreply@github.com> | 2019-09-30 23:29:55 +0200 |
commit | 65db9df011a3e13efa79f4e56343aa69bdad7716 (patch) | |
tree | 1941b85de1f0d1b6f56b73345cddf664a71faf20 /app/javascript/flavours/glitch/components/avatar_composite.js | |
parent | febcdad2e2c98aee62b55ee21bdf0debf7c6fd6b (diff) | |
parent | 3b855b5c82362783969f748ad78bcaf85f938c9f (diff) |
Merge pull request #1224 from ThibG/glitch-soc/merge-upstream
Merge upstream changes
Diffstat (limited to 'app/javascript/flavours/glitch/components/avatar_composite.js')
-rw-r--r-- | app/javascript/flavours/glitch/components/avatar_composite.js | 28 |
1 files changed, 17 insertions, 11 deletions
diff --git a/app/javascript/flavours/glitch/components/avatar_composite.js b/app/javascript/flavours/glitch/components/avatar_composite.js index c52df043a..125b51c44 100644 --- a/app/javascript/flavours/glitch/components/avatar_composite.js +++ b/app/javascript/flavours/glitch/components/avatar_composite.js @@ -35,35 +35,35 @@ export default class AvatarComposite extends React.PureComponent { if (size === 2) { if (index === 0) { - right = '2px'; + right = '1px'; } else { - left = '2px'; + left = '1px'; } } else if (size === 3) { if (index === 0) { - right = '2px'; + right = '1px'; } else if (index > 0) { - left = '2px'; + left = '1px'; } if (index === 1) { - bottom = '2px'; + bottom = '1px'; } else if (index > 1) { - top = '2px'; + top = '1px'; } } else if (size === 4) { if (index === 0 || index === 2) { - right = '2px'; + right = '1px'; } if (index === 1 || index === 3) { - left = '2px'; + left = '1px'; } if (index < 2) { - bottom = '2px'; + bottom = '1px'; } else { - top = '2px'; + top = '1px'; } } @@ -96,7 +96,13 @@ export default class AvatarComposite extends React.PureComponent { return ( <div className='account__avatar-composite' style={{ width: `${size}px`, height: `${size}px` }}> - {accounts.take(4).map((account, i) => this.renderItem(account, accounts.size, i))} + {accounts.take(4).map((account, i) => this.renderItem(account, Math.min(accounts.size, 4), i))} + + {accounts.size > 4 && ( + <span className='account__avatar-composite__label'> + +{accounts.size - 4} + </span> + )} </div> ); } |