sergey/anti-hvost
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: profile styles

Browse Source
This commit is contained in:
Sergey Elpashev
2025-04-07 15:59:04 +03:00
parent 04347f4cd9
commit 554ee083ab
2 changed files with 25 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/pages/profile_settings.module.scss
View File

@@ -9,8 +9,8 @@
} }
.header_block__name { .header_block__name {
@apply mt-5 flex w-full flex-col items-center justify-start gap-3; @apply mt-5 flex h-fit w-full flex-col items-center justify-start gap-3;
} }
.settings_block { .settings_block {
@apply flex h-full w-full flex-col items-center justify-center; @apply mt-12 flex h-full w-full flex-col items-center justify-start md:mt-0 md:justify-center;
} }

9
src/pages/profile_settings.tsx
View File

@@ -9,14 +9,15 @@ const ProfileSettings: FunctionComponent = () => {
const { route } = useLocation(); const { route } = useLocation();
return ( return (
<div class={classes.container}> <div class={classes.container}>
<div class={classes.header_block}> <div class="flex h-full w-full flex-col items-center md:flex-row md:items-start">
{/* Вынести классы в стили */} {/* Вынести классы в стили */}
<div class="flex aspect-square h-full flex-col items-center justify-center rounded-md border">Аватар</div> <div class="flex aspect-square h-40 flex-col items-center justify-center rounded-md border">Аватар</div>
<div className="flex h-full w-full flex-col items-center">
<div class={classes.header_block__name}> <div class={classes.header_block__name}>
<p class="text-5xl font-semibold">Никнейм</p> <p class="text-5xl font-semibold">Никнейм</p>
<p class="text-2xl font-light">Статус</p> <p class="text-2xl font-light">Статус</p>
</div> </div>
</div>
<div class={classes.settings_block}> <div class={classes.settings_block}>
<div class="flex w-[300px] flex-col gap-10"> <div class="flex w-[300px] flex-col gap-10">
<Button>Сменить тему</Button> <Button>Сменить тему</Button>
@@ -33,6 +34,8 @@ const ProfileSettings: FunctionComponent = () => {
</div> </div>
</div> </div>
</div> </div>
</div>
</div>
); );
}; };