1
0
mirror of https://github.com/chinchang/web-maker.git synced 2025-10-18 06:56:07 +02:00

some pro improvements

This commit is contained in:
Kushagra Gour
2024-02-09 17:50:37 +05:30
parent 88abe26151
commit a873a541fb
5 changed files with 91 additions and 15 deletions

View File

@@ -1,4 +1,6 @@
import { h } from 'preact';
import { ProBadge } from './ProBadge';
import { HStack, Stack, VStack } from './Stack';
const DEFAULT_PROFILE_IMG =
"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23ccc' d='M12,19.2C9.5,19.2 7.29,17.92 6,16C6.03,14 10,12.9 12,12.9C14,12.9 17.97,14 18,16C16.71,17.92 14.5,19.2 12,19.2M12,5A3,3 0 0,1 15,8A3,3 0 0,1 12,11A3,3 0 0,1 9,8A3,3 0 0,1 12,5M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12C22,6.47 17.5,2 12,2Z'/%3E%3C/svg%3E";
@@ -13,18 +15,29 @@ export function Profile({ user, logoutBtnHandler }) {
id="profileAvatarImg"
alt="Profile image"
/>
<h3 id="profileUserName" class="mb-2">
{user && user.displayName ? user.displayName : 'Anonymous Creator'}
</h3>
<p>
<button
class="btn"
aria-label="Logout from your account"
onClick={logoutBtnHandler}
>
Logout
</button>
</p>
<VStack gap={4}>
<VStack gap={1}>
<h3 id="profileUserName">
{user && user.displayName ? user.displayName : 'Anonymous Creator'}
</h3>
{user.isPro && (
<Stack justify="center">
<ProBadge />
</Stack>
)}
</VStack>
<HStack>
<button
class="btn btn--primary"
aria-label="Logout from your account"
onClick={logoutBtnHandler}
>
Logout
</button>
</HStack>
</VStack>
</div>
);
}