add and update

master
mahdi andalib 3 years ago
parent 0a332106ee
commit c87ab6c529
  1. 60
      src/components/Digikala/Offer.js
  2. BIN
      src/components/Digikala/belt-bag.jpg
  3. BIN
      src/components/Digikala/camera.jpg
  4. BIN
      src/components/Digikala/mouse.jpg
  5. BIN
      src/components/Digikala/o2.jpg
  6. BIN
      src/components/Digikala/o3.jpg
  7. BIN
      src/components/Digikala/oloom4.jpg
  8. BIN
      src/components/Digikala/r1.jpg
  9. BIN
      src/components/Digikala/r2.jpg
  10. BIN
      src/components/Digikala/radio.jpg
  11. BIN
      src/components/Digikala/shampoo.jpg

@ -3,21 +3,27 @@ import React from "react";
import leftArrow from "./white-left-arrow.svg"; import leftArrow from "./white-left-arrow.svg";
import General from "./General.png"; import General from "./General.png";
const Offer = () => { import oloom4 from "./oloom4.jpg";
import o2 from "./o2.jpg";
import o3 from "./o3.jpg";
import r1 from "./r1.jpg";
import r2 from "./r2.jpg";
const Offer = ({ products }) => {
return ( return (
<section <section
className="my-10 w-7/12 mx-auto rounded-2xl p-5" className="my-10 w-8/12 mx-auto rounded-2xl p-5"
style={{ backgroundColor: "#ef3a4f" }} style={{ backgroundColor: "#ef3a4f" }}
> >
<div className="bg-orange-300"> <div className="flex flex-row items-center p-2">
{/* right */} {/* right */}
<div className="flex flex-col items-center justify-center bg-yellow-300"> <div className="flex flex-col items-center justify-between bg-blue-400 w-2/12">
<span className="text-base text-center text-white font-bold"> <span className="text-base text-center text-white font-bold leading-8">
پیشنهاد پیـــــشنهاد
<br /> <br />
شگفت شگــــفت
<br /> <br />
انگیز انـــگیز
</span> </span>
<img src={General} className="w-28 my-2" /> <img src={General} className="w-28 my-2" />
<button className="text-sm text-white flex flex-row items-center"> <button className="text-sm text-white flex flex-row items-center">
@ -26,10 +32,46 @@ const Offer = () => {
</button> </button>
</div> </div>
{/* left */} {/* left */}
<div className="flex-1 bg-blue-300"></div> <div className="flex-1 w-10/12 flex flex-row items-center rounded-lg bg-white">
{products.map((product, index) => (
<div className="flex flex-col p-2">
<img src={product.image} className="rounded w-40" />
<div className="flex flex-row justify-between items-center mt-4">
{/* right */}
<p className="text-xs text-white bg-red-600 px-2 py-0.5 rounded-lg mr-1">
{product.discount}
<span className="">%</span>
</p>
{/* left */}
<div className="flex flex-row items-center">
<p className="text-sm ml-1">{product.price}</p>
<div className="relative">
<span className="text-xs">توما</span>
<span className="text-xs absolute left-0.5 -top-2">ن</span>
</div>
</div>
</div>
<p
className="text-left text-xs line-through my-2 ml-3"
style={{ color: "#c0c2c5" }}
>
559000
</p>
</div>
))}
</div>
</div> </div>
</section> </section>
); );
}; };
export default Offer; export default Offer;
Offer.defaultProps = {
products: [
{ image: o2, price: 20900000, discount: 7, rangeWidht: 33 },
{ image: o3, price: 11000000, discount: 2, rangeWidht: 75 },
{ image: r1, price: 3205000, discount: 70, rangeWidht: 72 },
{ image: r2, price: 30000, discount: 75, rangeWidht: 96 },
],
};

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 55 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 40 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 61 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 27 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 26 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.3 KiB

Loading…
Cancel
Save