From c017289d50e2edd9fed974acf8b6a8d3b0fbe4e6 Mon Sep 17 00:00:00 2001
From: hamid zarghami <hamid.zarghami1@gmail.com>
Date: Sat, 26 Apr 2025 16:09:21 +0330
Subject: [PATCH] fix design

---
 src/app/about/page.tsx                      |  2 +-
 src/app/blogs/components/SingleBlogPage.tsx |  6 +++---
 src/app/contact/ContactForm.tsx             |  1 -
 src/app/globals.css                         |  8 ++++++++
 src/app/products/DetailService.tsx          | 12 ++++++------
 src/app/products/ProductsPage.tsx           |  4 ++--
 6 files changed, 20 insertions(+), 13 deletions(-)

diff --git a/src/app/about/page.tsx b/src/app/about/page.tsx
index b9afeef..18fd3c2 100644
--- a/src/app/about/page.tsx
+++ b/src/app/about/page.tsx
@@ -52,7 +52,7 @@ const About: NextPage = () => {
                 />
             </div>
 
-            <div className='mt-[300px] bg-white rounded-4xl p-10 xl:h-[500px]'>
+            <div className='xl:mt-[300px] mt-[100px] bg-white rounded-4xl p-10 xl:h-[500px]'>
                 <div className='max-w-maxWidth mx-auto'>
                     <video controls className='w-full object-cover xl:-mt-[300px] -mt-[100px] rounded-4xl max-h-[500px]'>
                         <source src='/hp-s3-360p.mp4' type='video/mp4' />
diff --git a/src/app/blogs/components/SingleBlogPage.tsx b/src/app/blogs/components/SingleBlogPage.tsx
index 997a66c..14445d7 100644
--- a/src/app/blogs/components/SingleBlogPage.tsx
+++ b/src/app/blogs/components/SingleBlogPage.tsx
@@ -37,12 +37,12 @@ const SingleBlogPage: FC<Props> = ({ id }) => {
                                     height={20}
                                 />
                             </div>
-                            <h6 className='text-[#7D818C] text-sm'>{data?.data?.blog?.category?.title}</h6>
+                            <h6 className='text-[#7D818C] text-sm whitespace-nowrap'>{data?.data?.blog?.category?.title}</h6>
                         </div>
 
                         <div className='flex gap-1'>
                             <Profile size={20} color='#7D818C' />
-                            <h6 className='text-[#7D818C] text-sm'>{data?.data?.blog?.author.firstName} {data?.data?.blog?.author.lastName}</h6>
+                            <h6 className='text-[#7D818C] text-sm whitespace-nowrap'>{data?.data?.blog?.author.firstName} {data?.data?.blog?.author.lastName}</h6>
                         </div>
 
                         <div className='flex gap-1'>
@@ -65,7 +65,7 @@ const SingleBlogPage: FC<Props> = ({ id }) => {
 
                     </p>
 
-                    <div className='mt-6 flex items-center gap-2  text-description text-sm'>
+                    <div className='mt-6 flex flex-wrap items-center gap-2  text-description text-sm'>
                         <Tag size={20} color='#7D818C' />
                         <div>برچسب ها :</div>
                         {
diff --git a/src/app/contact/ContactForm.tsx b/src/app/contact/ContactForm.tsx
index 90904c3..bbde92a 100644
--- a/src/app/contact/ContactForm.tsx
+++ b/src/app/contact/ContactForm.tsx
@@ -136,7 +136,6 @@ const ContactForm = () => {
                     <div className='mt-8 flex justify-end'>
                         <Button
                             label='ارسال'
-                            className='w-fit px-8'
                             onClick={() => formik.handleSubmit()}
                             isLoading={createContact.isPending}
                         />
diff --git a/src/app/globals.css b/src/app/globals.css
index 01709dc..763ec05 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -119,3 +119,11 @@ tbody tr {
 #blog-content a {
   color: #ea063e !important;
 }
+
+.overflowX {
+  overflow-x: scroll;
+  scrollbar-width: none;
+}
+.overflowX::-webkit-scrollbar {
+  display: none;
+}
diff --git a/src/app/products/DetailService.tsx b/src/app/products/DetailService.tsx
index f7595ae..d9083ec 100644
--- a/src/app/products/DetailService.tsx
+++ b/src/app/products/DetailService.tsx
@@ -35,8 +35,8 @@ const DetailService: FC<{ id: string }> = ({ id }) => {
                         {getDetailService.data?.data.danakService && (
                             <ServiceHeader data={getDetailService.data.data.danakService} />
                         )}
-                        <div className='mt-8 flex xl:flex-row flex-col overflowX justify-between items-center xl:gap-8 gap-5'>
-                            <div className='bg-white flex xl:min-w-[127px] w-full flex-1 flex-col justify-center items-center h-[109px] rounded-2xl py-6 px-4'>
+                        <div className='mt-8 flex overflowX justify-between items-center xl:gap-8 gap-5'>
+                            <div className='bg-white flex min-w-[127px] w-full flex-1 flex-col justify-center items-center h-[109px] rounded-2xl py-6 px-4'>
                                 <div className='text-description xl:text-xs text-[11px]'>
                                     توسعه شرکت
                                 </div>
@@ -44,7 +44,7 @@ const DetailService: FC<{ id: string }> = ({ id }) => {
                                     دانک
                                 </div>
                             </div>
-                            <div className='bg-white flex xl:min-w-[127px] w-full flex-1 flex-col justify-center items-center h-[109px] rounded-2xl py-6 px-4'>
+                            <div className='bg-white flex min-w-[127px] w-full flex-1 flex-col justify-center items-center h-[109px] rounded-2xl py-6 px-4'>
                                 <div className='text-description xl:text-xs text-[11px]'>
                                     تعداد کاربر
                                 </div>
@@ -52,7 +52,7 @@ const DetailService: FC<{ id: string }> = ({ id }) => {
                                     +{getDetailService?.data?.data?.danakService?.userCount}
                                 </div>
                             </div>
-                            <div className='bg-white flex xl:min-w-[127px] w-full flex-1 flex-col justify-center items-center h-[109px] rounded-2xl py-6 px-4'>
+                            <div className='bg-white flex min-w-[127px] w-full flex-1 flex-col justify-center items-center h-[109px] rounded-2xl py-6 px-4'>
                                 <div className='text-description xl:text-xs text-[11px]'>
                                     سال تولید
                                 </div>
@@ -61,7 +61,7 @@ const DetailService: FC<{ id: string }> = ({ id }) => {
                                         moment(getDetailService.data.data.danakService.createdAt).format('jYYYY/jMM/jDD') : ''}
                                 </div>
                             </div>
-                            <div className='bg-white flex xl:min-w-[127px] w-full flex-1 flex-col justify-center items-center h-[109px] rounded-2xl py-6 px-4'>
+                            <div className='bg-white flex min-w-[127px] w-full flex-1 flex-col justify-center items-center h-[109px] rounded-2xl py-6 px-4'>
                                 <div className='text-description xl:text-xs text-[11px]'>
                                     زبان برنامه
                                 </div>
@@ -69,7 +69,7 @@ const DetailService: FC<{ id: string }> = ({ id }) => {
                                     {getDetailService?.data?.data?.danakService?.serviceLanguage === 'fa' ? 'فارسی' : 'انگلیسی'}
                                 </div>
                             </div>
-                            <div className='bg-white flex xl:min-w-[127px] w-full flex-1 flex-col justify-center items-center h-[109px] rounded-2xl py-6 px-4'>
+                            <div className='bg-white flex min-w-[127px] w-full flex-1 flex-col justify-center items-center h-[109px] rounded-2xl py-6 px-4'>
                                 <div className='text-description xl:text-xs text-[11px]'>
                                     امتیاز
                                 </div>
diff --git a/src/app/products/ProductsPage.tsx b/src/app/products/ProductsPage.tsx
index 566e566..fb69515 100644
--- a/src/app/products/ProductsPage.tsx
+++ b/src/app/products/ProductsPage.tsx
@@ -44,7 +44,7 @@ const Products: FC = () => {
                                             />
                                         </Link>
 
-                                        <div className='absolute bottom-0 left-0 w-full modalGlass3 h-[150px]  rounded-b-3xl text-white p-4'>
+                                        <div className='absolute bottom-0 left-0 w-full modalGlass3 min-h-[150px]  rounded-b-3xl text-white p-4'>
                                             <div className='flex justify-between items-center'>
                                                 <h6 className='text-xs'>
                                                     {item.name}
@@ -56,7 +56,7 @@ const Products: FC = () => {
                                             </div>
                                             <div className='mt-6 flex justify-between items-end'>
                                                 <div className='flex gap-4'>
-                                                    <div className='size-14 overflow-hidden rounded-2xl'>
+                                                    <div className='size-14 min-w-14 overflow-hidden rounded-2xl'>
                                                         <Image src={item.icon} alt='product' width={1080} height={1080} className='w-full min-w-14 h-full object-cover' />
                                                     </div>
                                                     <div>