|  |  |  | @ -7,7 +7,7 @@ import whiteCommentIcon from "../../../assets/icons/white-comment-icon.svg"; | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | const BlogDesign2 = ({ blogSubTitle, dateButton, tagButton }) => { | 
			
		
	
		
			
				
					|  |  |  |  |   return ( | 
			
		
	
		
			
				
					|  |  |  |  |     <section className="w-11/12 mx-auto p-4 bg-white rounded-md shadow-md my-8"> | 
			
		
	
		
			
				
					|  |  |  |  |     <section className="w-3/12 mx-auto p-4 bg-white rounded-md shadow-md my-8"> | 
			
		
	
		
			
				
					|  |  |  |  |       {/* title holder */} | 
			
		
	
		
			
				
					|  |  |  |  |       <div className="flex items-center justify-between mb-6"> | 
			
		
	
		
			
				
					|  |  |  |  |         <h2 className="text-productTitle bg-green-100 p-2 rounded text-base"> | 
			
		
	
	
		
			
				
					|  |  |  | @ -23,7 +23,17 @@ const BlogDesign2 = ({ blogSubTitle, dateButton, tagButton }) => { | 
			
		
	
		
			
				
					|  |  |  |  |         </p> | 
			
		
	
		
			
				
					|  |  |  |  |       </div> | 
			
		
	
		
			
				
					|  |  |  |  |       {/* blog UI Design2 */} | 
			
		
	
		
			
				
					|  |  |  |  |       <div className="relative w-full md:w-1/4"> | 
			
		
	
		
			
				
					|  |  |  |  |       <div | 
			
		
	
		
			
				
					|  |  |  |  |         className="relative flex flex-col justify-end p-3" | 
			
		
	
		
			
				
					|  |  |  |  |         style={{ | 
			
		
	
		
			
				
					|  |  |  |  |           backgroundImage: `url(${blogFeaturedImage2})`, | 
			
		
	
		
			
				
					|  |  |  |  |           backgroundSize: "100% 100%", | 
			
		
	
		
			
				
					|  |  |  |  |           backgroundRepeat: "no-repeat", | 
			
		
	
		
			
				
					|  |  |  |  |           // minHeight: "300px",
 | 
			
		
	
		
			
				
					|  |  |  |  |           height: "calc(100vh/3)", | 
			
		
	
		
			
				
					|  |  |  |  |           maxHeight: "300px", | 
			
		
	
		
			
				
					|  |  |  |  |         }} | 
			
		
	
		
			
				
					|  |  |  |  |       > | 
			
		
	
		
			
				
					|  |  |  |  |         {dateButton && ( | 
			
		
	
		
			
				
					|  |  |  |  |           <button className="bg-yellow-100 rounded p-1 text-sm absolute left-2 top-4"> | 
			
		
	
		
			
				
					|  |  |  |  |             1400/09/19 | 
			
		
	
	
		
			
				
					|  |  |  | @ -34,26 +44,30 @@ const BlogDesign2 = ({ blogSubTitle, dateButton, tagButton }) => { | 
			
		
	
		
			
				
					|  |  |  |  |             تگ | 
			
		
	
		
			
				
					|  |  |  |  |           </button> | 
			
		
	
		
			
				
					|  |  |  |  |         )} | 
			
		
	
		
			
				
					|  |  |  |  |         <img src={blogFeaturedImage2} alt="" className="w-full" /> | 
			
		
	
		
			
				
					|  |  |  |  |         <div className="absolute right-2 bottom-16 z-10"> | 
			
		
	
		
			
				
					|  |  |  |  |           <h2 className="text-white text-lg"> | 
			
		
	
		
			
				
					|  |  |  |  |         {/* <img src={blogFeaturedImage2} alt="" className="w-full" /> */} | 
			
		
	
		
			
				
					|  |  |  |  |         <div className="z-10"> | 
			
		
	
		
			
				
					|  |  |  |  |           <h2 className="text-white text-base"> | 
			
		
	
		
			
				
					|  |  |  |  |             آیا مواد غذایی پر فیبر مفید هستند؟ | 
			
		
	
		
			
				
					|  |  |  |  |           </h2> | 
			
		
	
		
			
				
					|  |  |  |  |           {blogSubTitle && ( | 
			
		
	
		
			
				
					|  |  |  |  |             <h2 className="text-white text-lg">شما چه فکری می کنید</h2> | 
			
		
	
		
			
				
					|  |  |  |  |             <h2 className="text-white text-base">شما چه فکری می کنید</h2> | 
			
		
	
		
			
				
					|  |  |  |  |           )} | 
			
		
	
		
			
				
					|  |  |  |  |         </div> | 
			
		
	
		
			
				
					|  |  |  |  |         <div className="z-10 flex item-center justify-around absolute right-2 bottom-1 w-full"> | 
			
		
	
		
			
				
					|  |  |  |  |         <div className="z-10 flex item-center justify-between w-full mt-4"> | 
			
		
	
		
			
				
					|  |  |  |  |           {/* {blogAuthor && ( */} | 
			
		
	
		
			
				
					|  |  |  |  |           <div className="flex items-center"> | 
			
		
	
		
			
				
					|  |  |  |  |             <img src={blogAuthorImg} alt="" /> | 
			
		
	
		
			
				
					|  |  |  |  |             <p className="text-xs text-white mr-2">حامد دژبانی نسب</p> | 
			
		
	
		
			
				
					|  |  |  |  |             <img src={blogAuthorImg} alt="" className="w-7 h-7" /> | 
			
		
	
		
			
				
					|  |  |  |  |             <p className="text-xs text-white font-light mr-2"> | 
			
		
	
		
			
				
					|  |  |  |  |               حامد دژبانی نسب | 
			
		
	
		
			
				
					|  |  |  |  |             </p> | 
			
		
	
		
			
				
					|  |  |  |  |           </div> | 
			
		
	
		
			
				
					|  |  |  |  |           {/* // )} */} | 
			
		
	
		
			
				
					|  |  |  |  |           {/* {blogComments && ( */} | 
			
		
	
		
			
				
					|  |  |  |  |           <div className="flex items-center"> | 
			
		
	
		
			
				
					|  |  |  |  |             <p className="text-xs text-white ml-2">زمان مطالعه 30 دقیقه</p> | 
			
		
	
		
			
				
					|  |  |  |  |             <img src={whiteCommentIcon} alt="" /> | 
			
		
	
		
			
				
					|  |  |  |  |             <p className="text-xs text-white font-light ml-2"> | 
			
		
	
		
			
				
					|  |  |  |  |               زمان مطالعه 30 دقیقه | 
			
		
	
		
			
				
					|  |  |  |  |             </p> | 
			
		
	
		
			
				
					|  |  |  |  |             <img src={whiteCommentIcon} alt="" className="w-7 h-7" /> | 
			
		
	
		
			
				
					|  |  |  |  |           </div> | 
			
		
	
		
			
				
					|  |  |  |  |           {/* // )} */} | 
			
		
	
		
			
				
					|  |  |  |  |         </div> | 
			
		
	
	
		
			
				
					|  |  |  | 
 |