Skip to content

Commit 669e479

Browse files
bruna9165bruna9165
authored
Merge pull request #21 from bruna9165/feat-bruna
Feat bruna
2 parents d1d3a79 + e6b7a67 commit 669e479

File tree

15 files changed

+221
-122
lines changed

15 files changed

+221
-122
lines changed

‎package.json‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,8 +22,9 @@
2222
"dependencies": {
2323
"@heroicons/react": "^2.2.0",
2424
"@material-tailwind/react": "^2.1.10",
25+
"@radix-ui/react-accordion": "^1.2.4",
2526
"@radix-ui/react-alert-dialog": "^1.1.6",
26-
"@radix-ui/react-avatar": "^1.1.3",
27+
"@radix-ui/react-avatar": "^1.1.4",
2728
"@radix-ui/react-collapsible": "^1.1.3",
2829
"@radix-ui/react-dialog": "^1.1.6",
2930
"@radix-ui/react-dropdown-menu": "^2.1.6",

‎public/Profile.png‎

-136 KB
Binary file not shown.

‎src/components/Sidebar/Sidebar.tsx‎

Lines changed: 42 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -44,20 +44,22 @@ import { CircleDollarSign, CircleUserRound, Gamepad2, LogOut, Settings } from "l
4444
placeholder=""
4545
onPointerEnterCapture={() => {}}
4646
onPointerLeaveCapture={() => {}}>
47-
<ListItem
48-
className="flex items-center cursor-pointer hover:bg-gray-900 text-gray-400 hover:text-white text-lg font-medium transition-colors p-4 px-6 gap-4"
49-
placeholder=""
50-
onPointerEnterCapture={() => {}}
51-
onPointerLeaveCapture={() => {}}>
52-
<ListItemPrefix
53-
placeholder=""
54-
onPointerEnterCapture={() => {}}
55-
onPointerLeaveCapture={() => {}}>
56-
<Gamepad2 className="h-6 w-6" />
57-
</ListItemPrefix>
58-
Jogos
59-
</ListItem>
60-
<Link to="/wallet" className="no-underline">
47+
<Link to={"/home"} className="no-underline">
48+
<ListItem
49+
className="flex items-center cursor-pointer hover:bg-gray-900 text-gray-400 hover:text-white text-lg font-medium transition-colors p-4 px-6 gap-4"
50+
placeholder=""
51+
onPointerEnterCapture={() => {}}
52+
onPointerLeaveCapture={() => {}}>
53+
<ListItemPrefix
54+
placeholder=""
55+
onPointerEnterCapture={() => {}}
56+
onPointerLeaveCapture={() => {}}>
57+
<Gamepad2 className="h-6 w-6" />
58+
</ListItemPrefix>
59+
Jogos
60+
</ListItem>
61+
</Link>
62+
<Link to="/transacoes" className="no-underline">
6163
<ListItem
6264
className="flex items-center cursor-pointer hover:bg-gray-900 text-gray-400 hover:text-white text-lg font-medium transition-colors p-4 px-6 gap-4"
6365
placeholder=""
@@ -71,18 +73,20 @@ import { CircleDollarSign, CircleUserRound, Gamepad2, LogOut, Settings } from "l
7173
Saldo e Transações
7274
</ListItem>
7375
</Link>
74-
<ListItem
75-
className="flex items-center cursor-pointer hover:bg-gray-900 text-gray-400 hover:text-white text-lg font-medium transition-colors p-4 px-6 gap-4"
76-
placeholder=""
77-
onPointerEnterCapture={() => {}}
78-
onPointerLeaveCapture={() => {}}>
79-
<ListItemPrefix placeholder=""
76+
<Link to={'/perfil'} className="no-underline">
77+
<ListItem
78+
className="flex items-center cursor-pointer hover:bg-gray-900 text-gray-400 hover:text-white text-lg font-medium transition-colors p-4 px-6 gap-4"
79+
placeholder=""
8080
onPointerEnterCapture={() => {}}
8181
onPointerLeaveCapture={() => {}}>
82-
<CircleUserRound className="h-6 w-6" />
83-
</ListItemPrefix>
84-
Perfil
85-
</ListItem>
82+
<ListItemPrefix placeholder=""
83+
onPointerEnterCapture={() => {}}
84+
onPointerLeaveCapture={() => {}}>
85+
<CircleUserRound className="h-6 w-6" />
86+
</ListItemPrefix>
87+
Perfil
88+
</ListItem>
89+
</Link>
8690
<ListItem
8791
className="flex items-center cursor-pointer hover:bg-gray-900 text-gray-400 hover:text-white text-lg font-medium transition-colors p-4 px-6 gap-4"
8892
placeholder=""
@@ -97,21 +101,23 @@ import { CircleDollarSign, CircleUserRound, Gamepad2, LogOut, Settings } from "l
97101
</ListItemPrefix>
98102
Configurações
99103
</ListItem>
100-
<ListItem
101-
className="flex items-center cursor-pointer hover:bg-gray-900 text-gray-400 hover:text-white text-lg font-medium transition-colors p-4 px-6 gap-4"
102-
placeholder=""
103-
onPointerEnterCapture={() => {}}
104-
onPointerLeaveCapture={() => {}}
105-
>
106-
<ListItemPrefix
104+
<Link to={'/'} className="no-underline">
105+
<ListItem
106+
className="flex items-center cursor-pointer hover:bg-gray-900 text-gray-400 hover:text-white text-lg font-medium transition-colors p-4 px-6 gap-4"
107107
placeholder=""
108108
onPointerEnterCapture={() => {}}
109109
onPointerLeaveCapture={() => {}}
110-
>
111-
<LogOut className="h-6 w-6" />
112-
</ListItemPrefix>
113-
Sair
114-
</ListItem>
110+
>
111+
<ListItemPrefix
112+
placeholder=""
113+
onPointerEnterCapture={() => {}}
114+
onPointerLeaveCapture={() => {}}
115+
>
116+
<LogOut className="h-6 w-6" />
117+
</ListItemPrefix>
118+
Sair
119+
</ListItem>
120+
</Link>
115121
</List>
116122
</Card>
117123
);

‎src/components/ui/accordion.tsx‎

Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
import * as React from "react"
2+
import * as AccordionPrimitive from "@radix-ui/react-accordion"
3+
import { ChevronDown } from "lucide-react"
4+
5+
import { cn } from "@/lib/utils"
6+
7+
const Accordion = AccordionPrimitive.Root
8+
9+
const AccordionItem = React.forwardRef<
10+
React.ElementRef<typeof AccordionPrimitive.Item>,
11+
React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Item>
12+
>(({ className, ...props }, ref) => (
13+
<AccordionPrimitive.Item
14+
ref={ref}
15+
className={cn("border-b", className)}
16+
{...props}
17+
/>
18+
))
19+
AccordionItem.displayName = "AccordionItem"
20+
21+
const AccordionTrigger = React.forwardRef<
22+
React.ElementRef<typeof AccordionPrimitive.Trigger>,
23+
React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Trigger>
24+
>(({ className, children, ...props }, ref) => (
25+
<AccordionPrimitive.Header className="flex">
26+
<AccordionPrimitive.Trigger
27+
ref={ref}
28+
className={cn(
29+
"flex flex-1 items-center justify-between py-4 font-medium transition-all hover:underline [&[data-state=open]>svg]:rotate-180",
30+
className
31+
)}
32+
{...props}
33+
>
34+
{children}
35+
<ChevronDown className="h-4 w-4 shrink-0 transition-transform duration-200" />
36+
</AccordionPrimitive.Trigger>
37+
</AccordionPrimitive.Header>
38+
))
39+
AccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName
40+
41+
const AccordionContent = React.forwardRef<
42+
React.ElementRef<typeof AccordionPrimitive.Content>,
43+
React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Content>
44+
>(({ className, children, ...props }, ref) => (
45+
<AccordionPrimitive.Content
46+
ref={ref}
47+
className="overflow-hidden text-sm transition-all data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down"
48+
{...props}
49+
>
50+
<div className={cn("pb-4 pt-0", className)}>{children}</div>
51+
</AccordionPrimitive.Content>
52+
))
53+
54+
AccordionContent.displayName = AccordionPrimitive.Content.displayName
55+
56+
export { Accordion, AccordionItem, AccordionTrigger, AccordionContent }

‎src/components/ui/heading.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ const headingVariants = cva(' text-white gap-4 font-bold font-sans flex flex-col
1818
},
1919
})
2020

21-
const underlineVariants = cva('w-[170px] h-[2px] bg-yellow-500', {
21+
const underlineVariants = cva('w-[120px] h-[2px] bg-yellow-500', {
2222
variants: {
2323
variant: {
2424
primary: 'bg-yellow-500',

‎src/index.css‎

Lines changed: 3 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -74,9 +74,9 @@
7474
--sidebar-ring: 217.2 91.2% 59.8%;
7575
}
7676
}
77-
@layer base {
77+
@layer base {
7878
* {
79-
@apply border box-border m-0 p-0;
79+
@apply box-border m-0 p-0;
8080
}
8181
body {
8282
@apply bg-background text-foreground antialiased;
@@ -102,11 +102,4 @@
102102
}
103103
}
104104

105-
@layer base {
106-
* {
107-
@apply box-border;
108-
}
109-
body {
110-
@apply bg-background text-foreground;
111-
}
112-
}
105+

‎src/layout/LayoutHome.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ export function LayoutHome({ children }: LayoutHomeProps) {
1010
<div className=' h-screen bg-gradient-to-b from-[#07080D] to-[#1D1F2C] '>
1111
<Sidebar>
1212
</Sidebar>
13-
<div className='ml-80 p-14'>
13+
<div className='ml-80 p-14 '>
1414
{children}
1515
</div>
1616
</div>

‎src/pages/edit_profile/index.tsx‎

Lines changed: 0 additions & 56 deletions
This file was deleted.

‎src/pages/login/index.tsx‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ export function Login() {
3838

3939
<div className="flex items-center bg-gradient-to-b from-[#07080D] to-[#1D1F2C] w-screen h-[100vh] animate-fadeUp p-0 m-0">
4040
<div className="w-1/2 flex justify-center items-center">
41-
<img src="../../../public/banner.png" alt="banner" />
41+
<img src="../../../banner.png" alt="banner" />
4242
</div>
4343
<div className="flex flex-col justify-center items-center gap-8 h-screen w-1/2">
4444
<div className="text-white h-full flex justify-center items-center flex-col gap-6 animate-fadeUp">
@@ -60,7 +60,9 @@ export function Login() {
6060
className="w-96"
6161
/>
6262
<div className="flex flex-col gap-2 items-center">
63-
<Button className="text-lg h-12 w-96 text-black">Entrar</Button>
63+
<Link to={'/home'} className="w-full">
64+
<Button className="text-lg h-12 w-96 text-black">Entrar</Button>
65+
</Link>
6466
<p className="text-gray-400">Não tem uma conta? <Link className="text-yellow-500 hover:underline hover:text-yellow-600 no-underline" to={'/cadastrar'} >Criar</Link></p>
6567
</div>
6668
</div>

‎src/pages/profile/index.tsx‎

Lines changed: 60 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
import { Heading } from "@/components/ui/heading";
2+
import { LayoutHome } from "@/layout/LayoutHome";
3+
import { Input } from "@/components/ui/input";
4+
import { Button } from "@/components/ui/button";
5+
import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
6+
7+
export function Profile() {
8+
return (
9+
<LayoutHome>
10+
<div className="flex flex-col gap-8 w-1/3">
11+
<Heading >Perfil</Heading>
12+
<div className="flex items-center justify-between">
13+
<Avatar className="w-32 h-32">
14+
<AvatarImage src="https://github.com/shadcn.png" />
15+
<AvatarFallback>CN</AvatarFallback>
16+
</Avatar>
17+
<div className="flex items-center gap-3 w-80">
18+
<Button className="rounded">
19+
Adicionar Foto
20+
</Button>
21+
<Button variant={"destructive"} className="rounded">
22+
Excluir foto
23+
</Button>
24+
</div>
25+
</div>
26+
<div className="space-y-6">
27+
<Input
28+
type="text"
29+
label="Nome Completo"
30+
placeholder="Gael Monteiro Alves"
31+
className=""
32+
/>
33+
<Input
34+
type="email"
35+
label="E-mail"
36+
placeholder="[email protected]"
37+
className=""
38+
/>
39+
<Input
40+
type="text"
41+
label="CPF"
42+
placeholder="369.246.458-00"
43+
className=""
44+
/>
45+
<Input
46+
type="text"
47+
label="Data de Nascimento"
48+
placeholder="15/02/2006"
49+
className="text-slate-300 placeholder:text-slate-500"
50+
/>
51+
<div className="mt-2 flex w-full justify-end">
52+
<Button className="h-12 w-64">
53+
Editar informações
54+
</Button>
55+
</div>
56+
</div>
57+
</div>
58+
</LayoutHome>
59+
);
60+
}

0 commit comments

Comments
 (0)