chore: transfer repo

components/about/AboutPageContent.tsx

@@ -0,0 +1,104 @@
+'use client';
+
+import { ContactForm } from '@/components/ui/ContactForm';
+import { Newsletter } from '@/components/ui/Newsletter';
+import { Section } from '@/components/ui/Section';
+import { Heading, Text } from '@/components/ui/Typography';
+import { useTranslation } from '@/lib/hooks/useTranslation';
+import { container } from '@/lib/utils';
+import Image from 'next/image';
+
+export function AboutPageContent() {
+  const { t } = useTranslation();
+  
+  return (
+    <main>
+      {/* About Us Header Section */}
+      <Section spacing="large">
+        <div className="flex flex-col items-center text-center">
+          <Heading level={1} className="mb-6 tracking-[0]">{t('about.title')}</Heading>
+          <Text className="max-w-3xl mx-auto mb-12 tracking-[0] mb-[80px]">
+            {t('about.description')}
+          </Text>
+          
+          <div className="w-full aspect-[16/9] relative bg-gray-100">
+            <Image 
+              src="/assets/images/image2.webp"
+              alt={t('about.title')} 
+              fill 
+              className="object-cover"
+            />
+          </div>
+        </div>
+      </Section>
+
+      {/* Contact Form Section */}
+      <div className="relative">
+        {/* Top wave */}
+        <div className="w-full">
+          <Image
+            src="/assets/images/Frame6.png"
+            alt=""
+            width={1440}
+            height={140}
+            className="w-full object-cover"
+          />
+        </div>
+        
+        {/* Main content with yellow background */}
+        <div className="bg-[#FFC877] pb-[224px]">
+          <div className={container}>
+            <div className="py-[112px]">
+              <div className="grid grid-cols-1 md:grid-cols-2 gap-12">
+                <div>
+                  <ContactForm 
+                    title={t('about.contactForm.title')}
+                    subtitle={t('about.contactForm.subtitle')}
+                  />
+                </div>
+                
+                <div className="w-full h-full relative bg-gray-100 min-h-[600px]">
+                  <Image 
+                    src="/assets/images/image22.png"
+                    alt={t('about.contactForm.title')} 
+                    fill 
+                    className="object-cover"
+                    priority
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      {/* Newsletter Section */}
+      <div className="relative -mt-[112px]">
+        {/* Top wave that overlaps with yellow section */}
+        <div className="w-full absolute -top-32 z-10">
+          <Image
+            src="/assets/images/Frame4.png"
+            alt=""
+            width={1440}
+            height={140}
+            className="w-full object-cover"
+          />
+        </div>
+        
+        {/* Main content with pink background */}
+        <div className="bg-[#F58EA7]">
+          <div className={container}>
+            <div className="py-[112px]">
+              <Newsletter 
+                title={t('about.newsletter.title')} 
+                subtitle={t('about.newsletter.subtitle')}
+                buttonText={t('about.newsletter.buttonText')}
+                disclaimer={t('about.newsletter.disclaimer')}
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+    </main>
+  );
+}