ahasani/pasargad
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add title and description in head , responsive home page

Browse Source
This commit is contained in:
zahravaziri
2025-06-11 17:13:51 +03:30
parent ab37893d1b
commit 594643816a
18 changed files with 166 additions and 111 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/pages/home/HomeStorySection.tsx
+8 -6
View File
@@ -28,8 +28,10 @@ export default function HomeStorySection({
];
return (
<div className={`container mx-auto flex flex-col gap-12 ${className}`}>
<div className="grid grid-cols-2 gap-10">
<div
className={`container mx-auto flex flex-col gap-12 max-lg:gap-0 ${className}`}
>
<div className="grid grid-cols-1 gap-10 lg:grid-cols-2">
<SectionTitle
title={t('com_home_story_title')}
description={t('com_home_story_slogan')}
@@ -47,19 +49,19 @@ export default function HomeStorySection({
</div>
</div>
<div className="grid grid-cols-2 gap-10">
<div className="aspect-video w-full overflow-hidden rounded-3xl">
<div className="grid grid-cols-1 gap-10 lg:grid-cols-2">
<div className="aspect-video w-full overflow-hidden rounded-3xl max-lg:hidden">
<Image
src={images.whatWeDoImage}
alt=""
className="h-full w-full object-cover"
/>
</div>
<div className="flex flex-col py-8">
<div className="flex flex-col py-8 max-lg:gap-6">
<p className="text-base font-light text-gray-500">
{t('com_home_story_description')}
</p>
<hr className="my-10 text-gray-100/50" />
<hr className="my-10 text-gray-100/50 max-lg:hidden" />
<div className="grid grid-cols-3 justify-between gap-1">
{statisticsData.map((stat, index) => (
<div key={index} className="flex flex-col gap-1">
src/components/pages/home/Products.tsx
+6 -6
View File
@@ -21,28 +21,28 @@ export default async function HomePageProducts({ locale }: Props) {
return (
<div className="w-full">
<div
className={`relative w-full bg-cover bg-fixed bg-center bg-no-repeat pt-28 pb-48`}
className={`relative w-full bg-cover bg-fixed bg-center bg-no-repeat pt-28 pb-20 max-lg:pt-6 md:pb-48`}
style={{ backgroundImage: `url(${images.homeProductBack.src})` }}
>
<div className="absolute inset-0 z-10 bg-black opacity-50" />
<div className="relative z-20 container mx-auto grid grid-cols-2 gap-28">
<div className="relative z-20 container mx-auto grid grid-cols-1 gap-0 lg:grid-cols-2 lg:gap-28">
<SectionTitle
title={t('pages_product_categories_title')}
description={t('com_home_products_title')}
reverseColor
/>
<h4 className="pt-10 text-base font-extralight tracking-normal text-white">
<h4 className="pt-6 text-base font-extralight tracking-normal text-white lg:pt-10">
{t('com_home_products_description')}
</h4>
</div>
</div>
<div className="relative top-[-100px] z-20 container mx-auto w-full">
<div className="grid grid-cols-1 gap-8 rounded-4xl bg-gray-50 py-10 shadow-2xl md:grid-cols-2 lg:grid-cols-4">
<div className="relative -top-7 z-20 container mx-auto w-full md:top-[-100px]">
<div className="grid grid-cols-1 gap-8 rounded-4xl bg-gray-50 py-10 shadow-2xl max-md:gap-0 max-md:py-5 md:grid-cols-2 lg:grid-cols-4">
{productCategories.map((category, index) => (
<Link key={category.id} href={routes.products.route(category.id)}>
<div
className={`flex flex-col items-center justify-center gap-4 p-6 text-center ${index ? 'border-s-[1px] border-gray-100' : ''}`}
className={`flex flex-col items-center justify-center gap-4 p-6 text-center max-md:gap-2 ${index ? 'border-s-[1px] border-gray-100' : ''} ${index !== productCategories.length - 1 ? `border-gray-100 max-md:border-b-[1px]` : ''}`}
>
<h3 className="text-xl font-bold text-gray-500">
{category.title}
src/components/pages/home/Projects.tsx
+3 -3
View File
@@ -13,15 +13,15 @@ export default async function HomePageProjects({ locale }: Props) {
return (
<div className="w-full">
<div
className={`relative w-full bg-white bg-cover bg-fixed bg-center bg-no-repeat pt-28`}
className={`relative w-full bg-white bg-cover bg-fixed bg-center bg-no-repeat pt-28 max-lg:pt-6`}
>
<div className="relative z-20 container mx-auto grid grid-cols-2 gap-28">
<div className="relative z-20 container mx-auto grid grid-cols-1 lg:grid-cols-2 lg:gap-28">
<SectionTitle
title={t('pages_projects_title')}
description={t('com_home_projects_title')}
description_bold={t('com_home_projects_title_bold')}
/>
<h4 className="pt-10 text-base font-extralight tracking-normal">
<h4 className="pt-10 text-base font-extralight tracking-normal max-lg:hidden">
{t('com_home_projects_description')}
</h4>
</div>