diff --git a/src/components/account-block.jsx b/src/components/account-block.jsx index b4c40a0a..a8598284 100644 --- a/src/components/account-block.jsx +++ b/src/components/account-block.jsx @@ -44,6 +44,7 @@ function AccountBlock({ url, statusesCount, lastStatusAt, + bot, } = account; const displayNameWithEmoji = emojifyText(displayName, emojis); const [_, acct1, acct2] = acct.match(/([^@]+)(@.+)/i) || [, acct]; @@ -68,7 +69,7 @@ function AccountBlock({ } }} > - + {displayName ? ( *:first-child { diff --git a/src/components/account-info.jsx b/src/components/account-info.jsx index 0acc64b4..626b44d8 100644 --- a/src/components/account-info.jsx +++ b/src/components/account-info.jsx @@ -507,6 +507,7 @@ function RelatedActions({ info, instance, authenticated }) { url={follower.avatarStatic} size="l" alt={`${follower.displayName} @${follower.acct}`} + squircle={follower?.bot} /> ))} diff --git a/src/components/avatar.css b/src/components/avatar.css index 444a0cdb..1a874941 100644 --- a/src/components/avatar.css +++ b/src/components/avatar.css @@ -12,6 +12,9 @@ .avatar.has-alpha { border-radius: 0; } +.avatar:not(.has-alpha).squircle { + border-radius: 12px; +} .avatar img { width: 100%; diff --git a/src/components/avatar.jsx b/src/components/avatar.jsx index 5cb3f845..a9fef01d 100644 --- a/src/components/avatar.jsx +++ b/src/components/avatar.jsx @@ -13,14 +13,16 @@ const SIZES = { const alphaCache = {}; -function Avatar({ url, size, alt = '', ...props }) { +function Avatar({ url, size, alt = '', squircle, ...props }) { size = SIZES[size] || size || SIZES.m; const avatarRef = useRef(); const isMissing = /missing\.png$/.test(url); return ( )} {!standalone ? ( diff --git a/src/components/menu.jsx b/src/components/menu.jsx index dc795625..22da8fa7 100644 --- a/src/components/menu.jsx +++ b/src/components/menu.jsx @@ -67,6 +67,7 @@ function NavMenu(props) { currentAccount?.info?.avatarStatic } size="l" + squircle={currentAccount?.info?.bot} /> )} diff --git a/src/components/name-text.jsx b/src/components/name-text.jsx index 3c563557..f2e79ece 100644 --- a/src/components/name-text.jsx +++ b/src/components/name-text.jsx @@ -14,7 +14,8 @@ function NameText({ external, onClick, }) { - const { acct, avatar, avatarStatic, id, url, displayName, emojis } = account; + const { acct, avatar, avatarStatic, id, url, displayName, emojis, bot } = + account; let { username } = account; const displayNameWithEmoji = emojifyText(displayName, emojis); @@ -52,7 +53,7 @@ function NameText({ > {showAvatar && ( <> - {' '} + {' '} )} {displayName && !short ? ( diff --git a/src/components/status.jsx b/src/components/status.jsx index 9adc28ce..53a199bb 100644 --- a/src/components/status.jsx +++ b/src/components/status.jsx @@ -118,6 +118,7 @@ function Status({ displayName, username, emojis: accountEmojis, + bot, }, id, repliesCount, @@ -753,7 +754,7 @@ function Status({ }; }} > - + )}
@@ -1957,7 +1958,7 @@ function safeBoundingBoxPadding() { function FilteredStatus({ status, filterInfo, instance, containerProps = {} }) { const { - account: { avatar, avatarStatic }, + account: { avatar, avatarStatic, bot }, createdAt, visibility, reblog, @@ -2002,7 +2003,7 @@ function FilteredStatus({ status, filterInfo, instance, containerProps = {} }) { Filtered {filterTitleStr} {' '} - + {' '} @@ -2022,6 +2023,7 @@ function FilteredStatus({ status, filterInfo, instance, containerProps = {} }) { <> {' '} )} diff --git a/src/pages/notifications.jsx b/src/pages/notifications.jsx index 7b4dda1c..060b8b4a 100644 --- a/src/pages/notifications.jsx +++ b/src/pages/notifications.jsx @@ -403,6 +403,7 @@ function Notification({ notification, instance }) { } key={account.id} alt={`${account.displayName} @${account.acct}`} + squircle={account?.bot} /> {type === 'favourite+reblog' && (