Controls/CMS-Client
1
0
Fork 0
Code Issues Pull Requests Releases Activity

first commit

Browse Source
This commit is contained in:
CHIEFSOFT\ameye
2023-10-14 22:02:57 -04:00
commit 5f95d857d4
783 changed files with 112323 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/Pages/Support/SupportForm.js
+171
View File
@@ -0,0 +1,171 @@
import * as React from "react";
import Box from '@mui/material/Box';
import Grid from "@mui/material/Grid";
import TextField from "@mui/material/TextField";
import Button from "@mui/material/Button";
import { TextareaAutosize } from '@mui/base/TextareaAutosize';
import Typography from "@mui/material/Typography";
export default function SupportForm() {
const handleSubmit = (event) => {
event.preventDefault();
const data = new FormData(event.currentTarget);
console.log({
email: data.get("email"),
password: data.get("password"),
});
};
return (
<>
<Box
component="main"
sx={{
maxWidth: "510px",
ml: "auto",
mr: "auto",
padding: "50px 0 100px",
}}
>
<Grid item xs={12} md={12} lg={12} xl={12}>
<Box>
<Typography as="h1" fontSize="28px" fontWeight="700" mb="5px">
Contact with Us
</Typography>
<Typography fontSize="14px" mb="30px">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</Typography>
<Box component="form" onSubmit={handleSubmit} noValidate>
<Box
sx={{
background: "#fff",
padding: "30px 20px",
borderRadius: "10px",
}}
className="bg-black"
>
<Grid container alignItems="center" spacing={2}>
<Grid item xs={12}>
<Typography
component="label"
sx={{
fontWeight: "500",
fontSize: "14px",
mb: "10px",
display: "block",
}}
>
Name
</Typography>
<TextField
autoComplete="name"
name="name"
fullWidth
id="name"
autoFocus
InputProps={{
style: { borderRadius: 8 },
}}
/>
</Grid>
<Grid item xs={12}>
<Typography
component="label"
sx={{
fontWeight: "500",
fontSize: "14px",
mb: "10px",
display: "block",
}}
>
Email
</Typography>
<TextField
fullWidth
id="email"
name="email"
autoComplete="email"
InputProps={{
style: { borderRadius: 8 },
}}
/>
</Grid>
<Grid item xs={12}>
<Typography
component="label"
sx={{
fontWeight: "500",
fontSize: "14px",
mb: "10px",
display: "block",
}}
>
Subject
</Typography>
<TextField
fullWidth
id="subject"
name="subject"
autoComplete="subject"
InputProps={{
style: { borderRadius: 8 },
}}
/>
</Grid>
<Grid item xs={12}>
<Typography
component="label"
sx={{
fontWeight: "500",
fontSize: "14px",
mb: "10px",
display: "block",
}}
>
Message
</Typography>
<TextareaAutosize
minRows={5}
style={{
width: '100%',
background: '#FFFFFF',
color: '#5B5B98',
border: '1px solid rgb(193 193 193)',
borderRadius: '10px',
padding: '16.5px 14px'
}}
className="dark-textarea"
/>
</Grid>
</Grid>
</Box>
<Button
type="submit"
fullWidth
variant="contained"
sx={{
mt: 3,
textTransform: "capitalize",
borderRadius: "8px",
fontWeight: "500",
fontSize: "15px",
padding: "12px 10px",
color: "#fff !important",
}}
>
Send Message
</Button>
</Box>
</Box>
</Grid>
</Box>
</>
);
}