Ubuntu
42 lines
1.7 KiB
TypeScript
42 lines
1.7 KiB
TypeScript
import * as React from "react"
|
|
import { Drawer } from "@/components/retroui/Drawer"
|
|
import { Button } from "@/components/retroui/Button"
|
|
import { Input } from "@/components/retroui/Input"
|
|
import { Label } from "@/components/retroui/Label"
|
|
import { Textarea } from "@/components/retroui/Textarea"
|
|
|
|
export default function DrawerStyleRightDirection() {
|
|
return (
|
|
<Drawer direction="right">
|
|
<Drawer.Trigger asChild>
|
|
<Button>Review Us</Button>
|
|
</Drawer.Trigger>
|
|
<Drawer.Content>
|
|
<Drawer.Header>
|
|
<Drawer.Title>Edit Profile</Drawer.Title>
|
|
<Drawer.Description>Make changes to your profile here. Click save when you're done.</Drawer.Description>
|
|
</Drawer.Header>
|
|
|
|
<form className="flex flex-col space-y-4 p-4">
|
|
<div className="flex flex-col space-y-2">
|
|
<Label>Email</Label>
|
|
<Input placeholder="Enter your email" />
|
|
</div>
|
|
<div className="flex flex-col space-y-2">
|
|
<Label>Comment</Label>
|
|
<Textarea rows={4} placeholder="Enter your comment" />
|
|
</div>
|
|
</form>
|
|
<Drawer.Footer>
|
|
<div className="flex justify-start gap-3">
|
|
<Button>Submit</Button>
|
|
<Drawer.Close>
|
|
<Button variant="outline">Cancel</Button>
|
|
</Drawer.Close>
|
|
</div>
|
|
</Drawer.Footer>
|
|
</Drawer.Content>
|
|
</Drawer>
|
|
)
|
|
}
|