-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Update contact us and register pages (#56)
- Loading branch information
Showing
13 changed files
with
308 additions
and
314 deletions.
There are no files selected for viewing
This file was deleted.
Oops, something went wrong.
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 |
|---|---|---|
| @@ -1,82 +1,103 @@ | ||
| import React from 'react'; | ||
| import React, { useState } from 'react'; | ||
| import NavBar from '../components/navBars/NavBar'; | ||
| import Footer from '../components/footers/Footer'; | ||
| import SubmitContactFormButton from '../components/buttons/SubmitContactFormButton'; | ||
|
|
||
| export default function ContactUsPage() { | ||
| const [name, setName] = useState('Lance Tan'); | ||
| const [email, setEmail] = useState('[email protected]'); | ||
| const [phoneNumber, setPhoneNumber] = useState('+63 (917) 123 4567'); | ||
| const [bidderNumber, setBidderNumber] = useState('12345678'); | ||
| const [message, setMessage] = useState( | ||
| "Hello, I'd like to speak with a Microvan employee regarding an issue I'm facing with downloading my statement of account." | ||
| ); | ||
|
|
||
| const handleNameChange = (e) => { | ||
| setName(e.target.value); | ||
| }; | ||
|
|
||
| const handleEmailChange = (e) => { | ||
| setEmail(e.target.value); | ||
| }; | ||
|
|
||
| const handlePhoneNumberChange = (e) => { | ||
| setPhoneNumber(e.target.value); | ||
| }; | ||
|
|
||
| const handleBidderNumberChange = (e) => { | ||
| setBidderNumber(e.target.value); | ||
| }; | ||
|
|
||
| const handleMessageChange = (e) => { | ||
| setMessage(e.target.value); | ||
| }; | ||
|
|
||
| return ( | ||
| <div className="flex flex-col min-h-screen"> | ||
| <div className="flex flex-col min-h-screen w-screen"> | ||
| <NavBar /> | ||
|
|
||
| <div className="flex-1"> | ||
| <div className="flex flex-col px-[5%] py-[5%] w-full justify-center"> | ||
| <h1 className="text-4xl pb-[1%] font-semibold text-mv-black"> | ||
| Contact Us | ||
| </h1> | ||
| <div className="flex flex-col items-start w-[60%] mt-[22px] gap-y-[5px]"> | ||
| <p className="font-poppins text-2xl font-normal leading-9 tracking-normal text-left"> | ||
| Name | ||
| </p> | ||
| <div className="flex items-center w-[50%] h-[56px] px-5 py-4 shrink-0 gap-5 rounded-2xl bg-mv-white shadow-searchBarShadow"> | ||
| <div className="flex-1 mt-[115px] w-full"> | ||
| <div className="flex flex-col px-[10%] w-full justify-center text-mv-black gap-y-[45px]"> | ||
| <h1 className="text-4xl font-semibold">Contact Us</h1> | ||
| <div className="flex flex-col items-start w-full mt-[11px] gap-y-[19px]"> | ||
| <p className="text-2xl font-normal">Name</p> | ||
| <div className="flex items-center w-[50%] h-[55px] px-[23px] py-[13px] shrink-0 rounded-[5px] shadow-searchBarShadow"> | ||
| <input | ||
| className="w-full text-base font-poppins text-gray-700 placeholder-dark-grey outline-none" | ||
| placeholder="" | ||
| className="w-full text-lg font-base outline-none" | ||
| value={name} | ||
| onChange={handleNameChange} | ||
| /> | ||
| </div> | ||
| </div> | ||
| <div className="flex flex-col items-start w-[60%] mt-[22px] gap-y-[5px]"> | ||
| <p className="font-poppins text-2xl font-normal leading-9 tracking-normal text-left"> | ||
| </p> | ||
| <div className="flex items-center w-[50%] h-[56px] px-5 py-4 shrink-0 gap-5 rounded-2xl bg-mv-white shadow-searchBarShadow"> | ||
| <div className="flex flex-col items-start w-full mt-[11px] gap-y-[19px]"> | ||
| <p className="text-2xl font-normal">Email</p> | ||
| <div className="flex items-center w-[50%] h-[55px] px-[23px] py-[13px] shrink-0 rounded-[5px] shadow-searchBarShadow"> | ||
| <input | ||
| className="w-full text-base font-poppins text-gray-700 placeholder-dark-grey outline-none" | ||
| placeholder="" | ||
| className="w-full text-lg font-base outline-none" | ||
| value={email} | ||
| onChange={handleEmailChange} | ||
| /> | ||
| </div> | ||
| </div> | ||
| <div className="flex flex-col items-start w-[60%] mt-[22px] gap-y-[5px]"> | ||
| <p className="font-poppins text-2xl font-normal leading-9 tracking-normal text-left"> | ||
| Phone Number | ||
| </p> | ||
| <div className="flex items-center w-[50%] h-[56px] px-5 py-4 shrink-0 gap-5 rounded-2xl bg-mv-white shadow-searchBarShadow"> | ||
| <div className="flex flex-col items-start w-full mt-[11px] gap-y-[19px]"> | ||
| <p className="text-2xl font-normal">Phone Number</p> | ||
| <div className="flex items-center w-[50%] h-[55px] px-[23px] py-[13px] shrink-0 rounded-[5px] shadow-searchBarShadow"> | ||
| <input | ||
| className="w-full text-base font-poppins text-gray-700 placeholder-dark-grey outline-none" | ||
| placeholder="" | ||
| className="w-full text-lg font-base outline-none" | ||
| value={phoneNumber} | ||
| onChange={handlePhoneNumberChange} | ||
| /> | ||
| </div> | ||
| </div> | ||
| <div className="flex flex-col items-start w-[60%] mt-[22px] gap-y-[5px]"> | ||
| <p className="font-poppins text-2xl font-normal leading-9 tracking-normal text-left"> | ||
| <div className="flex flex-col items-start w-full mt-[11px] gap-y-[19px]"> | ||
| <p className="text-2xl font-normal"> | ||
| Bidder Number (If you have one) | ||
| </p> | ||
| <div className="flex items-center w-[50%] h-[56px] px-5 py-4 shrink-0 gap-5 rounded-2xl bg-mv-white shadow-searchBarShadow"> | ||
| <div className="flex items-center w-[50%] h-[55px] px-[23px] py-[13px] shrink-0 rounded-[5px] shadow-searchBarShadow"> | ||
| <input | ||
| className="w-full text-base font-poppins text-gray-700 placeholder-dark-grey outline-none" | ||
| placeholder="" | ||
| className="w-full text-lg font-base outline-none" | ||
| value={bidderNumber} | ||
| onChange={handleBidderNumberChange} | ||
| /> | ||
| </div> | ||
| </div> | ||
| <div className="flex flex-col items-start w-[60%] mt-[22px] gap-y-[5px]"> | ||
| <p className="font-poppins text-2xl font-normal leading-9 tracking-normal text-left"> | ||
| Message | ||
| </p> | ||
| <div className="flex w-[90%] h-[231px] px-5 py-4 shrink-0 gap-5 rounded-2xl bg-mv-white shadow-searchBarShadow"> | ||
| <textarea | ||
| className="w-full text-base font-poppins text-gray-700 placeholder-dark-grey outline-none align-text-top text-left overflow-hidden" | ||
| placeholder="" | ||
| /> | ||
| </div> | ||
| <div className="flex flex-col items-start w-full mt-[11px] gap-y-[19px]"> | ||
| <p className="text-2xl font-normal">Message</p> | ||
| <textarea | ||
| className="flex w-full h-[231px] px-[23px] py-7 shrink-0 gap-5 rounded-[5px] shadow-searchBarShadow text-lg font-base outline-none" | ||
| value={message} | ||
| onChange={handleMessageChange} | ||
| /> | ||
| </div> | ||
| <div className="mt-[3%] w-[315px] items-center justify-center"> | ||
| <div className="w-[315px] items-center justify-center mt-[11px]"> | ||
| <SubmitContactFormButton /> | ||
| </div> | ||
| </div> | ||
|
|
||
| <div className="flex-grow" /> | ||
| </div> | ||
|
|
||
| <Footer /> | ||
| <div className="mt-[283px]"> | ||
| <Footer /> | ||
| </div> | ||
| </div> | ||
| ); | ||
| } |
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
68 changes: 68 additions & 0 deletions
68
frontend/src/pages/auth/bidders/BidderEmailVerifiedPage.jsx
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,68 @@ | ||
| import React from 'react'; | ||
| import { useNavigate } from 'react-router'; | ||
| import logo from '../../../assets/microvan_logo.svg'; | ||
| import ViewAuctionButton from '../../../components/buttons/ViewAuctionButton'; | ||
|
|
||
| export default function BidderEmailVerifiedPage() { | ||
| const navigate = useNavigate(); | ||
|
|
||
| return ( | ||
| <div className="flex flex-col items-center justify-between min-h-screen min-w-screen bg-mv-white"> | ||
| <div className="self-start pl-[29px] pt-[27px]"> | ||
| <button | ||
| type="button" | ||
| className="text-mv-white text-base font-medium" | ||
| onClick={() => navigate('/')} | ||
| > | ||
| Home | ||
| </button> | ||
| </div> | ||
|
|
||
| <div className="flex-grow" /> | ||
|
|
||
| <div className="flex flex-col w-[70%] items-center justify-center gap-y-[40px]"> | ||
| <div className="flex w-full items-center gap-x-[16px]"> | ||
| <img | ||
| src={logo} | ||
| alt="logo" | ||
| className="flex-shrink-0 w-[70px] h-[70px]" | ||
| /> | ||
| <h1 className="text-mv-green text-[50px] font-normal"> | ||
| YOUR EMAIL HAS BEEN VERIFIED | ||
| </h1> | ||
| </div> | ||
| <p className="text-mv-black text-xl font-normal"> | ||
| Your email has been successfully verified, and you're one step | ||
| closer to participating in our exciting virtual auctions. | ||
| <br /> | ||
| <br /> | ||
| As a reminder, in accordance with the guidelines provided during your | ||
| registration, each participant must submit proof of a ₱100,000 deposit | ||
| before engaging in any auction activities. This deposit is a | ||
| prerequisite for bidding and ensures a secure and fair auction process | ||
| for all our users. | ||
| <br /> | ||
| <br /> | ||
| Upon submission, our team will review your deposit proof. You will be | ||
| notified both via email and on our platform once your deposit has been | ||
| validated, officially clearing you to participate in the auctions. | ||
| <br /> | ||
| <br /> | ||
| Feel free to take a look at our auctions. If you have any questions or | ||
| require assistance, our support team is here to help. | ||
| </p> | ||
| <div className="flex items-center justify-center w-[60%] mt-[34px]"> | ||
| <ViewAuctionButton /> | ||
| </div> | ||
| </div> | ||
|
|
||
| <div className="flex-grow" /> | ||
|
|
||
| <div className="self-center pb-[24px]"> | ||
| <p className="text-mv-green text-lg font-normal"> | ||
| © Microvan Inc. 2024 | ||
| </p> | ||
| </div> | ||
| </div> | ||
| ); | ||
| } |
Oops, something went wrong.