-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #32 from feniln64/feature/forgetpassword
new data
- Loading branch information
Showing
8 changed files
with
260 additions
and
101 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,88 @@ | ||
import data from '../assets/data.json'; | ||
|
||
const NoDomain = () => { | ||
return ( | ||
<> | ||
<section className="section section-header text-dark " style={{ backgroundColor: 'white' }}> | ||
<div className="container mb-3"> | ||
<div className="row justify-content-center" style={{ marginBottom: "100px" }} > | ||
<div className="col-12 col-md-10 text-center "> | ||
<h1 className="display-2 font-weight-bolder "> | ||
Simple & Reliable. | ||
</h1> | ||
<p className="lead mb-lg-5">CPYPST helps you share important data securly <br />with custom domain with private and public access.</p> | ||
</div> | ||
<div className="col-12 col-md-10 justify-content-center"> | ||
<img className="d-none d-md-inline-block" src="./assets/img/scene.svg" alt="Mobile App Mockup" /> | ||
</div> | ||
</div> | ||
</div> | ||
<div className="container mb-5"> | ||
<div className="row mb-5"> | ||
{data.features.map((e, i) => ( | ||
<div key={i} className="col-12 col-md-6 col-lg-4 mb-4 mb-lg-0"> | ||
<div className="card border-0 bg-white text-center p-1"> | ||
<div className="card-header bg-white border-0 pb-0"> | ||
<div className="icon icon-lg icon-primary mb-4"> | ||
<span className={`fas ${e.icon}`}></span> | ||
</div> | ||
<h2 className="h3 text-dark m-0">{e.title}</h2> | ||
</div> | ||
<div className="card-body"> | ||
<p> | ||
{e.description} | ||
</p> | ||
</div> | ||
</div> | ||
</div> | ||
))} | ||
</div> | ||
</div> | ||
|
||
<div className="container " > | ||
<div className="row justify-content-center mb-5 mb-lg-7"> | ||
<div className="col-12 col-lg-8 text-center"> | ||
<h2 className="h1 mb-4">Better in every way</h2> | ||
<p className="lead"></p> | ||
</div> | ||
</div> | ||
<div className="row row-grid align-items-center mb-5 mb-lg-7" > | ||
<div className="col-12 col-lg-5" style={{ marginBottom: "100px" }}> | ||
<h2 className="mb-4">A thoughtful way Share</h2> | ||
<p>Simply put, the app remembers your vital info and allows you to share it at any moment. And everything is secured, allowing you to distribute safely.</p> | ||
<p>Now you may forget about sharing stuff with others via chat app or email; instead, give a QR code to anyone or tell them your subdomain verbally and you're done!!.</p> | ||
|
||
</div> | ||
<div className="col-12 col-lg-6 ml-lg-auto"> | ||
<img src="./assets/img/scene-3.svg" className="w-100" alt="" /> | ||
</div> | ||
</div> | ||
<div className="row row-grid align-items-center mb-5 mb-lg-7"> | ||
<div className="col-12 col-lg-5 order-lg-2"> | ||
<h2 className="mb-4">Get it. Don't sweat it.</h2> | ||
<p>We create a unique QR code for your each subdomain you create, you can scan it to get your data on other devices for easy access.</p> | ||
<p></p> | ||
|
||
</div> | ||
<div className="col-12 col-lg-6 mr-lg-auto"> | ||
<img src="./assets/img/scene-2.svg" className="w-100" alt="" /> | ||
</div> | ||
</div> | ||
<div className="row"> | ||
{data.about.map((e, i) => ( | ||
<div key={i} className="col-12 col-md-6 col-lg-4 mb-4"> | ||
<div className="card border-light p-4"> | ||
<div className="card-body"> | ||
<h2 className="display-2 mb-2">{e.title}</h2> | ||
<span>{e.description}</span> | ||
</div> | ||
</div> | ||
</div>))} | ||
</div> | ||
</div> | ||
</section> | ||
</> | ||
); | ||
} | ||
|
||
export default NoDomain; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,152 @@ | ||
import React, { useState } from "react"; | ||
import toast, { Toaster } from "react-hot-toast"; | ||
import axiosInstance from "../api/api"; | ||
import "bootstrap/dist/css/bootstrap.min.css"; | ||
import "../assets/button.css"; | ||
import "../assets/container.css"; | ||
import {Box,Button,Container,TextField,Typography,} from "@mui/material"; | ||
import useScreenSize from "../hooks/useScreenSize"; | ||
|
||
export default function Contact() { | ||
|
||
const [email, setEmail] = useState(""); | ||
const [name, setName] = useState(""); | ||
const [message, setMessage] = useState(""); | ||
const [password, setPassword] = useState(""); | ||
|
||
const handleSubmit = async (e) => { | ||
e.preventDefault(); | ||
const userData = { | ||
email: email, | ||
name: name, | ||
message: message | ||
}; | ||
console.log(userData); | ||
setName(""); | ||
setEmail(""); | ||
setMessage(""); | ||
|
||
try { | ||
const res = await axiosInstance.post("/user/contact-us", userData); | ||
if (res.status === 200) { | ||
toast.success(res.data.message, { icon: "👍" }); | ||
} | ||
} catch (error) { | ||
toast.error(error.response.data.message, { icon: "👎" }); | ||
} | ||
}; | ||
|
||
const [isMobileView] = useScreenSize(); | ||
|
||
return ( | ||
<> | ||
<div> | ||
<Toaster position='bottom-right' reverseOrder={false}/> | ||
</div> | ||
<Container | ||
sx={{ | ||
display: "flex", | ||
justifyContent: "center", | ||
alignItems: "center", | ||
flexDirection: "column", | ||
height: "85vh", | ||
padding: isMobileView ? "20px !important" : "0px 60px !important", | ||
background: "#f8f9fA", | ||
}} | ||
maxWidth="sm" | ||
> | ||
<Box | ||
sx={{ | ||
borderRadius: "0.5rem", | ||
width: "inherit", | ||
padding: isMobileView ? "30px" : "60px", | ||
background: "#fff", | ||
display: "flex", | ||
gap: "12px", | ||
flexDirection: "column", | ||
}} | ||
> | ||
<Typography | ||
textAlign={"center"} | ||
sx={{ | ||
fontSize: "28px", | ||
fontWeight: 600, | ||
color: "#012970", | ||
}} | ||
> | ||
Contact Us | ||
</Typography> | ||
<Typography textAlign={"center"} sx={{ fontSize: "14px" }}> | ||
Enter your Name Email and Message | ||
</Typography> | ||
<form | ||
onSubmit={handleSubmit} | ||
style={{ | ||
width: "100%", | ||
display: "flex", | ||
justifyContent: "center", | ||
flexDirection: "column", | ||
gap: "20px", | ||
}} | ||
> | ||
<TextField | ||
variant="outlined" | ||
placeholder="Name" | ||
name="name" | ||
onChange={(e) => setName(e.target.value)} | ||
required | ||
fullWidth | ||
value={name} | ||
sx={{ | ||
"& input": { padding: "8px 16px !important" }, | ||
}} | ||
/> | ||
<TextField | ||
variant="outlined" | ||
placeholder="Email" | ||
name="email" | ||
onChange={(e) => setEmail(e.target.value)} | ||
required | ||
fullWidth | ||
value={email} | ||
sx={{ | ||
"& input": { padding: "8px 16px !important" }, | ||
}} | ||
/> | ||
<TextField | ||
variant="outlined" | ||
placeholder="Message" | ||
name="message" | ||
type="textarea" | ||
multiline | ||
minRows={4} | ||
onChange={(e) => setMessage(e.target.value)} | ||
required | ||
fullWidth | ||
value={message} | ||
sx={{ | ||
"& input": { padding: "8px 16px !important" }, | ||
}} | ||
/> | ||
|
||
|
||
|
||
<Button | ||
variant="contained" | ||
type="submit" | ||
sx={{ | ||
borderRadius: "8px", | ||
background: "#0d6efd", | ||
"&:hover": { | ||
background: "#0d6efd", | ||
}, | ||
}} | ||
> | ||
Submit | ||
</Button> | ||
</form> | ||
</Box> | ||
</Container> | ||
</> | ||
); | ||
} |
Oops, something went wrong.