47 lines
1.9 KiB
TypeScript
47 lines
1.9 KiB
TypeScript
|
|
import { Field, Input, Stack } from "@chakra-ui/react";
|
|
import { Button } from "../../components/ui/button";
|
|
import { DialogBody, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../components/ui/dialog";
|
|
import EnterPassword from "./EnterPassword";
|
|
function Changepassword() {
|
|
return (
|
|
|
|
<DialogRoot placement="center">
|
|
<DialogTrigger asChild>
|
|
<Button bg="#02A0A0" size={'2xs'} color={"#fff"} px={2} >
|
|
Change Password
|
|
</Button>
|
|
</DialogTrigger>
|
|
|
|
<DialogContent
|
|
bg={"#fff"}
|
|
w={{ base: '90%', md: '400px' }}
|
|
p={2}
|
|
bgSize={'md'}
|
|
>
|
|
<DialogHeader bg="white" pt={3} pb={2} >
|
|
<DialogTitle alignSelf="center" color="black" fontSize="18px" textAlign={"center"}>CHANGE PASSWORD</DialogTitle>
|
|
</DialogHeader>
|
|
|
|
<DialogBody bg="white" pt={5}>
|
|
<Stack p={2} >
|
|
<Field.Root>
|
|
<Field.Label color="black" pt={1} fontSize="12px">New password</Field.Label>
|
|
<Input color="black" pl={1} fontSize="12px" type="password" border="1px solid grey" /></Field.Root>
|
|
<Field.Root>
|
|
<Field.Label color="black" pt={1} fontSize="12px">Confirm password</Field.Label>
|
|
<Input color="black" pl={1} fontSize="12px" type="password" border="1px solid grey" /></Field.Root>
|
|
|
|
</Stack>
|
|
</DialogBody>
|
|
<DialogFooter display="flex" justifyContent="center" mt={2} p={2}
|
|
>
|
|
<EnterPassword />
|
|
</DialogFooter>
|
|
</DialogContent>
|
|
</DialogRoot >
|
|
|
|
)
|
|
}
|
|
|
|
export default Changepassword |