update:样式修改

src/app/[[...lang]]/components/more.tsx

@@ -0,0 +1,17 @@
+import Link from "next/link"
+
+export default function More(props: {dict: Record<string, string>, lang: string[]}) {
+    const { dict, lang } = props
+    return <>
+    <Link href="#contact">
+    
+        <div className="flex flex-col justify-center items-center 
+        text-[30px] text-[#3d3d3d] cursor-pointer rounded-[60px] w-full h-full"
+        style={{background: 'radial-gradient(61% 61% at 50% 50%, #FFFFFF 46%, #E1E1E1 100%)' }}>
+            <div>{ dict.seeMore }</div> 
+            <div>{ dict.contactUs1 }</div>
+        </div>
+    </Link>
+        </>
+    
+}

src/app/[[...lang]]/page.tsx

@@ -7,6 +7,7 @@ import { getDictionary } from '@/dictionaries';
 import Form from "./components/form";
 import Header from "@/app/components/header";
 import Footer from "@/app/components/footer";
+import More from './components/more';
 
 type CaseType = {
     img: string
@@ -40,10 +41,10 @@ export default async function Home (props: PropsType) {
         { img: '/home/case_3.png' },
     ]
     return <>
-        <div className='w-full'>
+        <div className='w-full' style={{overflow: 'hidden'}}>
+            <Header dict={dict} lang={lang} />
             <div className="w-[1440px] relative container"
             >
-                <Header dict={dict} lang={lang} />
                 <div className='main' style={{height: 'calc(100vh - 82px)', overflowY: "auto"}}>
 
                 <section id="home">
@@ -161,7 +162,7 @@ export default async function Home (props: PropsType) {
                                 WebkitTextFillColor: 'transparent'
                             }}
                         >{ dict.caseGallery }</div>
-                        <div className="text-[19px] text-[#59676C]">{ dict.clickNow }</div>
+                        {/* <div className="text-[19px] text-[#59676C]">{ dict.clickNow }</div> */}
                     </div> 
                     </section>
                
@@ -191,8 +192,7 @@ export default async function Home (props: PropsType) {
                         <div className="flex flex-col justify-center items-center 
                         text-[30px] text-[#3d3d3d] cursor-pointer rounded-[60px] mb-[50px]"
                         style={{background: 'radial-gradient(61% 61% at 50% 50%, #FFFFFF 46%, #E1E1E1 100%)', width: 'calc(25% - 37.5px)' }}>
-                            <div>{ dict.seeMore }</div> 
+                            <More dict={dict} lang={lang} />
-                            <div>{ dict.contactUs1 }</div>
                         </div>
                     </div>  
           

src/app/components/footer.tsx

@@ -12,7 +12,7 @@ export default function Footer(props: {dict: Record<string, string>}) {
                     height={151}
                     alt=""
                 />
-                <div className="text-[#888888] text-[15px]">{ dict.addWeChat }</div>
+                <div className="text-[#888888] text-[15px] text-center">{ dict.addWeChat }</div>
             </div>
             <div >
                 <div className="text-[#AFB2B9] text-[17px] font-medium mb-[45px]">{ dict.emailContact }</div>

src/app/components/header.tsx

@@ -10,48 +10,12 @@ type NavType = {
   href: string;
 }
 
-function SplitButton(props: {dict: Record<string, string>, lang: string[]}) {
-  const { dict, lang } = props
-  const [show, setShow] = useState(false)
 
-    return <>
+export default function Header(props: { dict: Record<string, string>, lang: string[] }) {
-    <div className="">
-        <div className="flex items-center w-[129px] h-[28px] bg-[#EEF1F6] 
-        border-[1px] border-[#eeeeee] rounded-[3px] px-[10px] mt-[18px] cursor-pointer" 
-        onClick={() => setShow(!show)}>
-            <img 
-                src="/common/earth.png"
-                width={16.5}
-                height={16.5}
-                alt="logo"
-            />
-            <div className="flex-1 text-[14px] text-[#333333] mx-[9px]">{ dict?.lang }</div>
-            <img
-                className={`transition-transform duration-300 transform rotate-0 ${show && 'rotate-180'}`}
-                 src="/common/arrow.png"
-                 width={10}
-                 height={5}
-                 alt="logo"
-            />
-        </div>
-        {
-            
-              <div className={`absolute ${!show && 'hidden'} left-0 right-0 top-0 bottom-0 left-0 top-0 z-[1000]`} onClick={() => setShow(false)}>
-                <Link href={lang[0] === 'zh' ? '/en' : '/'}>
-                  <div className={`absolute right-[20px] top-[68px] w-[129px] h-[28px] leading-[28px]
-                  bg-[#EEF1F6] text-center transition-all duration-300 origin-top group-hover:block`}>
-                      <div className="text-[14px] text-[#333333]">{dict?.lang1}</div>
-                  </div>
-                </Link>
-              </div>
-            
-        }
-      </div>
-    </>
-}
-export default function Header(props: {dict: Record<string, string>, lang: string[]}) {
   const { dict, lang } = props
   const [activeTab, setActiveTab] = useState(dict.home)
+  const [show, setShow] = useState(false)
+
   const navList: NavType[] = [
     {
       name: dict.home,
@@ -67,11 +31,12 @@ export default function Header(props: {dict: Record<string, string>, lang: strin
     },
     {
       name: dict.contactUs,
-          href: "#contact "
+      href: "#contact"
     },
   ]
   return (<>
-        <div className={"flex items-center px-[20px] h-[80px] border-b-1 border-solid border-[#D8D8D8] absolute w-full bg-white z-[999]"}
+    <div className={`flex items-center px-[55px] h-[80px] border-b-1 border-solid 
+        border-[#D8D8D8] absolute bg-white z-[900] w-[1440px] container`}
       style={{ borderBottom: '1px solid #D8D8D8' }}
     >
       <Link href="#home">
@@ -88,7 +53,7 @@ export default function Header(props: {dict: Record<string, string>, lang: strin
           navList.map((item: NavType) => (
             <Link href={item.href} key={item.name}>
               <div className="text-center cursor-pointer" onClick={() => setActiveTab(item.name)}>
-                      <div className="my-[10px] w-[144px] text-[18px]">{ item.name }</div>
+                <div className="my-[10px] w-[144px] text-[18px]">{item.name}</div>
                 {
                   activeTab === item.name ?
                     <img src="/common/tab_checked.png" width={144} height={8} alt="" /> :
@@ -100,10 +65,40 @@ export default function Header(props: {dict: Record<string, string>, lang: strin
         }
       </div>
       <div className="w-[129px]">
-            <SplitButton dict={dict} lang={lang} />
+          <div className="flex items-center w-[129px] h-[28px] bg-[#EEF1F6] 
+        border-[1px] border-[#eeeeee] rounded-[3px] px-[10px] mt-[18px] cursor-pointer"
+            onClick={() => setShow(!show)}>
+            <img
+              src="/common/earth.png"
+              width={16.5}
+              height={16.5}
+              alt="logo"
+            />
+            <div className="flex-1 text-[14px] text-[#333333] mx-[9px]">{dict?.lang}</div>
+            <img
+              className={`transition-transform duration-300 transform rotate-0 ${show && 'rotate-180'}`}
+              src="/common/arrow.png"
+              width={10}
+              height={5}
+              alt="logo"
+            />
+          </div>
+          {
+
+            <div className={`absolute ${!show && 'hidden'} left-0 right-0 top-0 bottom-0 left-0 top-0 z-[10000]`} onClick={() => setShow(false)}>
+              <Link href={lang[0] === 'zh' ? '/en' : '/'}>
+                <div className={`absolute right-[55px] top-[68px] w-[129px] h-[28px] leading-[28px]
+                  bg-[#EEF1F6] text-center transition-all duration-300 origin-top group-hover:block`}>
+                  <div className="text-[14px] text-[#333333]">{dict?.lang1}</div>
+                </div>
+              </Link>
+            </div>
+
+          }
       </div>
     </div>
-        <div className="h-[80px]"></div>
+    <div className={`${!show && 'hidden'} absolute bg-[#000000] opacity-[0] left-0 top-0 bottom-0 right-0 z-[899]`} onClick={() => setShow(false)}></div>
+    <div className="h-[80px] container"></div>
   </>
   )
 }

src/app/globals.css

@@ -21,6 +21,9 @@
           transform: scale(1.333); /* 1440px宽度的1.333倍是1920px */
           left: calc(50% - 960px);
         }
+        .mn {
+          transform: scaleY(1 /1.333)
+        }
       }
       
       /* 当屏幕宽度大于或等于1920px时 */
@@ -29,4 +32,7 @@
           transform: scale(1.333); /* 保持与1920px宽度的屏幕相同的缩放比例 */
           left: calc(50% - 960px);
         }
+        .mn {
+          transform: scaleY(1 /1.333)
+        }
       }