Skip to content
Snippets Groups Projects

Compare revisions

Changes are shown as if the source revision was being merged into the target revision. Learn more about comparing revisions.

Source

Select target project
No results found

Target

Select target project
  • rithishudayakumar/ompoi
1 result
Show changes
Commits on Source (2)
Hide whitespace changes
Inline Side-by-side
src/components/AgentAssigned.jsx
View file @ 2cd33840
......@@ -7,17 +7,15 @@ const AgentAssigned = () => {
return (
<div className="flex flex-col items-center justify-center min-h-screen bg-[#E9FAFF] py-10 px-6">
<h1 className="absolute top-[130.5px] left-[450px] text-[48.31px] font-bold text-[#030A1E] leading-none">
OMPOI - Seller
</h1>
<div className="bg-white flex flex-row w-[85%] max-w-6xl rounded-3xl shadow-xl overflow-hidden border border-gray-200 p-10 relative">
<h1 className="absolute top-[50.5px] left-[330px] text-[48.31px] font-bold text-[#030A1E] leading-none">OMPOI - Seller</h1>
<div className="absolute top-[132px] left-[304px] w-[120%] max-w-7xl h-[729px] rounded-[32.6px] shadow-[0px_3.91px_11.74px_0px_#2E268414] bg-white flex flex-row overflow-hidden border border-gray-200 p-7">
{/* Left Side - Illustration */}
<div className="hidden md:flex md:w-1/2 items-center justify-center p-6">
<img
src={FrameImage}
alt="Illustration"
className="w-[80%] h-auto cursor-pointer"
className="w-[100%] h-auto cursor-pointer"
onClick={() => navigate("/agent-verified")} // Navigates to AgentVerified.jsx
/>
</div>
......@@ -28,26 +26,36 @@ const AgentAssigned = () => {
<div className="w-full md:w-1/2 flex flex-col justify-center px-8 py-6 relative">
<h2 className="text-3xl font-semibold text-gray-900 mb-6 text-left">Status</h2>
<div className="w-[520px] h-[410px] relative bg-[#FFF1CC] rounded-xl shadow-[6px_6px_0px_0px_rgba(0,0,0,1.00)] overflow-hidden p-7">
<div className="top-[-1%] w-[572px] h-[410px] relative bg-[#FFF1CC] rounded-xl shadow-[6px_6px_0px_0px_rgba(0,0,0,1.00)] overflow-hidden p-7">
{/* Company Name */}
<div className="text-gray-600 text-xl font-medium font-['Montserrat'] leading-loose">Company Name</div>
<div className="text-black text-xl font-semibold font-['Montserrat']">ABCD PVT LTD</div>
<div className="absolute top-[17px] left-[22px] w-[183px] h-[32px] text-[#45505F] text-[22px] font-medium font-['Montserrat'] leading-[31.3px] tracking-[0.13px]">
Company Name
</div>
<div className="absolute top-[57px] left-[44px] w-[154px] h-[32px] text-[#000000] text-[20px] font-semibold font-['Montserrat'] leading-[31.3px] tracking-[0.13px]">
ABCD PVT LTD
</div>
{/* Company Address */}
<div className="text-gray-600 text-xl font-medium font-['Montserrat'] leading-loose">Company Address</div>
<div className="text-black text-xl font-medium font-['Montserrat']">Shop No: 45 ABC Street</div>
<div className="text-black text-xl font-medium font-['Montserrat']">Mylapore</div>
<div className="text-black text-xl font-medium font-['Montserrat']">Chennai - 600004</div>
<div className="absolute top-[100px] left-[28px] w-[206px] h-[32px] text-[#45505F] text-[22px] font-medium font-['Montserrat'] leading-[31.3px] tracking-[0.13px]">
Company Address
</div>
<div className="absolute top-[132px] left-[41px] w-[247px] h-[72px] text-[#000000] text-[20px] font-medium font-['Montserrat'] leading-[100%] tracking-[0.13px]">
Shop No: 45 ABC Street <br />
Mylapore <br />
Chennai - 600004
</div>
{/* Agent Details */}
<div className="text-gray-600 text-xl font-semibold font-['Montserrat'] leading-loose">Agent Details</div>
<div className="text-gray-600 text-xl font-medium font-['Montserrat']">Agent Name</div>
<div className="text-black text-xl font-medium font-['Montserrat']">Gopal M</div>
<div className="text-gray-600 text-xl font-medium font-['Montserrat']">Agent Number</div>
<div className="text-black text-xl font-medium font-['Montserrat']">+91-12345 69870</div>
<div className="absolute top-[219px] left-[33px] w-[206px] h-[32px] text-[#45505F] text-[22px] font-semibold font-['Montserrat'] leading-[31.3px] tracking-[0.13px]">
Agent Details
</div>
<div className="absolute top-[255px] left-[49px] w-[206px] h-[32px] text-[#45505F] text-[22px] font-medium font-['Montserrat'] leading-[31.3px] tracking-[0.13px]">Agent Name</div>
<div className="absolute top-[293px] left-[49px] w-[85px] h-[24px] text-[#000000] text-[20px] font-medium font-['Montserrat'] leading-[100%] tracking-[0.13px]">Gopal M</div>
<div className="absolute top-[325px] left-[49px] w-[206px] h-[32px] text-[#45505F] text-[22px] font-medium font-['Montserrat'] leading-[31.3px] tracking-[0.13px]">Agent Number</div>
<div className="absolute top-[363px] left-[48px] w-[164px] h-[24px] text-[#000000] text-[20px] font-medium font-['Montserrat'] leading-[100%] tracking-[0.13px]">+91-12345 69870</div>
{/* Status Label (Previously Button) */}
<div className="absolute top-[38px] left-[295px] w-[210px] h-[45px] gap-[10px] rounded-full border-2 border-[#FFD255] text-black text-lg font-medium px-[37px] py-[10px] flex items-center justify-center">
<div className="absolute top-[38px] left-[333px] w-[210px] h-[45px] gap-[10px] rounded-full border-4 border-[#FFD255] text-black text-lg font-medium px-[10px] py-[11px] flex items-center justify-center">
Agent Assigned
</div>
</div>
......
src/components/AgentPayment.jsx
View file @ 2cd33840
import React from "react";
import FrameImage from "../assets/images/page6.svg";
import Frame203 from "../assets/images/Frame 203.svg"; // Import the new image
const AgentPayment = () => {
return (
<div className="flex items-center justify-center min-h-screen bg-[#E9FAFF] py-10 px-6">
<h1 className="text-[32px] md:text-[48.31px] font-bold text-[#030A1E] leading-none text-center md:absolute md:top-[130.5px] md:left-[32.2%] md:translate-x-[-50%]">
<div className="flex flex-col items-center justify-center min-h-screen bg-[#E9FAFF] py-10 px-6">
<h1 className="absolute top-[50.5px] left-[330px] text-[48.31px] font-bold text-[#030A1E] leading-none">
OMPOI - Seller
</h1>
{/* Main White Box */}
<div className="bg-white flex flex-row w-[85%] max-w-6xl rounded-3xl shadow-xl overflow-hidden border border-gray-200 p-10 relative">
<div className="absolute top-[132px] left-[304px] w-[120%] max-w-7xl h-[729px] rounded-[32.6px] shadow-[0px_3.91px_11.74px_0px_#2E268414] bg-white flex flex-row overflow-hidden border border-gray-200 p-7">
{/* Left Section - Image */}
<div className="w-1/2 flex items-center justify-center">
<img
src={FrameImage}
alt="Illustration"
className="w-[90%] h-auto cursor-pointer"
/>
<div className="hidden md:flex md:w-1/2 items-center justify-center p-6">
<img src={FrameImage} alt="Illustration" className="w-[100%] h-auto" />
</div>
{/* Vertical Divider */}
<div className="absolute top-[10%] left-[50%] w-[2px] h-[80%] bg-[#E2E7EE]"></div>
{/* Right Section - Status */}
<div className="w-1/2 flex flex-col justify-center px-8 relative">
<h2 className="text-3xl font-semibold text-gray-900 mb-6">Status</h2>
<div className="w-full md:w-1/2 flex flex-col justify-center px-4 md:px-8 py-6 relative">
<h2 className="text-3xl font-semibold text-gray-900 mb-6 text-left">Status</h2>
{/* Status Box */}
<div className="w-[520px] h-[410px] relative bg-[#E9FAFF] rounded-xl shadow-[6px_6px_0px_0px_rgba(0,0,0,1.00)] overflow-hidden p-7">
{/* Company */}
<div className="text-gray-600 text-xl font-medium font-['Montserrat'] leading-loose">Company Name</div>
<div className="text-black text-xl font-semibold font-['Montserrat']">ABCD PVT LTD</div>
<div className="top-[-1%] w-[572px] h-[410px] relative bg-[#E9FAFF] rounded-xl shadow-[6px_6px_0px_0px_rgba(0,0,0,1.00)] overflow-hidden p-7">
<div className="absolute top-[17px] left-[22px] w-[183px] h-[32px] text-[#45505F] text-[22px] font-medium font-['Montserrat'] leading-[31.3px] tracking-[0.13px]">
Company Name
</div>
<div className="absolute top-[57px] left-[44px] w-[154px] h-[32px] text-[#000000] text-[20px] font-semibold font-['Montserrat'] leading-[31.3px] tracking-[0.13px]">
ABCD PVT LTD
</div>
<div className="text-gray-600 text-xl font-medium font-['Montserrat'] leading-loose">Company Address</div>
<div className="text-black text-xl font-medium font-['Montserrat']">Shop No: 45 ABC Street</div>
<div className="text-black text-xl font-medium font-['Montserrat']">Mylapore</div>
<div className="text-black text-xl font-medium font-['Montserrat']">Chennai - 600004</div>
<div className="absolute top-[100px] left-[28px] w-[206px] h-[32px] text-[#45505F] text-[22px] font-medium font-['Montserrat'] leading-[31.3px] tracking-[0.13px]">
Company Address
</div>
<div className="absolute top-[132px] left-[41px] w-[247px] h-[72px] text-[#000000] text-[20px] font-medium font-['Montserrat'] leading-[100%] tracking-[0.13px]">
Shop No: 45 ABC Street <br />
Mylapore <br />
Chennai - 600004
</div>
{/* Merchant ID */}
<div className="absolute top-[238px] left-[135px] w-[298px] h-[32px] text-[#45505F] text-[22px] font-medium font-['Montserrat'] leading-[31.3px] tracking-[0.13px]">
<div className="absolute top-[240px] left-[167px] w-[298px] h-[32px] text-[#45505F] text-[22px] font-medium font-['Montserrat'] leading-[31.3px] tracking-[0.13px]">
Merchant ID: <span className="font-semibold">TAMIL12345</span>
</div>
{/* Verified Badge */}
<div className="absolute top-[30px] left-[350px] w-[156px] h-[45px] text-[#101418] text-[20px] font-medium font-['Montserrat'] leading-[100%] tracking-[0px] gap-[10px] rounded-full border-2 border-[#0096FF] px-[35px] py-[10px]">
Verified
</div>
{/* Login Message */}
<div className="absolute top-[278px] left-[95px] w-[392px] h-[24px] text-[#000000] text-[20px] font-medium font-['Montserrat'] leading-[100%] tracking-[0.13px] text-center">
<div className="absolute top-[285px] left-[131px] w-[392px] h-[24px] text-[#000000] text-[20px] font-medium font-['Montserrat'] leading-[100%] tracking-[0.13px] text-center">
Login to your account to get started
</div>
{/* Verified Badge */}
<div className="absolute top-[20px] left-[375px] w-[156px] h-[45px] text-[#101418] text-[20px] font-medium font-['Montserrat'] leading-[100%] tracking-[0px] gap-[10px] rounded-full border-2 border-[#0096FF] px-[35px] py-[10px]">
Verified
</div>
{/* Login Button */}
<div className="absolute top-[340px] left-[184px] w-[241px] h-[45px] gap-[10px] rounded-full bg-[#0096FF] text-white text-lg font-semibold flex items-center justify-center shadow-md hover:bg-blue-700 transition px-[37px] py-[10px]">
<button className="w-full h-full">Login Now</button>
<div className="absolute top-[330px] left-[207px] w-[241px] h-[45px] gap-[10px] rounded-full bg-[#0096FF] text-white text-lg font-semibold shadow-md hover:bg-blue-700 transition flex items-center justify-center px-[37px] py-[10px]">
<button className="w-full h-full">
Login Now
</button>
</div>
</div>
</div>
</div>
{/* Payment Details */}
<div className="absolute top-[407px] left-[1250px] w-[190px] h-[32px] text-[#45505F] text-[22px] font-semibold font-['Montserrat'] leading-[31.3px] tracking-[0.13px]">
<div className="absolute top-[408px] left-[1315px] w-[190px] h-[32px] text-[#45505F] text-[22px] font-semibold font-['Montserrat'] leading-[31.3px] tracking-[0.13px]">
Payment Details
</div>
{/* Payment ID */}
<div className="absolute top-[446px] left-[1269px] w-[206px] h-[32px] text-[#45505F] text-[22px] font-medium font-['Montserrat'] leading-[31.3px] tracking-[0.13px]">
<div className="absolute top-[443px] left-[1330px] w-[206px] h-[32px] text-[#45505F] text-[22px] font-medium font-['Montserrat'] leading-[31.3px] tracking-[0.13px]">
Payment ID
</div>
{/* Payment ID Value */}
<div className="absolute top-[500px] left-[1251px] w-[246px] h-[24px] text-[#000000] text-[20px] font-medium font-['Montserrat'] leading-[100%] tracking-[0.13px]">
ATUWBYTY1245678HBG
<div className="absolute top-[485px] left-[1333px] w-[246px] h-[24px] text-[#000000] text-[20px] font-medium font-['Montserrat'] leading-[100%] tracking-[0.13px]">
ATUW1245678HBG
</div>
</div>
);
};
......
src/components/AgentStatus.jsx
View file @ 2cd33840
......@@ -7,46 +7,56 @@ const AgentStatus = () => {
return (
<div className="flex flex-col items-center justify-center min-h-screen bg-[#E9FAFF] py-10 px-6">
<h1 className="absolute top-[130.5px] left-[450px] text-[48.31px] font-bold text-[#030A1E] leading-none">OMPOI - Seller</h1>
<div className="bg-white flex flex-row w-[85%] max-w-6xl rounded-3xl shadow-xl overflow-hidden border border-gray-200 p-10 relative">
<h1 className="absolute top-[50.5px] left-[330px] text-[48.31px] font-bold text-[#030A1E] leading-none">OMPOI - Seller</h1>
<div className="absolute top-[132px] left-[304px] w-[120%] max-w-7xl h-[729px] rounded-[32.6px] shadow-[0px_3.91px_11.74px_0px_#2E268414] bg-white flex flex-row overflow-hidden border border-gray-200 p-7">
{/* Left Side - Illustration */}
<div className="hidden md:flex md:w-1/2 items-center justify-center p-6">
<img
src={FrameImage}
alt="Illustration"
className="w-[90%] h-auto cursor-pointer"
<img
src={FrameImage}
alt="Illustration"
className="w-[100%] h-auto cursor-pointer"
onClick={() => navigate("/agent-assigned")}
/>
</div>
{/* Vertical Divider */}
<div className="absolute top-[10%] left-[50%] w-[2px] h-[80%] bg-[#E2E7EE]"></div>
<div className="absolute top-[12%] left-[50%] w-[2px] h-[80%] bg-[#E2E7EE]"></div>
{/* Right Side - Status Section */}
<div className="w-full md:w-1/2 flex flex-col justify-center px-8 py-6 relative">
<h2 className="text-3xl font-semibold text-gray-900 mb-6 text-left">Status</h2>
<div className="w-[520px] h-[410px] relative bg-[#FFF1CC] rounded-xl shadow-[6px_6px_0px_0px_rgba(0,0,0,1.00)] overflow-hidden p-7">
<div className="top-[-1%] w-[572px] h-[410px] relative bg-[#FFF1CC] rounded-2xl shadow-[6px_6px_0px_0px_rgba(0,0,0,1.00)] overflow-hidden p-7">
{/* Company Name */}
<div className="text-gray-600 text-xl font-medium font-['Montserrat'] leading-loose">Company Name</div>
<div className="text-black text-xl font-semibold font-['Montserrat']">ABCD PVT LTD</div>
<div className="absolute top-[17px] left-[22px] w-[183px] h-[32px] text-[#45505F] text-[22px] font-medium font-['Montserrat'] leading-[31.3px] tracking-[0.13px]">
Company Name
</div>
<div className="absolute top-[57px] left-[44px] w-[154px] h-[32px] text-[#000000] text-[20px] font-semibold font-['Montserrat'] leading-[31.3px] tracking-[0.13px]">
ABCD PVT LTD
</div>
{/* Company Address */}
<div className="text-gray-600 text-xl font-medium font-['Montserrat'] leading-loose">Company Address</div>
<div className="text-black text-xl font-medium font-['Montserrat']">Shop No: 45 ABC Street</div>
<div className="text-black text-xl font-medium font-['Montserrat']">Mylapore</div>
<div className="text-black text-xl font-medium font-['Montserrat']">Chennai - 600004</div>
<div className="absolute top-[100px] left-[28px] w-[206px] h-[32px] text-[#45505F] text-[22px] font-medium font-['Montserrat'] leading-[31.3px] tracking-[0.13px]">
Company Address
</div>
<div className="absolute top-[132px] left-[41px] w-[247px] h-[72px] text-[#000000] text-[20px] font-medium font-['Montserrat'] leading-[100%] tracking-[0.13px]">
Shop No: 45 ABC Street <br />
Mylapore <br />
Chennai - 600004
</div>
{/* Agent Details */}
<div className="text-gray-600 text-xl font-semibold font-['Montserrat'] leading-loose">Agent Details</div>
<div className="text-gray-600 text-xl font-medium font-['Montserrat']">Agent Name</div>
<div className="text-black text-xl font-medium font-['Montserrat']">Gopal M</div>
<div className="text-gray-600 text-xl font-medium font-['Montserrat']">Agent Number</div>
<div className="text-black text-xl font-medium font-['Montserrat']">+91-12345 69870</div>
<div className="absolute top-[219px] left-[33px] w-[206px] h-[32px] text-[#45505F] text-[22px] font-semibold font-['Montserrat'] leading-[31.3px] tracking-[0.13px]">
Agent Details
</div>
<div className="absolute top-[255px] left-[49px] w-[206px] h-[32px] text-[#45505F] text-[22px] font-medium font-['Montserrat'] leading-[31.3px] tracking-[0.13px]">Agent Name</div>
<div className="absolute top-[293px] left-[49px] w-[85px] h-[24px] text-[#000000] text-[20px] font-medium font-['Montserrat'] leading-[100%] tracking-[0.13px]">Gopal M</div>
<div className="absolute top-[325px] left-[49px] w-[206px] h-[32px] text-[#45505F] text-[22px] font-medium font-['Montserrat'] leading-[31.3px] tracking-[0.13px]">Agent Number</div>
<div className="absolute top-[363px] left-[48px] w-[164px] h-[24px] text-[#000000] text-[20px] font-medium font-['Montserrat'] leading-[100%] tracking-[0.13px]">+91-12345 69870</div>
{/* Status Badge - Pending Label */}
<div className="absolute top-12 right-4">
<span className="px-9 py-1 rounded-full border-2 border-[#FFD255] text-black text-lg font-medium">
<span className="px-11 py-2 rounded-full border-4 border-[#FFD255] text-black text-lg font-medium">
Pending
</span>
</div>
......
src/components/AgentVerified.jsx
View file @ 2cd33840
......@@ -8,14 +8,14 @@ const AgentVerified = () => {
return (
<div className="flex items-center justify-center min-h-screen bg-[#E9FAFF] py-10 px-6">
{/* Main White Box */}
<div className="bg-white flex flex-row w-[85%] max-w-6xl rounded-3xl shadow-xl overflow-hidden border border-gray-200 p-10 relative">
<div className="absolute top-[132px] left-[304px] w-[120%] max-w-7xl h-[729px] rounded-[32.6px] shadow-[0px_3.91px_11.74px_0px_#2E268414] bg-white flex flex-row overflow-hidden border border-gray-200 p-7">
{/* Left Section - Image */}
<div className="w-1/2 flex items-center justify-center">
<img
src={FrameImage}
alt="Illustration"
className="w-[90%] h-auto cursor-pointer"
className="w-[100%] h-auto cursor-pointer"
/>
</div>
......@@ -27,38 +27,49 @@ const AgentVerified = () => {
<h2 className="text-3xl font-semibold text-gray-900 mb-6">Status</h2>
{/* Status Box */}
<div className="w-[520px] h-[410px] relative bg-[#CEFFCC] rounded-xl shadow-[6px_6px_0px_0px_rgba(0,0,0,1.00)] overflow-hidden p-7">
{/* Company */}
<div className="text-gray-600 text-xl font-medium font-['Montserrat'] leading-loose">Company Name</div>
<div className="text-black text-xl font-semibold font-['Montserrat']">ABCD PVT LTD</div>
<div className="text-gray-600 text-xl font-medium font-['Montserrat'] leading-loose">Company Address</div>
<div className="text-black text-xl font-medium font-['Montserrat']">Shop No: 45 ABC Street</div>
<div className="text-black text-xl font-medium font-['Montserrat']">Mylapore</div>
<div className="text-black text-xl font-medium font-['Montserrat']">Chennai - 600004</div>
<div className="top-[-1%] w-[572px] h-[410px] relative bg-[#CEFFCC] rounded-xl shadow-[6px_6px_0px_0px_rgba(0,0,0,1.00)] overflow-hidden p-7">
{/* Company Name */}
<div className="absolute top-[17px] left-[22px] w-[183px] h-[32px] text-[#45505F] text-[22px] font-medium font-['Montserrat'] leading-[31.3px] tracking-[0.13px]">
Company Name
</div>
<div className="absolute top-[57px] left-[44px] w-[154px] h-[32px] text-[#000000] text-[20px] font-semibold font-['Montserrat'] leading-[31.3px] tracking-[0.13px]">
ABCD PVT LTD
</div>
{/* Company Address */}
<div className="absolute top-[100px] left-[28px] w-[206px] h-[32px] text-[#45505F] text-[22px] font-medium font-['Montserrat'] leading-[31.3px] tracking-[0.13px]">
Company Address
</div>
<div className="absolute top-[132px] left-[41px] w-[247px] h-[72px] text-[#000000] text-[20px] font-medium font-['Montserrat'] leading-[100%] tracking-[0.13px]">
Shop No: 45 ABC Street <br />
Mylapore <br />
Chennai - 600004
</div>
{/* Verified By */}
<div className="absolute top-[219px] left-[33px] w-[125px] h-[32px] text-[#45505F] text-[22px] font-semibold font-['Montserrat'] leading-[31.3px] tracking-[0.13px]">Verified By</div>
{/* Agent Name */}
<div className="absolute top-[219px] left-[33px] w-[125px] h-[32px] text-[#45505F] text-[22px] font-semibold font-['Montserrat'] leading-[31.3px] tracking-[0.13px]">
Verified By
</div>
<div className="absolute top-[255px] left-[49px] w-[206px] h-[32px] text-[#45505F] text-[22px] font-medium font-['Montserrat'] leading-[31.3px] tracking-[0.13px]">Agent Name</div>
<div className="absolute top-[293px] left-[49px] w-[85px] h-[24px] text-[#000000] text-[20px] font-medium font-['Montserrat'] leading-[100%] tracking-[0.13px]">Gopal M</div>
<div className="absolute top-[325px] left-[49px] w-[206px] h-[32px] text-[#45505F] text-[22px] font-medium font-['Montserrat'] leading-[31.3px] tracking-[0.13px]">Agent Number</div>
<div className="absolute top-[363px] left-[48px] w-[164px] h-[24px] text-[#000000] text-[20px] font-medium font-['Montserrat'] leading-[100%] tracking-[0.13px]">+91-12345 69870</div>
{/* Verified Badge */}
<div className="absolute top-[40px] left-[333px] w-[156px] h-[45px] text-[#101418] text-[20px] font-medium font-['Montserrat'] leading-[100%] tracking-[0px] gap-[10px] rounded-full border-2 border-[#22CA00] px-[35px] py-[10px]">
<div className="absolute top-[40px] left-[388px] w-[156px] h-[45px] text-[#101418] text-[20px] font-medium font-['Montserrat'] leading-[100%] tracking-[0px] gap-[10px] rounded-full border-2 border-[#22CA00] px-[35px] py-[10px]">
Verified
</div>
{/* Payment Section */}
<div className="absolute top-[160px] left-[280px] w-[237px] h-[63px] text-[#45505F] text-[22px] font-semibold font-['Montserrat'] leading-[31.3px] tracking-[0.13px] text-center">
<div className="absolute top-[145px] left-[313px] w-[237px] h-[63px] text-[#45505F] text-[22px] font-semibold font-['Montserrat'] leading-[31.3px] tracking-[0.13px] text-center">
Pay Now To Get Your Merchant ID
</div>
<div className="absolute top-[226px] left-[295px] w-[211px] h-[40px] gap-[21px] rounded-full bg-[#22CA00] text-white text-lg font-semibold-[37px] py-20px] flex items-center justify-center shadow-md hover:bg-green-700 transition">
<div className="absolute top-[209px] left-[325px] w-[211px] h-[40px] gap-[21px] rounded-full bg-[#22CA00] text-white text-lg font-semibold-[37px] py-20px] flex items-center justify-center shadow-md hover:bg-green-700 transition">
<button
onClick={() => navigate("/agent-payment")}
className="w-full h-full"
className="w-full h-full text-[#FFFFFF] text-[20.91px] font-medium font-['Montserrat'] leading-[100%] tracking-[0px] text-center"
style={{ width: '94px', height: '25px' }}
>
Pay Now
</button>
......@@ -67,7 +78,7 @@ const AgentVerified = () => {
</div>
</div>
<h1 className="text-[32px] md:text-[48.31px] font-bold text-[#030A1E] leading-none text-center md:absolute md:top-[130.5px] md:left-[32.2%] md:translate-x-[-50%]">OMPOI - Seller</h1>
<h1 className="absolute top-[50.5px] left-[330px] text-[48.31px] font-bold text-[#030A1E] leading-none">OMPOI - Seller</h1>
</div>
);
};
......
src/components/LoginPage.jsx
View file @ 2cd33840
......@@ -29,11 +29,11 @@ const LoginPage = () => {
return (
<div className="flex flex-col items-center justify-center min-h-screen bg-[#E9FAFF] py-10 px-6">
<h1 className="absolute top-[130.5px] left-[450px] text-[48.31px] font-bold text-[#030A1E] leading-none">OMPOI - Seller</h1>
<div className="bg-white flex flex-row w-[85%] max-w-6xl rounded-3xl shadow-xl overflow-hidden border border-gray-200 p-10 relative">
<h1 className="absolute top-[50.5px] left-[330px] text-[48.31px] font-bold text-[#030A1E] leading-none">OMPOI - Seller</h1>
<div className="absolute top-[132px] left-[304px] w-[120%] max-w-7xl h-[729px] rounded-[32.6px] shadow-[0px_3.91px_11.74px_0px_#2E268414] bg-white flex flex-row overflow-hidden border border-gray-200 p-7">
{/* Left Side - Illustration */}
<div className="hidden md:flex md:w-1/2 items-center justify-center p-6">
<img src={FrameImage} alt="Illustration" className="w-[90%] h-auto" />
<img src={FrameImage} alt="Illustration" className="w-[100%] h-auto" />
</div>
{/* Vertical Divider */}
......
src/components/StatusPage.jsx
View file @ 2cd33840
......@@ -7,15 +7,17 @@ const StatusPage = () => {
return (
<div className="flex flex-col items-center justify-center min-h-screen bg-[#E9FAFF] py-10 px-6">
<h1 className="absolute top-[130.5px] left-[450px] text-[48.31px] font-bold text-[#030A1E] leading-none">OMPOI - Seller</h1>
<h1 className="absolute top-[50.5px] left-[330px] text-[48.31px] font-bold text-[#030A1E] leading-none">OMPOI - Seller</h1>
<div className="bg-white flex flex-row w-[85%] max-w-6xl rounded-3xl shadow-xl overflow-hidden border border-gray-200 p-10 relative">
{/* Main White Box */}
<div className="absolute top-[132px] left-[304px] w-[120%] max-w-7xl h-[729px] rounded-[32.6px] shadow-[0px_3.91px_11.74px_0px_#2E268414] bg-white flex flex-row overflow-hidden border border-gray-200 p-7">
{/* Left Side - Illustration */}
<div className="hidden md:flex md:w-1/2 items-center justify-center p-6">
<div className="hidden md:flex md:w-1/2 items-center justify-end p-6 pr-16">
<img
src={FrameImage}
alt="Illustration"
className="w-[90%] h-auto cursor-pointer"
className="w-[100%] h-auto cursor-pointer"
onClick={() => navigate("/agent-status")}
/>
</div>
......@@ -25,12 +27,12 @@ const StatusPage = () => {
{/* Right Side - Status Section */}
<div className="w-full md:w-1/2 flex flex-col justify-center px-4 md:px-8 py-6 relative">
<h2 className="text-2xl md:text-3xl font-semibold text-gray-900 mb-6 text-center md:text-left">Status</h2>
<h2 className="text-3xl font-semibold text-gray-900 mb-20 text-left">Status</h2>
{/* Status Box */}
<div className="w-[520px] h-[333px] relative bg-[#F9A78D] rounded-xl shadow-[6px_6px_0px_0px_rgba(0,0,0,1.00)] overflow-hidden p-7">
<div className="absolute right-4 top-4 md:right-6 md:top-[37px]">
<div className="w-32 md:w-40 h-9 md:h-11 rounded-[50px] outline outline-[3px] outline-offset-[-3px] outline-[#FF3D00] flex items-center justify-center">
<div className="top-[-12%] w-[572px] h-[305px] relative bg-[#F9A78D] rounded-2xl shadow-[6px_6px_0px_0px_rgba(0,0,0,1.00)] overflow-hidden p-5">
<div className="absolute right-10 top-4 md:right-6 md:top-[37px]">
<div className="w-40 md:w-40 h-9 md:h-11 rounded-[50px] outline outline-[3px] outline-offset-[-3px] outline-[#FF3D00] flex items-center justify-center">
<span className="text-[#101418] text-base md:text-[21.81px] font-medium font-['Montserrat']">
Pending
</span>
......@@ -72,6 +74,6 @@ const StatusPage = () => {
</div>
</div>
);
};
};
export default StatusPage;
\ No newline at end of file