|
|
@ -1,5 +1,3 @@ |
|
|
|
import React from "react"; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
import blogImage from "../../../assets/images/blog-featured-image.jpg"; |
|
|
|
import blogImage from "../../../assets/images/blog-featured-image.jpg"; |
|
|
|
import blogAuthorImg from "../../../assets/images/blog-author.png"; |
|
|
|
import blogAuthorImg from "../../../assets/images/blog-author.png"; |
|
|
|
|
|
|
|
|
|
|
@ -35,33 +33,35 @@ const BlogDesign1 = ({ |
|
|
|
<div className="w-2/5"> |
|
|
|
<div className="w-2/5"> |
|
|
|
<img src={blogImage} alt="" className="w-full h-full" /> |
|
|
|
<img src={blogImage} alt="" className="w-full h-full" /> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div className="w-3/5 mr-4 flex flex-col justify-around"> |
|
|
|
<div className="w-3/5 mr-4 flex flex-col justify-between py-2"> |
|
|
|
<h2 className="text-sm text-justify text-grayTextColor"> |
|
|
|
<div> |
|
|
|
|
|
|
|
<h2 className="text-base text-justify text-grayTextColor"> |
|
|
|
آیا مواد غذای پر فیبر و مفید هستند؟ |
|
|
|
آیا مواد غذای پر فیبر و مفید هستند؟ |
|
|
|
</h2> |
|
|
|
</h2> |
|
|
|
{blogExcerpt && ( |
|
|
|
{blogExcerpt && ( |
|
|
|
<p className="text-justify text-xs leading-6 my-1 text-grayTextColor"> |
|
|
|
<p className="text-justify text-sm leading-6 my-1 text-grayTextColor mt-3"> |
|
|
|
در این قسمت یک توضیح بسیار کوتاه یا عادی در مورد ارور نوشته خواهد |
|
|
|
در این قسمت یک توضیح بسیار کوتاه یا عادی در مورد ارور نوشته |
|
|
|
شد. طراح سعی می کند تا این متن را بیشتر از خد انتظار بلند کند تا |
|
|
|
خواهد شد. طراح سعی می کند تا این متن را بیشتر از خد انتظار بلند |
|
|
|
دیگران متوجه شوند. |
|
|
|
کند تا دیگران متوجه شوند. |
|
|
|
</p> |
|
|
|
</p> |
|
|
|
)} |
|
|
|
)} |
|
|
|
|
|
|
|
</div> |
|
|
|
<div className="flex item-center justify-between w-full mt-2"> |
|
|
|
<div className="flex item-center justify-between w-full mt-2"> |
|
|
|
{blogAuthor && ( |
|
|
|
{blogAuthor && ( |
|
|
|
<div className="flex items-center"> |
|
|
|
<div className="flex items-center"> |
|
|
|
<img src={blogAuthorImg} alt="" className="w-6 h-6" /> |
|
|
|
<img src={blogAuthorImg} alt="" className="w-8 h-8" /> |
|
|
|
<p className="text-xs text-lightGrayTextColor mr-2 font-light"> |
|
|
|
<p className="text-sm text-lightGrayTextColor mr-2 font-light"> |
|
|
|
حامد دژبانی نسب |
|
|
|
حامد دژبانی نسب |
|
|
|
</p> |
|
|
|
</p> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
)} |
|
|
|
)} |
|
|
|
{blogComments && ( |
|
|
|
{blogComments && ( |
|
|
|
<div className="flex items-center"> |
|
|
|
<div className="flex items-center"> |
|
|
|
<p className="text-xs text-lightGrayTextColor ml-2 font-light"> |
|
|
|
<p className="text-sm text-lightGrayTextColor ml-2 font-light"> |
|
|
|
زمان مطالعه 30 دقیقه |
|
|
|
زمان مطالعه 30 دقیقه |
|
|
|
</p> |
|
|
|
</p> |
|
|
|
<div className="relative"> |
|
|
|
<div className="relative"> |
|
|
|
<img src={commentIcon} alt="" className="w-6 h-6" /> |
|
|
|
<img src={commentIcon} alt="" className="w-7 h-7" /> |
|
|
|
<span |
|
|
|
<span |
|
|
|
className={`comment-num absolute ${commentNumBgColor} ${commentNumTextColor} ${commentNumTopPosition} ${commentNumRightPosition}`} |
|
|
|
className={`comment-num absolute ${commentNumBgColor} ${commentNumTextColor} ${commentNumTopPosition} ${commentNumRightPosition}`} |
|
|
|
> |
|
|
|
> |
|
|
|