You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

32 lines
1.1 KiB

import React from "react";
// import "./BookDesign.scss";
import book from "../../assets/images/book.svg";
import bookCover from "../../assets/images/book-white-cover.svg";
export const BookDesign = () => {
return (
<section className="w-11/12 mx-auto p-4 bg-gray-300 rounded-md shadow-md my-8">
{/* title holder */}
<div className="mb-6">
<button className="text-lg text-productTitle text-base bg-white p-1 rounded shadow">
طراحی کتاب
</button>
</div>
{/* Book Ui Design */}
<section className="my-24 mx-24 flex flex-wrap justify-center">
<div className="flex relative">
<img
src={book}
alt=""
className="rounded-md z-40 transform -translate-x-3 w-full sm:w-72 h-full"
/>
<img src={bookCover} alt="" className="z-30 h-full" />
<div className="bg-greenBookBg w-7 rounded-l-md transform translate-x-4 z-10"></div>
<div className="w-10/12 absolute left-7 -bottom-0 h-11 shadow-2xl shadow-black"></div>
</div>
</section>
</section>
);
};