nandi.uk
This repository has no description
feat: account summary styling
author
Pouria Delfanazari
date
(May 6, 2026, 2:19 PM -0700)
commit
00e68b69
00e68b6910a983aa05ec671b68bf5a97935a4fbd
parent
72c3795f
72c3795f82dce07595e101110c0d033dcff87f4c
+35
-21
+9
src/webapp/features/settings/components/accountSummary/AccountSummary.module.css
+9
src/webapp/features/settings/components/accountSummary/AccountSummary.module.css
+26
-21
src/webapp/features/settings/components/accountSummary/AccountSummary.tsx
+26
-21
src/webapp/features/settings/components/accountSummary/AccountSummary.tsx
···
1
-
import { Group, Stack, Text } from '@mantine/core';
1
+
import { Card, Group, Stack, Text } from '@mantine/core';
2
2
import { createServerSembleClient } from '@/services/server.apiClient';
3
3
import { verifySessionOnServer } from '@/lib/auth/dal.server';
4
4
import { LinkAvatar } from '@/components/link/MantineLink';
5
5
import { isBotAccount } from '@/features/platforms/bluesky/lib/utils/account';
6
6
import BotLabel from '@/features/profile/components/botLabel/BotLabel';
7
+
import classes from './AccountSummary.module.css';
7
8
8
9
export default async function AccountSummary() {
9
10
await verifySessionOnServer({ redirectOnFail: true });
···
12
13
const profile = await client.getMyProfile();
13
14
14
15
return (
15
-
<Stack gap={'xs'} align="center">
16
-
<LinkAvatar
17
-
href={`/profile/${profile.handle}`}
18
-
src={profile.avatarUrl?.replace('avatar', 'avatar_thumbnail')}
19
-
alt={`${profile.name}'s avatar`}
20
-
size={'xl'}
21
-
radius={'lg'}
22
-
/>
23
-
<Stack gap={0} align="center">
24
-
<Group gap={'xs'} wrap="nowrap">
25
-
<Text fw={600} fz={'h3'} c={'bright'}>
26
-
{profile.name}
27
-
</Text>
28
-
{isBotAccount(profile) && <BotLabel />}
29
-
</Group>
16
+
<Card p={'sm'} radius={'lg'} classNames={{ root: classes.root }}>
17
+
<Group gap={'xs'}>
18
+
<LinkAvatar
19
+
href={`/profile/${profile.handle}`}
20
+
src={profile.avatarUrl?.replace('avatar', 'avatar_thumbnail')}
21
+
alt={`${profile.name}'s avatar`}
22
+
size={'lg'}
23
+
radius={'md'}
24
+
/>
25
+
<Stack gap={'xs'}>
26
+
<Stack gap={0}>
27
+
<Group gap={'xs'} wrap="nowrap">
28
+
<Text fw={600} fz={'lg'} c={'bright'}>
29
+
{profile.name}
30
+
</Text>
31
+
{isBotAccount(profile) && <BotLabel />}
32
+
</Group>
30
33
31
-
<Text fw={500} fz={'h4'} c={'gray'}>
32
-
@{profile.handle}
33
-
</Text>
34
-
</Stack>
35
-
</Stack>
34
+
<Text fw={600} fz={'lg'} c={'gray'}>
35
+
@{profile.handle}
36
+
</Text>
37
+
</Stack>
38
+
</Stack>
39
+
</Group>
40
+
</Card>
36
41
);
37
42
}