blob: c1f359ea1790183afae52d555753dc829c876ba8 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
|
import { Button } from '@/components/ui/button';
import { DialogContent } from '@/components/ui/dialog';
import { Input } from '@/components/ui/input';
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
import GoogleIcon from '../../../public/icons/google.svg';
export function AuthDialog() {
return (
<div className="absolute">
<DialogContent className="w-[350px] p-0 bg-transparent border-transparent">
<Tabs defaultValue="Login">
<div className="flex flex-col gap-[5px] ">
<TabsList className="w-[350px] h-[36px] font-medium justify-between bg-background border border-violet rounded-[15px]">
<TabsTrigger
value="Login"
className="w-[59px] text-[16px] leading-[22px]"
>
<span className="w-[39px]">Вход</span>
</TabsTrigger>
<TabsTrigger
value="Register"
className="w-[116px] text-[16px]"
>
<span className="w-[96px]">Регистрация</span>
</TabsTrigger>
<TabsTrigger
value="Reset"
className="w-[145px] gap-[10px] text-[16px] "
>
<span className="w-[125px]">
Восстановление
</span>
</TabsTrigger>
</TabsList>
<TabsContent
value="Login"
className="w-[350px] min-h-[250px] p-4 gap-4 flex flex-col items-center justify-center rounded-[15px] border-[2px] bg-background"
>
<div className="gap-5 flex flex-col h-[148px] w-[310px]">
<Button className="w-full bg-white hover:bg-white hover:text-black">
<GoogleIcon />
<span className="text-black">
Войти через Google
</span>
</Button>
<div className="gap-[10px] flex-col flex h-[88px]">
<div className="rounded-[20px] border-violet border-[2px] h-[39px] justify-between py-[10px] px-[20px] items-center flex">
<Input
className="w-full flex text-white placeholder:text-light-violet h-[19px]"
placeholder="Никнейм или почта"
/>
</div>
<div className="rounded-[20px] border-violet border-[2px] h-[39px] justify-between py-[10px] px-[20px] items-center flex">
<Input
className="w-full flex text-white placeholder:text-light-violet h-[19px]"
placeholder="пароль"
/>
</div>
</div>
</div>
<Button className="w-full gap-[10px]">Войти</Button>
</TabsContent>
<TabsContent value="Register">
<div className="h-[99px]"></div>
</TabsContent>
<TabsContent value="Reset"></TabsContent>
</div>
</Tabs>
</DialogContent>
</div>
);
}
|
