Skip to content

Commit

Permalink
Merge pull request #1367 from Tanmay-Mirgal/main
Browse files Browse the repository at this point in the history
Confirmation page is Done
  • Loading branch information
codervivek5 authored Jun 16, 2024
2 parents cadb472 + 90a679b commit dd784f2
Show file tree
Hide file tree
Showing 8 changed files with 69 additions and 0 deletions.
Binary file added Front-with-React/VigyBag/src/assets/TUMBLER.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added Front-with-React/VigyBag/src/assets/cancel.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added Front-with-React/VigyBag/src/assets/confirm.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added Front-with-React/VigyBag/src/assets/tick.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
33 changes: 33 additions & 0 deletions Front-with-React/VigyBag/src/pages/Cancellation/Cancellation.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
import React from 'react';
import cancel from '../../assets/cancel.png';

const CancellationPage = () => {
return (
<div className="min-h-screen bg-[#FAEBD7] flex flex-col items-center justify-center">

<main className="bg-[#FFF5EE] p-10 rounded-lg shadow-lg text-center max-w-3xl mx-auto mt-6"style={{border:'2px solid #3779edff'}}>
<div className="mb-6">
<img src={cancel} alt="Sad Box" className="mx-auto mb-4" style={{width: '250px',borderRadius:'50%'}} />
<h1 className="text-3xl font-bold text-green-900">Are you sure you want to cancel?</h1>
</div>
<p className="text-gray-700 mb-6">
Sorry to see you cancel. Please tell us the reason and we will try to make your
shopping experience better! It may take a few days to return. Please wait patiently.
</p>
<div className="mb-6">
<textarea
className="w-full p-4 rounded-lg border border-gray-300 resize-none h-32 bg-[#686469ff] text-white"
placeholder="Please tell us the reason."
/>
</div>
<button className="bg-[#ad8c74ff] text-white py-2 px-6 rounded-lg hover:bg-brown-700 transition-colors duration-300">
Cancel Order
</button>
</main>

</div>

);
};

export default CancellationPage;
36 changes: 36 additions & 0 deletions Front-with-React/VigyBag/src/pages/Confirmation/Confirmation.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
import React from 'react';
import { FaInstagram, FaTwitter, FaLinkedin, FaFacebook } from 'react-icons/fa';
import confirm from '../../assets/confirm.png'
import { NavLink } from 'react-router-dom';

const ConfirmationPage = () => {
return (
<div className="min-h-screen bg-[#FAEBD7] flex flex-col items-center justify-center">
<main className="bg-[#FFF5EE] p-10 rounded-lg shadow-lg text-center max-w-3xl mx-auto" style={{border:'4px solid #605d61ff'}}>
<div className="">
<div style={{width: '120px',height: '120px',backgroundColor:'#605d61ff',display:'flex',alignItems:'center',borderRadius:'50%'
,position:'relative',padding:'5px',boxShadow:'0 0 10px #605d61ff',top:'-14vh'}}className="mx-auto" >
<img src={confirm} alt="Confirmation" className="mx-auto " style={{width: '80px'}} />
</div>

<h1 className="text-3xl font-bold text-green-900 relative "style={{top:'-8vh'}}>Thank you for Shopping!</h1>
</div>
<p className="text-gray-700 mb-6 relative"style={{top:'-5vh'}}>
We are getting started on your order right away, and you will receive an order
confirmation email that has been sent. In the meantime, explore the latest fashion
and get inspired by new trends, just head over to
<NavLink to="/" className="text-green-700 underline ml-1">VigyBag homepage</NavLink>.

</p>
<div className="flex justify-center space-x-4 relative"style={{top:'-4vh'}}>
<a href="#" className="text-gray-700 hover:text-green-700"><FaInstagram /></a>
<a href="#" className="text-gray-700 hover:text-green-700"><FaTwitter /></a>
<a href="#" className="text-gray-700 hover:text-green-700"><FaLinkedin /></a>
<a href="#" className="text-gray-700 hover:text-green-700"><FaFacebook /></a>
</div>
</main>
</div>
);
};

export default ConfirmationPage;

0 comments on commit dd784f2

Please sign in to comment.