|
|
@@ -0,0 +1,202 @@
|
|
|
+import Image from "next/image";
|
|
|
+
|
|
|
+export default function ContactUsPage() {
|
|
|
+ return (
|
|
|
+ <div className="contact-us-page">
|
|
|
+ {/* Banner */}
|
|
|
+ <div className="contact-us-page-banner w-full">
|
|
|
+ <Image
|
|
|
+ src="/image/cms/contact_us/202503211030.png"
|
|
|
+ alt="Contact Us Banner"
|
|
|
+ width={1440}
|
|
|
+ height={400}
|
|
|
+ className="w-full block"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div className="contact-us-information w-full box-border mx-auto mt-[30px] px-[15px]">
|
|
|
+ <div className="contact-us-top text-center">
|
|
|
+ <div className="text-[24px] font-bold leading-[45px]">
|
|
|
+ We’re Here For Every Queen
|
|
|
+ </div>
|
|
|
+ <div className="w-[80px] h-[4px] bg-black rounded-[4px] mx-auto my-[12px]"></div>
|
|
|
+ <div className="text-[12px] leading-[20px] font-normal">
|
|
|
+ Got questions about our hair tiaras? Need help tracking <br />
|
|
|
+ orders, styling tips, shipping updates, after-sales fixes, <br />
|
|
|
+ or wholesale salon & bulk partnership support? Our <br />
|
|
|
+ dedicated team is standing by to support you every step <br />
|
|
|
+ of the way.
|
|
|
+ {/* Do you need our assistance? ❤️ <br />
|
|
|
+ For product inquiries, order assistance, shipping, after-sales
|
|
|
+ support, or wholesale inquiries, <br />
|
|
|
+ please contact us via the following: */}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ {/* 联系方式卡片组 */}
|
|
|
+ <div className="contact-us-way w-full mt-[30px] flex justify-between items-center">
|
|
|
+ {/* Email */}
|
|
|
+ <div className="w-[108px] h-[130px] flex flex-col items-center p-[10px] box-border rounded-[8px] bg-white shadow-[0px_4px_24px_rgba(0,0,0,0.05)]">
|
|
|
+ <Image
|
|
|
+ src="/image/cms/contact_us/202503201421.png"
|
|
|
+ alt="Email"
|
|
|
+ width={32}
|
|
|
+ height={32}
|
|
|
+ />
|
|
|
+ <div className="text-[12px] leading-[15px] h-[31px] mt-[5px] text-center">
|
|
|
+ Email Support
|
|
|
+ </div>
|
|
|
+ <a
|
|
|
+ href="mailto:service@asteriahair.com"
|
|
|
+ className="mt-[13px] w-[88px] h-[30px] text-center text-[12px] font-normal leading-[30px] text-[white] border bg-[#036141] rounded-[15px]"
|
|
|
+ >
|
|
|
+ Contact
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ {/* WhatsApp / Phone */}
|
|
|
+ <div className="w-[108px] h-[130px] flex flex-col items-center p-[10px] box-border rounded-[8px] bg-white shadow-[0px_4px_24px_rgba(0,0,0,0.05)]">
|
|
|
+ <Image
|
|
|
+ src="/image/cms/contact_us/202503201422.png"
|
|
|
+ alt="Phone IM SMS WhatsApp"
|
|
|
+ width={32}
|
|
|
+ height={32}
|
|
|
+ />
|
|
|
+ <div className="text-[12px] leading-[15px] h-[31px] mt-[5px] text-center">
|
|
|
+ WhatsApp
|
|
|
+ <br /> /SMS/Phone
|
|
|
+ </div>
|
|
|
+ <a
|
|
|
+ href="tel:+8616696557019"
|
|
|
+ className="mt-[13px] w-[88px] h-[30px] text-center text-[12px] font-normal leading-[30px] text-[white] border bg-[#036141] rounded-[15px]"
|
|
|
+ >
|
|
|
+ Contact
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ {/* Wholesale Service */}
|
|
|
+ <div className="w-[108px] h-[130px] flex flex-col items-center p-[10px] box-border rounded-[8px] bg-white shadow-[0px_4px_24px_rgba(0,0,0,0.05)]">
|
|
|
+ <Image
|
|
|
+ src="/image/cms/contact_us/202503201423.png"
|
|
|
+ alt="Wholesale Service"
|
|
|
+ width={32}
|
|
|
+ height={32}
|
|
|
+ />
|
|
|
+ <div className="text-[12px] leading-[15px] h-[31px] mt-[5px] text-center">
|
|
|
+ Wholesale <br /> Service
|
|
|
+ </div>
|
|
|
+ <a
|
|
|
+ href="tel:+8615238065852"
|
|
|
+ className="mt-[13px] w-[88px] h-[30px] text-center text-[12px] font-normal leading-[30px] text-[white] border bg-[#036141] rounded-[15px]"
|
|
|
+ >
|
|
|
+ Contact
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ {/* 工作时间 */}
|
|
|
+ <div className="work-time mt-[30px] text-ly-14 text-center">
|
|
|
+ <div className="mt-[15px] font-medium">
|
|
|
+ · Customer Service Hours 🕒
|
|
|
+ </div>
|
|
|
+ <div className="mt-[15px]">
|
|
|
+ - PST (Pacific Standard Time): 6:30 PM – 3:30 AM
|
|
|
+ </div>
|
|
|
+ <div className="mt-[15px]">
|
|
|
+ - EST (Eastern Standard Time): 9:30 PM – 6:30 AM
|
|
|
+ </div>
|
|
|
+ {/* <div className="mt-[15px]">6:30 PM to 3:30 AM (PST)</div>
|
|
|
+ <div className="mt-[15px]">9:30 PM to 6:30 AM (EST)</div>
|
|
|
+ <div className="mt-[15px]">
|
|
|
+ No worries, queen, we will always reply to your message the moment
|
|
|
+ we see it ❤️
|
|
|
+ </div> */}
|
|
|
+ </div>
|
|
|
+
|
|
|
+ {/* Social Media */}
|
|
|
+ <div className="social-media w-full bg-[#f5f5f5] p-[20px_24px] box-border mt-[30px] mb-12 rounded-[16px]">
|
|
|
+ <div className="text-center text-[16px] font-bold leading-[20px]">
|
|
|
+ Follow Us
|
|
|
+ </div>
|
|
|
+ <div className="flex items-center justify-center flex-wrap mt-[23px] gap-y-4 gap-x-5.5">
|
|
|
+ <a
|
|
|
+ href="https://www.instagram.com/asteriahaircoupon"
|
|
|
+ target="_blank"
|
|
|
+ rel="noopener noreferrer"
|
|
|
+ className="w-[144px] h-[114px] flex items-center justify-center flex-col rounded-[12px] border border-black"
|
|
|
+ >
|
|
|
+ <Image
|
|
|
+ src="/image/cms/contact_us/202503211031.png"
|
|
|
+ alt="Instagram"
|
|
|
+ width={36}
|
|
|
+ height={36}
|
|
|
+ className="mb-[9px]"
|
|
|
+ />
|
|
|
+ <div className="text-[12px] leading-[20px]">@Asteria Hair</div>
|
|
|
+ </a>
|
|
|
+ <a
|
|
|
+ href="https://www.instagram.com/asteriahaircoupon"
|
|
|
+ target="_blank"
|
|
|
+ rel="noopener noreferrer"
|
|
|
+ className="w-[144px] h-[114px] flex items-center justify-center flex-col rounded-[12px] border border-black"
|
|
|
+ >
|
|
|
+ <Image
|
|
|
+ src="/image/cms/contact_us/202503201426.png"
|
|
|
+ alt="Instagram"
|
|
|
+ width={36}
|
|
|
+ height={36}
|
|
|
+ className="mb-[9px]"
|
|
|
+ />
|
|
|
+ <div className="text-[12px] leading-[20px]">
|
|
|
+ @Asteria Hair Store
|
|
|
+ </div>
|
|
|
+ </a>
|
|
|
+
|
|
|
+ <a
|
|
|
+ href="https://www.instagram.com/asteriahaircoupon"
|
|
|
+ target="_blank"
|
|
|
+ rel="noopener noreferrer"
|
|
|
+ className="w-[144px] h-[114px] flex items-center justify-center flex-col rounded-[12px] border border-black "
|
|
|
+ >
|
|
|
+ <Image
|
|
|
+ src="/image/cms/contact_us/202503211032.png"
|
|
|
+ alt="Instagram"
|
|
|
+ width={36}
|
|
|
+ height={36}
|
|
|
+ className="mb-[9px]"
|
|
|
+ />
|
|
|
+ <div className="text-[12px] leading-[20px]">@ASTERIA HAIR</div>
|
|
|
+ </a>
|
|
|
+
|
|
|
+ <a
|
|
|
+ href="https://www.instagram.com/asteriahaircoupon"
|
|
|
+ target="_blank"
|
|
|
+ rel="noopener noreferrer"
|
|
|
+ className="w-[144px] h-[114px] flex items-center justify-center flex-col rounded-[12px] border border-black"
|
|
|
+ >
|
|
|
+ <Image
|
|
|
+ src="/image/cms/contact_us/202503201424.png"
|
|
|
+ alt="Instagram"
|
|
|
+ width={36}
|
|
|
+ height={36}
|
|
|
+ className="mb-[9px]"
|
|
|
+ />
|
|
|
+ <div className="text-[12px] leading-[20px] flex items-center justify-center">
|
|
|
+ @asteriahaircoupon
|
|
|
+ </div>
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ <div className="text-center text-[12px] mt-[23px]">
|
|
|
+ Whether you’re shopping for your personal
|
|
|
+ <br />
|
|
|
+ dream wig or growing your salon hair business,
|
|
|
+ <br />
|
|
|
+ we’re thrilled to assist you. Drop us a message
|
|
|
+ <br />
|
|
|
+ anytime!
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ );
|
|
|
+}
|
zhangzf
