Skip to content

Commit

Permalink
updated ui
Browse files Browse the repository at this point in the history
  • Loading branch information
ThakareSakshi committed Nov 18, 2023
1 parent fbbd20d commit 06b240b
Show file tree
Hide file tree
Showing 2 changed files with 83 additions and 217 deletions.
22 changes: 11 additions & 11 deletions Amit_Kumar/dist/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@
<link rel="stylesheet" href="./output.css">
</head>
<body class="overflow-x-hidden">
<nav class="bg-zinc-800 w-full h-20 flex items-center gap-2 px-5 md:px-20">
<nav class="bg-pink-300 w-full h-20 flex items-center gap-2 px-5 md:px-20 ">
<div class="flex items-center justify-between gap-2">
<img src="./images.png" alt="" class="w-16 h-16 rounded-lg object-cover">
<div class="flex flex-col h-14 items-start justify-start">
Expand All @@ -39,77 +39,77 @@ <h1 class="text-zinc-100 font-sans text-2xl -mt-2">RazorePay</h1>
<img src="https://yourstore.io/readymade-ecommerce-website/assets/img/readymade-banner/Ready-Ecommerce-Design.jpg" alt="">
</nav>
<main class="w-full h-auto bg-zinc-50 flex flex-col justify-between md:flex md:flex-row md:flex-wrap md:overflow-x-hidden md:px-36">
<div class="w-full h-64 flex flex-col gap-1 bg-zinc-300 md:w-60 mt-3 ">
<div class="w-full max-h-fit flex flex-col gap-1 bg-white md:w-60 mt-3 p-4 shadow-sm shadow-gray-400">
<img src="https://m.media-amazon.com/images/I/71MaGTXl7ML._SY879_.jpg" alt="" class="w-full h-40 object-cover ">
<h4 class="mx-2">Lymio Casual Shirt</h4>
<p id="price" data-id="0" class="mx-2">379.00</p>
<button class="pay-button bg-emerald-500 mx-2 w-20 rounded-md" id="rzp-button1" data-id="0">Pay</button>

</div>

<div class="w-full h-64 flex flex-col gap-1 bg-zinc-300 md:w-60 mt-3 ">
<div class="w-full max-h-fit flex flex-col gap-1 bg-white md:w-60 mt-3 p-4 shadow-sm shadow-gray-400">
<img src="https://m.media-amazon.com/images/I/51mBX9mEgpL._SX679_.jpg" alt="" class="w-full h-40 object-cover ">
<h4 class="mx-2">Fastrack Men's Watch</h4>
<p id="price" data-id="1" class="mx-2">1850.00</p>
<button class="pay-button bg-emerald-500 mx-2 w-20 rounded-md" id="rzp-button1" data-id="1">Pay</button>

</div>
<div class="w-full h-64 flex flex-col gap-1 bg-zinc-300 md:w-60 mt-3 ">
<div class="w-full max-h-fit flex flex-col gap-1 bg-white md:w-60 mt-3 p-4 shadow-sm shadow-gray-400">
<img src="https://m.media-amazon.com/images/I/51PdiF8O0VS._SY695_.jpg" alt="" class="w-full h-40 object-cover ">
<h4 class="mx-2">NIKE Men's Shoes</h4>
<p id="price" data-id="2" class="mx-2">18500.00</p>
<button class="pay-button bg-emerald-500 mx-2 w-20 rounded-md" id="rzp-button1" data-id="2">Pay</button>

</div>

<div class="w-full h-64 flex flex-col gap-1 bg-zinc-300 md:w-60 mt-3 ">
<div class="w-full max-h-fit flex flex-col gap-1 bg-white md:w-60 mt-3 p-4 shadow-sm shadow-gray-400">
<img src="https://rukminim2.flixcart.com/image/416/416/k02qnww0/musical-toy/q/c/f/talking-tom-cat-toy-for-kids-speaking-repeats-what-you-say-best-original-imafjy42wqevr2db.jpeg?q=70" alt="" class="w-full h-40 object-cover ">
<h4 class="mx-2">Tom Cat Toy for Kids </h4>
<p id="price" data-id="3" class="mx-2">250.00</p>
<button class="pay-button bg-emerald-500 mx-2 w-20 rounded-md" id="rzp-button1" data-id="3">Pay</button>

</div>

<div class="w-full h-64 flex flex-col gap-1 bg-zinc-300 md:w-60 mt-3 ">
<div class="w-full max-h-fit flex flex-col gap-1 bg-white md:w-60 mt-3 p-4 shadow-sm shadow-gray-400">
<img src="https://rukminim2.flixcart.com/image/416/416/xif0q/gag-toy/4/y/t/fun-element-toys-cartoon-car-trendy-handy-original-imagg9cz9qfzzseb.jpeg?q=70" alt="" class="w-full h-40 object-cover ">
<h4 class="mx-2">Cartoon Car Gag Toy </h4>
<p id="price" data-id="4" class="mx-2">200.00</p>
<button class="pay-button bg-emerald-500 mx-2 w-20 rounded-md" id="rzp-button1" data-id="4">Pay</button>

</div>

<div class="w-full h-64 flex flex-col gap-1 bg-zinc-300 md:w-60 mt-3 ">
<div class="w-full max-h-fit flex flex-col gap-1 bg-white md:w-60 mt-3 p-4 shadow-sm shadow-gray-400 ">
<img src="https://rukminim2.flixcart.com/image/832/832/kqgyhe80/jean/u/j/d/34-knee-black-jeans-creatywitty-original-imag4guynzg2fgqt.jpeg?q=70" alt="" class="w-full h-40 object-cover ">
<h4 class="mx-2">Men Black Jeans</h4>
<p id="price" data-id="5" class="mx-2">500.00</p>
<button class="pay-button bg-emerald-500 mx-2 w-20 rounded-md" id="rzp-button1" data-id="5">Pay</button>

</div>

<div class="w-full h-64 flex flex-col gap-1 bg-zinc-300 md:w-60 mt-3 ">
<div class="w-full max-h-fit flex flex-col gap-1 bg-white md:w-60 mt-3 p-4 shadow-sm shadow-gray-400">
<img src="https://m.media-amazon.com/images/I/31Q14qzdoZL._SX300_SY300_QL70_FMwebp_.jpg" alt="" class="w-full h-40 object-cover ">
<h4 class="mx-2">Apple iPhone 15</h4>
<p id="price" data-id="6" class="mx-2">85000.00</p>
<button class="pay-button bg-emerald-500 mx-2 w-20 rounded-md" id="rzp-button1" data-id="6">Pay</button>

</div>

<div class="w-full h-64 flex flex-col gap-1 bg-zinc-300 md:w-60 mt-3 ">
<div class="w-full max-h-fit flex flex-col gap-1 bg-white md:w-60 mt-3 p-4 shadow-sm shadow-gray-400">
<img src="https://m.media-amazon.com/images/I/71-0-6qzwxL._SY741_.jpg" alt="" class="w-full h-40 object-cover ">
<h4 class="mx-2">LEWEL Men's Stylish Back</h4>
<p id="price" data-id="7" class="mx-2">384.00</p>
<button class="pay-button bg-emerald-500 mx-2 w-20 rounded-md" id="rzp-button1" data-id="7">Pay</button>

</div>
<div class="w-full h-64 flex flex-col gap-1 bg-zinc-300 md:w-60 mt-3 ">
<div class="w-full max-h-fit flex flex-col gap-1 bg-white md:w-60 mt-3 p-4 shadow-sm shadow-gray-400">
<img src="https://rukminim2.flixcart.com/image/416/416/knyxqq80/dslr-camera/r/y/x/digital-camera-eos-m50-mark-ii-eos-m50-mark-ii-canon-original-imag2gzkexzqhyhu.jpeg?q=70" alt="" class="w-full h-40 object-cover ">
<h4 class="mx-2">Canon EOS M50 Mark</h4>
<p id="price" data-id="8" class="mx-2">38450.00</p>
<button class="pay-button bg-emerald-500 mx-2 w-20 rounded-md" id="rzp-button1" data-id="8">Pay</button>

</div>

<div class="w-full h-64 flex flex-col gap-1 bg-zinc-300 md:w-60 mt-3 ">
<div class="w-full max-h-fit flex flex-col gap-1 bg-white md:w-60 mt-3 p-4 shadow-sm shadow-gray-400">
<img src="https://rukminim2.flixcart.com/image/416/416/xif0q/computer/k/f/a/-original-imagsnzbvumjadck.jpeg?q=70" alt="" class="w-full h-40 object-cover ">
<h4 class="mx-2">HP Victus Gaming Ryzen</h4>
<p id="price" data-id="9" class="mx-2">52000.00</p>
Expand Down
Loading

0 comments on commit 06b240b

Please sign in to comment.