FloatSystems/float-fleet
1
0
Fork 0
Code Issues Pull Requests Releases Activity

first commit

Browse Source
This commit is contained in:
DESKTOP-GBA0BK8\Admin
2023-03-25 20:44:56 -04:00
commit 97cc85c49d
711 changed files with 109164 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/Settings/Account/ChangePassword.js
+147
View File
@@ -0,0 +1,147 @@
import * as React from 'react';
import Button from '@mui/material/Button';
import TextField from '@mui/material/TextField';
import Grid from '@mui/material/Grid';
import Box from '@mui/material/Box';
import Typography from '@mui/material/Typography';
export default function ChangePassword() {
const handleSubmit = (event) => {
event.preventDefault();
const data = new FormData(event.currentTarget);
console.log({
email: data.get('email'),
password: data.get('password'),
});
};
return (
<>
<Box>
<Box
sx={{
borderBottom: '1px solid #eee',
paddingBottom: '10px'
}}
className="for-dark-bottom-border"
>
<Typography component="h1" fontWeight="500" fontSize="18px">
Security
</Typography>
<Typography fontSize="13px">
Update your password here.
</Typography>
</Box>
<Box component="form" noValidate onSubmit={handleSubmit} sx={{ mt: 3 }}>
<Grid container spacing={2}>
<Grid item xs={12} sm={12}>
<Typography
component="label"
sx={{
fontWeight: "500",
fontSize: "14px",
mb: "10px",
display: "block",
}}
>
Old Password
</Typography>
<TextField
autoComplete="old-password*"
name="oldPassword*"
fullWidth
id="oldPassword"
type="password"
autoFocus
/>
</Grid>
<Grid item xs={12} sm={12}>
<Typography
component="label"
sx={{
fontWeight: "500",
fontSize: "14px",
mb: "10px",
display: "block",
}}
>
New Password
</Typography>
<TextField
autoComplete="new-password*"
name="newPassword*"
fullWidth
id="newPassword"
type="password"
autoFocus
/>
</Grid>
<Grid item xs={12} sm={12}>
<Typography
component="label"
sx={{
fontWeight: "500",
fontSize: "14px",
mb: "10px",
display: "block",
}}
>
Confirm Password
</Typography>
<TextField
autoComplete="confirm-password*"
name="confirmPassword*"
fullWidth
id="confirmPassword"
type="password"
autoFocus
/>
</Grid>
<Grid item xs={12}>
<Typography
component="label"
sx={{
fontWeight: "500",
fontSize: "14px",
mb: "10px",
display: "block",
}}
>
Email Address
</Typography>
<TextField
fullWidth
id="email"
name="email"
type="email"
autoComplete="email"
/>
</Grid>
</Grid>
<Button
type="submit"
variant="contained"
sx={{
mt: 2,
textTransform: "capitalize",
borderRadius: "8px",
fontWeight: "500",
fontSize: "14px",
padding: "12px 30px",
color: "#fff !important"
}}
>
Change Password
</Button>
</Box>
</Box>
</>
);
}
components/Settings/Account/PrivacyPolicyContent.js
+102
View File
@@ -0,0 +1,102 @@
import * as React from 'react';
import Box from '@mui/material/Box';
import Typography from '@mui/material/Typography';
import Button from '@mui/material/Button';
export default function PrivacyPolicyContent() {
return (
<>
<Box mb={2}>
<Box
sx={{
borderBottom: '1px solid #eee',
paddingBottom: '10px',
marginBottom: '15px'
}}
className="for-dark-bottom-border"
>
<Typography component="h1" fontWeight="500" fontSize="18px">
Security:
</Typography>
</Box>
<Typography component="h1" fontWeight="500" fontSize="15px" mb="5px">
Two-factor Authentication
</Typography>
<Typography fontSize="13px">
Two-factor authentication is an enhanced security meansur. Once enabled, you'll be required to give two types of identification when you log into Google Authentication and SMS are Supported.
</Typography>
</Box>
<Box mb={2}>
<Typography component="h1" fontWeight="500" fontSize="15px" mb="5px">
Secondary Verification
</Typography>
<Typography fontSize="13px">
Two-factor authentication is an enhanced security meansur. Once enabled, you'll be required to give two types of identification when you log into Google Authentication and SMS are Supported.
</Typography>
</Box>
<Box mb={2}>
<Typography component="h1" fontWeight="500" fontSize="15px" mb="5px">
Backup Codes
</Typography>
<Typography fontSize="13px">
Two-factor authentication is an enhanced security meansur. Once enabled, you'll be required to give two types of identification when you log into Google Authentication and SMS are Supported.
</Typography>
</Box>
<Box mb={2}>
<Typography component="h1" fontWeight="500" fontSize="15px" mb="5px">
Desktop, email, chat, purchase notifications
</Typography>
<Typography fontSize="13px">
Two-factor authentication is an enhanced security meansur. Once enabled, you'll be required to give two types of identification when you log into Google Authentication and SMS are Supported.
</Typography>
</Box>
<Box mb={2}>
<Typography component="h1" fontWeight="500" fontSize="15px" mb="5px">
Delete this account :
</Typography>
<Typography fontSize="13px">
Two-factor authentication is an enhanced security meansur. Once enabled, you'll be required to give two types of identification when you log into Google Authentication and SMS are Supported.
</Typography>
</Box>
<Box mt={3}>
<Button
variant="contained"
color="danger"
size="large"
sx={{
background: 'rgba(238, 54, 140, 0.1)',
borderRadius: '8px',
textTransform: 'capitalize',
}}
className="mr-15px"
>
close & delete this account
</Button>
<Button
variant="contained"
color="danger"
size="large"
sx={{
background: 'rgba(117, 127, 239, 0.1)',
borderRadius: '8px',
textTransform: 'capitalize'
}}
>
Cancel
</Button>
</Box>
</>
);
}
components/Settings/Account/Profile.js
+155
View File
@@ -0,0 +1,155 @@
import * as React from 'react';
import Button from '@mui/material/Button';
import TextField from '@mui/material/TextField';
import Grid from '@mui/material/Grid';
import Box from '@mui/material/Box';
import Typography from '@mui/material/Typography';
export default function Profile() {
const handleSubmit = (event) => {
event.preventDefault();
const data = new FormData(event.currentTarget);
console.log({
email: data.get('email'),
password: data.get('password'),
});
};
return (
<>
<Box>
<Box
sx={{
borderBottom: '1px solid #eee',
paddingBottom: '10px'
}}
className="for-dark-bottom-border"
>
<Typography component="h1" fontWeight="500" fontSize="18px">
Profile
</Typography>
<Typography fontSize="13px">
Update your photo and personal details here.
</Typography>
</Box>
<Box component="form" noValidate onSubmit={handleSubmit} sx={{ mt: 3 }}>
<Grid container spacing={2}>
<Grid item xs={12} sm={6}>
<Typography
component="label"
sx={{
fontWeight: "500",
fontSize: "14px",
mb: "10px",
display: "block",
}}
>
First Name
</Typography>
<TextField
autoComplete="given-name"
name="firstName"
fullWidth
id="firstName"
autoFocus
/>
</Grid>
<Grid item xs={12} sm={6}>
<Typography
component="label"
sx={{
fontWeight: "500",
fontSize: "14px",
mb: "10px",
display: "block",
}}
>
Last Name
</Typography>
<TextField
fullWidth
id="lastName"
name="lastName"
autoComplete="family-name"
/>
</Grid>
<Grid item xs={12}>
<Typography
component="label"
sx={{
fontWeight: "500",
fontSize: "14px",
mb: "10px",
display: "block",
}}
>
Email Address
</Typography>
<TextField
fullWidth
id="email"
name="email"
autoComplete="email"
/>
</Grid>
<Grid item xs={12}>
<Typography
component="label"
sx={{
fontWeight: "500",
fontSize: "14px",
mb: "10px",
display: "block",
}}
>
Upload Image
</Typography>
<TextField
required
fullWidth
name="file"
type="file"
id="file"
autoComplete="file"
/>
<Box mt={1}>
<img
src="/images/user1.png"
alt="profile"
className="borRadius100"
width="50px"
height="50px"
/>
</Box>
</Grid>
</Grid>
<Button
type="submit"
variant="contained"
sx={{
mt: 2,
textTransform: "capitalize",
borderRadius: "8px",
fontWeight: "500",
fontSize: "14px",
padding: "12px 30px",
color: "#fff !important"
}}
>
Update
</Button>
</Box>
</Box>
</>
);
}
components/Settings/NavBar.js
+34
View File
@@ -0,0 +1,34 @@
import React from 'react';
import Link from 'next/link';
import { useRouter } from "next/router";
import styles from '@/components/Settings/NavBar.module.css'
const NavBar = () => {
const router = useRouter();
return (
<>
<nav className={styles.topNavStyle}>
<ul>
<li className={router.pathname == "/settings/account" ? styles.active : ""}>
<Link href="/settings/account">
Account
</Link>
</li>
<li className={router.pathname == "/settings/security" ? styles.active : ""}>
<Link href="/settings/security">
Security
</Link>
</li>
<li className={router.pathname == "/settings/privacy-policy" ? styles.active : ""}>
<Link href="/settings/privacy-policy">
Privacy Policy
</Link>
</li>
</ul>
</nav>
</>
)
}
export default NavBar;
components/Settings/NavBar.module.css
+37
View File
@@ -0,0 +1,37 @@
.topNavStyle {
margin-bottom: 10px;
}
.topNavStyle ul {
list-style-type: none;
padding: 0;
margin: 0;
}
.topNavStyle ul li {
display: inline-block;
margin-right: 10px;
margin-bottom: 10px;
}
.topNavStyle ul li:last-child {
margin-right: 0;
}
.topNavStyle ul li a {
background-color: rgba(161, 98, 247, 0.1);
padding: 10px 25px;
display: inline-block;
border-radius: 5px;
text-decoration: none;
font-weight: 500;
}
.topNavStyle ul li a:hover, .topNavStyle ul li.active a {
background-color: var(--primaryColor);
color: #fff;
}
/* For RTL Style */
[dir="rtl"] .topNavStyle ul li {
margin-right: 0;
margin-left: 10px;
}
[dir="rtl"] .topNavStyle ul li:last-child {
margin-left: 0;
}