payment-page
parent
fb1c2efdc3
commit
7f5b73d82d
|
@ -29,13 +29,14 @@
|
||||||
</section>
|
</section>
|
||||||
<section class="container mx-auto px-4 xl:px-24 my-16">
|
<section class="container mx-auto px-4 xl:px-24 my-16">
|
||||||
<div class="grid grid-cols-1 lg:grid-cols-2 xl:grid-cols-3 place-items-center my-4 gap-6">
|
<div class="grid grid-cols-1 lg:grid-cols-2 xl:grid-cols-3 place-items-center my-4 gap-6">
|
||||||
<div class="grid grid-rows-2 w-full ">
|
<div class="grid grid-rows-2 w-full h-full">
|
||||||
<div class="grid background place-items-center rounded-lg py-8">
|
<div class="grid background place-items-center rounded-lg py-8">
|
||||||
<h1 class="text-3xl text-white ">Monthly</h1>
|
<h1 class="text-3xl text-white ">Monthly</h1>
|
||||||
</div>
|
</div>
|
||||||
<div class="grid shadow-2xl rounded-b-xl">
|
<div class="grid shadow-2xl rounded-b-xl place-items-center">
|
||||||
<h1 class="text-4xl p-1 text-center">$100</h1>
|
<h1 class="text-4xl p-1 text-center">$100</h1>
|
||||||
<h1 class="text-color-1 text-center">(inclusive of all costs)</h1>
|
<h1 class="text-color-1 text-center">(inclusive of all costs)</h1>
|
||||||
|
<a href="/payment" class="py-2"><button class="shadow-2xl rounded-lg background text-white p-2 px-4 text-lg w-fit">Subscribe Now</button></a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="grid grid-rows-2 w-full">
|
<div class="grid grid-rows-2 w-full">
|
||||||
|
@ -46,6 +47,7 @@
|
||||||
<h1 class="text-4xl p-1"><span class="line-through text-slate-400">$600</span> $540 </h1>
|
<h1 class="text-4xl p-1"><span class="line-through text-slate-400">$600</span> $540 </h1>
|
||||||
<span class="text-lg text-color-2">(10% Discount)</span>
|
<span class="text-lg text-color-2">(10% Discount)</span>
|
||||||
<h1 class="text-color-1 text-center">(inclusive of all costs)</h1>
|
<h1 class="text-color-1 text-center">(inclusive of all costs)</h1>
|
||||||
|
<a href="/payment" class="py-2"><button class="shadow-2xl rounded-lg background text-white p-2 px-4 text-lg w-fit">Subscribe Now</button></a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="grid grid-rows-2 w-full">
|
<div class="grid grid-rows-2 w-full">
|
||||||
|
@ -56,10 +58,11 @@
|
||||||
<h1 class="text-4xl p-1"><span class="line-through text-slate-400">$1200</span> $1020 </h1>
|
<h1 class="text-4xl p-1"><span class="line-through text-slate-400">$1200</span> $1020 </h1>
|
||||||
<span class="text-lg text-color-2">(15% Discount)</span>
|
<span class="text-lg text-color-2">(15% Discount)</span>
|
||||||
<h1 class="text-color-1 text-center">(inclusive of all costs)</h1>
|
<h1 class="text-color-1 text-center">(inclusive of all costs)</h1>
|
||||||
|
<a href="/payment" class="py-2"><button class="shadow-2xl rounded-lg background text-white p-2 px-4 text-lg w-fit">Subscribe Now</button></a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex justify-center my-16"><button class="background text-white p-3 px-6 text-lg rounded-tl-xl rounded-br-xl">Subscribe Now</button></div>
|
<!-- <div class="flex justify-center my-16"><button class="background text-white p-3 px-6 text-lg rounded-tl-xl rounded-br-xl">Subscribe Now</button></div> -->
|
||||||
</section>
|
</section>
|
||||||
<section class="container mx-auto my-16 px-4">
|
<section class="container mx-auto my-16 px-4">
|
||||||
<div class="flex flex-col lg:flex-row place-items-center justify-center xl:px-56">
|
<div class="flex flex-col lg:flex-row place-items-center justify-center xl:px-56">
|
||||||
|
|
|
@ -26,13 +26,14 @@
|
||||||
</section>
|
</section>
|
||||||
<section class="container mx-auto my-16 px-4 xl:px-24">
|
<section class="container mx-auto my-16 px-4 xl:px-24">
|
||||||
<div class="grid grid-cols-1 lg:grid-cols-2 xl:grid-cols-3 place-items-center my-4 gap-x-16 gap-y-6">
|
<div class="grid grid-cols-1 lg:grid-cols-2 xl:grid-cols-3 place-items-center my-4 gap-x-16 gap-y-6">
|
||||||
<div class="grid grid-rows-2 w-full ">
|
<div class="grid grid-rows-2 w-full h-full">
|
||||||
<div class="grid background place-items-center rounded-lg py-8">
|
<div class="grid background place-items-center rounded-lg py-8">
|
||||||
<h1 class="text-3xl text-white ">Monthly</h1>
|
<h1 class="text-3xl text-white ">Monthly</h1>
|
||||||
</div>
|
</div>
|
||||||
<div class="grid shadow-2xl rounded-b-xl">
|
<div class="grid shadow-2xl rounded-b-lg place-items-center">
|
||||||
<h1 class="text-4xl p-1 text-center">$100</h1>
|
<h1 class="text-4xl p-1 text-center">$100</h1>
|
||||||
<h1 class="text-color-1 text-center">(inclusive of all costs)</h1>
|
<h1 class="text-color-1 text-center">(inclusive of all costs)</h1>
|
||||||
|
<a href="/payment" class="py-2"><button class="shadow-2xl rounded-lg background text-white p-2 px-4 text-lg w-fit">Subscribe Now</button></a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="grid grid-rows-2 w-full">
|
<div class="grid grid-rows-2 w-full">
|
||||||
|
@ -43,20 +44,22 @@
|
||||||
<h1 class="text-4xl p-1"><span class="line-through text-slate-400">$600</span> $540 </h1>
|
<h1 class="text-4xl p-1"><span class="line-through text-slate-400">$600</span> $540 </h1>
|
||||||
<span class="text-lg text-color-2">(10% Discount)</span>
|
<span class="text-lg text-color-2">(10% Discount)</span>
|
||||||
<h1 class="text-color-1 text-center">(inclusive of all costs)</h1>
|
<h1 class="text-color-1 text-center">(inclusive of all costs)</h1>
|
||||||
|
<a href="/payment" class="py-2"><button class="shadow-2xl rounded-lg background text-white p-2 px-4 text-lg w-fit">Subscribe Now</button></a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="grid grid-rows-2 w-full">
|
<div class="grid grid-rows-2 w-full">
|
||||||
<div class="grid background place-items-center rounded-lg">
|
<div class="grid background place-items-center rounded-lg">
|
||||||
<h1 class="text-3xl text-white ">Yearly</h1>
|
<h1 class="text-3xl text-white h-fit">Yearly</h1>
|
||||||
</div>
|
</div>
|
||||||
<div class="grid shadow-2xl rounded-b-xl place-items-center">
|
<div class="grid shadow-2xl rounded-b-xl place-items-center">
|
||||||
<h1 class="text-4xl p-1"><span class="line-through text-slate-400">$1200</span> $1020 </h1>
|
<h1 class="text-4xl p-1"><span class="line-through text-slate-400">$1200</span> $1020 </h1>
|
||||||
<span class="text-lg text-color-2">(15% Discount)</span>
|
<span class="text-lg text-color-2">(15% Discount)</span>
|
||||||
<h1 class="text-color-1 text-center">(inclusive of all costs)</h1>
|
<h1 class="text-color-1 text-center">(inclusive of all costs)</h1>
|
||||||
|
<a href="/payment" class="py-2"><button class="shadow-2xl rounded-lg background text-white p-2 px-4 text-lg w-fit">Subscribe Now</button></a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex justify-center my-16"><button class="background text-white p-3 px-6 text-lg rounded-tl-xl rounded-br-xl">Subscribe Now</button></div>
|
<!-- <div class="flex justify-center my-16"><button class="background text-white p-3 px-6 text-lg rounded-tl-xl rounded-br-xl">Subscribe Now</button></div> -->
|
||||||
</section>
|
</section>
|
||||||
<section class="container mx-auto my-16 px-4">
|
<section class="container mx-auto my-16 px-4">
|
||||||
<div class="flex flex-col lg:flex-row place-items-center justify-center xl:px-56">
|
<div class="flex flex-col lg:flex-row place-items-center justify-center xl:px-56">
|
||||||
|
|
|
@ -0,0 +1,5 @@
|
||||||
|
<main>
|
||||||
|
<div>
|
||||||
|
<section></section>
|
||||||
|
</div>
|
||||||
|
</main>
|
Loading…
Reference in New Issue