hamed/nobat724_front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix responsive all pages & change style page list blog and blog item & add date picker

Browse Source
This commit is contained in:
Ehsan
2024-08-23 18:57:28 +03:30
parent c62fb78f8c
commit 9701547d1f
35 changed files with 19276 additions and 225 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/blog/relatedContent/Item.js
+12 -6
View File
@@ -1,29 +1,35 @@
import Image from "next/image";
import Link from "next/link";
function Item({ data }) {
function Item({ data, idx }) {
return (
<li className="flex relative items-center justify-start gap-[8px] py-[20px]">
<li className="flex relative items-center justify-start gap-[8px] py-[12px] sm:py-[15px] md:py-[18px] lg:py-[20px]">
<Link href={`/blog/${data.id}`}>
<Image
className="w-[97px] h-[88px] rounded-[8px] overflow-hidden object-cover"
className="
min-w-[64px] sm:min-w-[73px] md:min-w-[85px] lg:min-w-[97px]
min-h-[56px] sm:min-h-[64px] md:min-h-[75px] lg:min-h-[88px]
rounded-[8px] overflow-hidden object-cover
"
src={data.src}
alt="article"
height={88}
width={97}
/>
</Link>
<div className="flex flex-col gap-[24px] items-start justify-between">
<div className="flex flex-col gap-[16px] sm:gap-[18px] md:gap-[21px] lg:gap-[24px] items-start justify-between">
<Link href={`/blog/${data.id}`}>
<p
className="text-[#3B3B3B] text-[16px] text-nowrap font-bold"
className="text-[#3B3B3B] text-[14px] md:text-[16px] font-bold text-wrap lg:text-nowrap"
>{data.title}</p>
</Link>
<p
className="text-[#9B9B9B] text-[12px] text-nowrap font-normal"
>تاریخ انتشار: {data.date_of_release}</p>
</div>
<span className="block absolute right-0 bottom-0 w-full h-px bg-[#EFEFEF]"></span>
{data.id > idx + 1 && (
<span className="block absolute right-0 bottom-0 w-full h-px bg-[#EFEFEF]"></span>
)}
</li>
)
}
components/blog/relatedContent/index.js
+4 -3
View File
@@ -5,13 +5,14 @@ import Item from './Item'
function RelatedContent({ data }) {
return (
<div className='p-[16px] bg-[#FFF] rounded-[8px] shadow-[0px_1px_24.8px_0px_rgba(204,_204,_204,_0.18)]'>
<div className='p-[12px] w-full lg:w-fit md:p-[14px] lg:p-[16px] bg-[#FFF] rounded-[8px] shadow-[0px_1px_24.8px_0px_rgba(204,_204,_204,_0.18)]'>
<AnimationTextHead name='fade-up' text='مطالب مرتبط'>
<UnderlineLG />
</AnimationTextHead>
<ul className='flex w-fit flex-col justify-start items-start'>
{data.map(item => (
<ul className='flex w-full lg:w-fit flex-col justify-start items-start'>
{data.map((item, idx) => (
<Item
idx={idx}
data={item}
key={item.id}
/>