chore: move badges to top half of user profile

This commit is contained in:
Paul Makles 2023-06-11 13:02:38 +01:00
parent 5b600bec20
commit 75d07ffe0f
No known key found for this signature in database
GPG key ID: 5059F398521BB0F6
2 changed files with 19 additions and 19 deletions

View file

@ -22,12 +22,11 @@ enum Badges {
const BadgesBase = styled.div` const BadgesBase = styled.div`
gap: 8px; gap: 8px;
display: flex; display: flex;
margin-top: 4px;
flex-direction: row; flex-direction: row;
img { img {
width: 32px; width: 24px;
height: 32px; height: 24px;
} }
`; `;
@ -103,7 +102,7 @@ export default function UserBadges({ badges, uid }: Props) {
content={ content={
<Text id="app.special.popovers.user_profile.badges.responsible_disclosure" /> <Text id="app.special.popovers.user_profile.badges.responsible_disclosure" />
}> }>
<Shield size={32} color="gray" /> <Shield size={24} color="gray" />
</Tooltip> </Tooltip>
) : ( ) : (
<></> <></>

View file

@ -236,6 +236,21 @@ export const UserProfile = observer(
</IconButton> </IconButton>
)} )}
</div> </div>
{badges > 0 && (
<div
style={{
marginInline: "1em",
padding: "0.5em",
background: "var(--primary-background)",
borderRadius: "8px",
width: "fit-content",
backgroundColor:
"rgba(var(--primary-header-rgb), max(var(--min-opacity), 0.65))",
backdropFilter: "blur(20px)",
}}>
<UserBadges badges={badges} uid={user._id} />
</div>
)}
<div className={styles.tabs}> <div className={styles.tabs}>
<div <div
data-active={tab === "profile"} data-active={tab === "profile"}
@ -267,10 +282,7 @@ export const UserProfile = observer(
</div> </div>
<div className={styles.content}> <div className={styles.content}>
{tab === "profile" && {tab === "profile" &&
(profile?.content || (profile?.content || flags > 0 || user.bot ? (
badges > 0 ||
flags > 0 ||
user.bot ? (
<div> <div>
{flags & 1 ? ( {flags & 1 ? (
/** ! FIXME: i18n this area */ /** ! FIXME: i18n this area */
@ -320,17 +332,6 @@ export const UserProfile = observer(
</div> </div>
</> </>
) : undefined} ) : undefined}
{badges > 0 && (
<div className={styles.category}>
<Text id="app.special.popovers.user_profile.sub.badges" />
</div>
)}
{badges > 0 && (
<UserBadges
badges={badges}
uid={user._id}
/>
)}
{profile?.content && ( {profile?.content && (
<> <>
<div className={styles.category}> <div className={styles.category}>