bender/45e88289-f720-4b26-83c3-b7cc1dd40e61
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update src/app/page.tsx

Browse Source
This commit is contained in:
bender
2026-06-11 04:17:55 +00:00
parent 3882b38b75
commit 93a9282b9a
1 changed files with 53 additions and 194 deletions
Download Patch File Download Diff File Expand all files Collapse all files

247
src/app/page.tsx
View File

@@ -32,29 +32,17 @@ export default function LandingPage() {
<NavbarStyleApple
navItems={[
{
name: "Home",
id: "#home",
},
name: "Home", id: "#home"},
{
name: "Services",
id: "#services",
},
name: "Services", id: "#services"},
{
name: "About",
id: "#about",
},
name: "About", id: "#about"},
{
name: "Shop",
id: "#shop",
},
name: "Shop", id: "#shop"},
{
name: "FAQs",
id: "#faq",
},
name: "FAQs", id: "#faq"},
{
name: "Contact",
id: "#contact",
},
name: "Contact", id: "#contact"},
]}
brandName="Zhong Yi Idea TCM"
/>
@@ -63,21 +51,16 @@ export default function LandingPage() {
<div id="home" data-section="home">
<HeroLogoBillboard
background={{
variant: "plain",
}}
variant: "plain"}}
logoText="Zhong Yi Idea TCM Clinic"
description="Your Health, Naturally Restored. 以自然療法促進您的健康與康復。Located in Edmonton, Alberta, Canada, we are dedicated to providing comprehensive Traditional Chinese Medicine care."
buttons={[
{
text: "Book Appointment Online",
href: "#contact",
},
text: "Book Appointment Online", href: "#contact"},
{
text: "View Clinic Services",
href: "#services",
},
text: "View Clinic Services", href: "#services"},
]}
imageSrc="http://img.b2bpic.net/free-photo/serene-minimalist-spa-interior-meditation-space_23-2151935113.jpg?_wi=1"
imageSrc="http://img.b2bpic.net/free-photo/serene-minimalist-spa-interior-meditation-space_23-2151935113.jpg"
imageAlt="Zhong Yi Idea TCM Clinic entrance with traditional and modern elements"
mediaAnimation="opacity"
/>
@@ -90,45 +73,20 @@ export default function LandingPage() {
useInvertedBackground={true}
features={[
{
title: "Acupuncture 針灸治療",
description: "Fine needles gently stimulate specific points to restore balance and promote natural healing.",
bentoComponent: "reveal-icon",
icon: Heart,
imageSrc: "http://img.b2bpic.net/free-photo/bangkok-thailand-november-11-2024-sacred-shrine-thailand_482257-123759.jpg",
imageAlt: "Bangkok Thailand November 11 2024 Sacred shrine in Thailand",
title: "Acupuncture 針灸治療", description: "Fine needles gently stimulate specific points to restore balance and promote natural healing.", bentoComponent: "reveal-icon", icon: Heart
},
{
title: "Chinese Herbal Medicine 中藥調理",
description: "Customized herbal formulas to address your unique health concerns and support internal harmony.",
bentoComponent: "reveal-icon",
icon: Leaf,
imageSrc: "http://img.b2bpic.net/free-photo/serene-minimalist-spa-interior-meditation-space_23-2151935113.jpg?_wi=2",
imageAlt: "Bangkok Thailand November 11 2024 Sacred shrine in Thailand",
title: "Chinese Herbal Medicine 中藥調理", description: "Customized herbal formulas to address your unique health concerns and support internal harmony.", bentoComponent: "reveal-icon", icon: Leaf
},
{
title: "Cupping Therapy 拔罐療法",
description: "Suction cups applied to the skin to relieve muscle tension, improve circulation, and detoxify.",
bentoComponent: "reveal-icon",
icon: Lightbulb,
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-girl-is-engaged-meditation_72229-1161.jpg?_wi=1",
imageAlt: "Bangkok Thailand November 11 2024 Sacred shrine in Thailand",
title: "Cupping Therapy 拔罐療法", description: "Suction cups applied to the skin to relieve muscle tension, improve circulation, and detoxify.", bentoComponent: "reveal-icon", icon: Lightbulb
},
{
title: "Moxibustion 艾灸療法",
description: "Herbal heat therapy using moxa to warm meridians, invigorate blood flow, and dispel cold.",
bentoComponent: "reveal-icon",
icon: Flame,
imageSrc: "http://img.b2bpic.net/free-photo/close-up-aromatic-herbs-spices_23-2148349672.jpg?_wi=1",
imageAlt: "Bangkok Thailand November 11 2024 Sacred shrine in Thailand",
title: "Moxibustion 艾灸療法", description: "Herbal heat therapy using moxa to warm meridians, invigorate blood flow, and dispel cold.", bentoComponent: "reveal-icon", icon: Flame
},
{
title: "Tuina / Therapeutic Massage 推拿按摩",
description: "Traditional Chinese therapeutic massage techniques to alleviate pain, reduce stress, and improve energy flow.",
bentoComponent: "reveal-icon",
icon: Activity,
imageSrc: "http://img.b2bpic.net/free-photo/front-view-composition-natural-argan-product_23-2148955791.jpg?_wi=1",
imageAlt: "Bangkok Thailand November 11 2024 Sacred shrine in Thailand",
},
title: "Tuina / Therapeutic Massage 推拿按摩", description: "Traditional Chinese therapeutic massage techniques to alleviate pain, reduce stress, and improve energy flow.", bentoComponent: "reveal-icon", icon: Activity
}
]}
title="Our Services 我們的服務"
description="Explore the range of traditional Chinese medicine therapies we offer to naturally restore your health and well-being. Each service is tailored to your individual needs for optimal results."
@@ -143,7 +101,7 @@ export default function LandingPage() {
description="Learn about my extensive training, clinical experience, esteemed mentor, and compassionate philosophy of care, dedicated to your natural recovery."
subdescription="Languages Spoken: English, Mandarin, Cantonese (Basic). Committed to effective and personalized treatment plans for every patient."
icon={User}
imageSrc="http://img.b2bpic.net/free-photo/beautiful-girl-is-engaged-meditation_72229-1161.jpg?_wi=2"
imageSrc="http://img.b2bpic.net/free-photo/beautiful-girl-is-engaged-meditation_72229-1161.jpg"
imageAlt="Portrait of a smiling traditional Chinese medicine practitioner"
mediaAnimation="opacity"
/>
@@ -157,75 +115,25 @@ export default function LandingPage() {
useInvertedBackground={true}
products={[
{
id: "1",
name: "Essential Oils 精油",
price: "$18.00",
imageSrc: "http://img.b2bpic.net/free-photo/close-up-aromatic-herbs-spices_23-2148349672.jpg?_wi=2",
imageAlt: "Bottle of natural essential oil",
},
id: "1", name: "Essential Oils 精油", price: "$18.00", imageSrc: "http://img.b2bpic.net/free-photo/close-up-aromatic-herbs-spices_23-2148349672.jpg", imageAlt: "Bottle of natural essential oil"},
{
id: "2",
name: "Aromatherapy Products 芳香療法產品",
price: "$25.00",
imageSrc: "http://img.b2bpic.net/free-photo/front-view-composition-natural-argan-product_23-2148955791.jpg?_wi=2",
imageAlt: "Aromatherapy diffuser and products",
},
id: "2", name: "Aromatherapy Products 芳香療法產品", price: "$25.00", imageSrc: "http://img.b2bpic.net/free-photo/front-view-composition-natural-argan-product_23-2148955791.jpg", imageAlt: "Aromatherapy diffuser and products"},
{
id: "3",
name: "Pain Relief Ointments 止痛藥膏",
price: "$15.00",
imageSrc: "http://img.b2bpic.net/free-photo/chinese-herbal-medicine-box_1359-259.jpg",
imageAlt: "Herbal pain relief ointment",
},
id: "3", name: "Pain Relief Ointments 止痛藥膏", price: "$15.00", imageSrc: "http://img.b2bpic.net/free-photo/chinese-herbal-medicine-box_1359-259.jpg", imageAlt: "Herbal pain relief ointment"},
{
id: "4",
name: "Kinesiology Tape 肌內效貼布",
price: "$12.00",
imageSrc: "http://img.b2bpic.net/free-photo/cropped-photo-black-caucasian-women-standing-studio-with-fitness-rubber-legs_1157-52332.jpg",
imageAlt: "Roll of kinesiology tape",
},
id: "4", name: "Kinesiology Tape 肌內效貼布", price: "$12.00", imageSrc: "http://img.b2bpic.net/free-photo/cropped-photo-black-caucasian-women-standing-studio-with-fitness-rubber-legs_1157-52332.jpg", imageAlt: "Roll of kinesiology tape"},
{
id: "5",
name: "Massage Gun 筋膜按摩槍",
price: "$99.00",
imageSrc: "http://img.b2bpic.net/free-photo/man-using-massage-gun-leg-high-angle_23-2149407532.jpg",
imageAlt: "Massage gun for muscle relief",
},
id: "5", name: "Massage Gun 筋膜按摩槍", price: "$99.00", imageSrc: "http://img.b2bpic.net/free-photo/man-using-massage-gun-leg-high-angle_23-2149407532.jpg", imageAlt: "Massage gun for muscle relief"},
{
id: "6",
name: "Herbal Tea 養生茶",
price: "$10.00",
imageSrc: "http://img.b2bpic.net/free-photo/side-view-rose-buds-glass-jar-dry-black-tea-leaves-clove-spice-chocolate-bar-with-fruits-black-wood_141793-7195.jpg",
imageAlt: "Cup of traditional Chinese herbal tea",
},
id: "6", name: "Herbal Tea 養生茶", price: "$10.00", imageSrc: "http://img.b2bpic.net/free-photo/side-view-rose-buds-glass-jar-dry-black-tea-leaves-clove-spice-chocolate-bar-with-fruits-black-wood_141793-7195.jpg", imageAlt: "Cup of traditional Chinese herbal tea"},
{
id: "7",
name: "Acupressure Mats 穴位按摩墊",
price: "$35.00",
imageSrc: "http://img.b2bpic.net/free-photo/mid-section-young-woman-exercising-with-yellow-dumbbells_23-2148047354.jpg",
imageAlt: "Acupressure mat for relaxation",
},
id: "7", name: "Acupressure Mats 穴位按摩墊", price: "$35.00", imageSrc: "http://img.b2bpic.net/free-photo/mid-section-young-woman-exercising-with-yellow-dumbbells_23-2148047354.jpg", imageAlt: "Acupressure mat for relaxation"},
{
id: "8",
name: "Foot Massage Slippers 足底按摩拖鞋",
price: "$28.00",
imageSrc: "http://img.b2bpic.net/free-photo/close-up-legs-posing-with-bamboo_23-2148918950.jpg",
imageAlt: "Foot massage slippers",
},
id: "8", name: "Foot Massage Slippers 足底按摩拖鞋", price: "$28.00", imageSrc: "http://img.b2bpic.net/free-photo/close-up-legs-posing-with-bamboo_23-2148918950.jpg", imageAlt: "Foot massage slippers"},
{
id: "9",
name: "Moxa Products 艾灸產品",
price: "$20.00",
imageSrc: "http://img.b2bpic.net/free-photo/phytotherapy-products-assortment_23-2149339772.jpg",
imageAlt: "Moxa sticks for moxibustion",
},
id: "9", name: "Moxa Products 艾灸產品", price: "$20.00", imageSrc: "http://img.b2bpic.net/free-photo/phytotherapy-products-assortment_23-2149339772.jpg", imageAlt: "Moxa sticks for moxibustion"},
{
id: "10",
name: "Traditional Herbal Ointments 中草藥藥膏",
price: "$16.00",
imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-various-products-skincare_23-2148645624.jpg",
imageAlt: "Traditional herbal ointment jar",
},
id: "10", name: "Traditional Herbal Ointments 中草藥藥膏", price: "$16.00", imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-various-products-skincare_23-2148645624.jpg", imageAlt: "Traditional herbal ointment jar"},
]}
title="Clinic Retail Corner 診所精選產品"
description="Discover a curated selection of natural products to support your health journey and enhance your well-being at home. From aromatherapy to pain relief, find what you need."
@@ -239,23 +147,14 @@ export default function LandingPage() {
useInvertedBackground={false}
metrics={[
{
id: "convenience",
icon: Calendar,
title: "24/7 Availability",
value: "Anytime",
},
id: "convenience", icon: Calendar,
title: "24/7 Availability", value: "Anytime"},
{
id: "reminders",
icon: Bell,
title: "Appointment Reminders",
value: "Automated",
},
id: "reminders", icon: Bell,
title: "Appointment Reminders", value: "Automated"},
{
id: "management",
icon: Settings,
title: "Easy Management",
value: "Online",
},
id: "management", icon: Settings,
title: "Easy Management", value: "Online"},
]}
title="Seamless Online Booking 線上預約"
description="Book your appointment anytime, anywhere. View available times, receive reminders, and manage your bookings online with ease."
@@ -268,25 +167,13 @@ export default function LandingPage() {
useInvertedBackground={true}
faqs={[
{
id: "q1",
title: "Does acupuncture hurt? 問：針灸會痛嗎？",
content: "Most patients experience little to no discomfort. Many find treatments relaxing and even fall asleep during sessions. 答：大多數患者只會感到輕微感覺，許多人認為治療過程十分放鬆，甚至會在治療期間入睡。",
},
id: "q1", title: "Does acupuncture hurt? 問：針灸會痛嗎？", content: "Most patients experience little to no discomfort. Many find treatments relaxing and even fall asleep during sessions. 答：大多數患者只會感到輕微感覺，許多人認為治療過程十分放鬆，甚至會在治療期間入睡。"},
{
id: "q2",
title: "How many treatments will I need? 問：需要治療多少次？",
content: "This depends on your specific condition and health goals. Your practitioner will discuss a personalized treatment plan with you during your initial consultation. 答：視您的病情及健康目標而定。您的中醫師將在初次診斷時與您討論個人化的治療方案。",
},
id: "q2", title: "How many treatments will I need? 問：需要治療多少次？", content: "This depends on your specific condition and health goals. Your practitioner will discuss a personalized treatment plan with you during your initial consultation. 答：視您的病情及健康目標而定。您的中醫師將在初次診斷時與您討論個人化的治療方案。"},
{
id: "q3",
title: "Do you accept insurance? 問：接受保險嗎？",
content: "While we do not directly bill insurance companies, receipts are provided for all treatments, which you can submit for insurance claims. 答：我們不直接向保險公司開具賬單，但會為所有治療提供收據，您可以提交這些收據進行保險理賠。",
},
id: "q3", title: "Do you accept insurance? 問：接受保險嗎？", content: "While we do not directly bill insurance companies, receipts are provided for all treatments, which you can submit for insurance claims. 答：我們不直接向保險公司開具賬單，但會為所有治療提供收據，您可以提交這些收據進行保險理賠。"},
{
id: "q4",
title: "What should I wear? 問：我應該穿什麼衣服？",
content: "Comfortable, loose-fitting clothing is recommended to allow easy access to acupuncture points and for your comfort during massage therapies. 答：建議穿著寬鬆舒適的衣服，以便於針灸點的接觸和在推拿治療期間保持舒適。",
},
id: "q4", title: "What should I wear? 問：我應該穿什麼衣服？", content: "Comfortable, loose-fitting clothing is recommended to allow easy access to acupuncture points and for your comfort during massage therapies. 答：建議穿著寬鬆舒適的衣服，以便於針灸點的接觸和在推拿治療期間保持舒適。"},
]}
title="Frequently Asked Questions 常見問題"
description="Find answers to common inquiries about our clinic, treatments, and what to expect during your visit to Zhong Yi Idea TCM Clinic."
@@ -298,24 +185,17 @@ export default function LandingPage() {
<ContactCTA
useInvertedBackground={false}
background={{
variant: "plain",
}}
variant: "plain"}}
tag="Connect With Us"
title="Contact Zhong Yi Idea TCM Clinic 聯絡我們"
description="We look forward to helping you achieve better health naturally. Reach out to us for appointments or inquiries without endless phone calls."
buttons={[
{
text: "Call Us",
href: "tel:+17801234567",
},
text: "Call Us", href: "tel:+17801234567"},
{
text: "Email Us",
href: "mailto:info@zhongyitcm.ca",
},
text: "Email Us", href: "mailto:info@zhongyitcm.ca"},
{
text: "Find Our Address",
href: "https://maps.google.com/?q=Zhong+Yi+Idea+TCM+Edmonton",
},
text: "Find Our Address", href: "https://maps.google.com/?q=Zhong+Yi+Idea+TCM+Edmonton"},
]}
/>
</div>
@@ -324,54 +204,33 @@ export default function LandingPage() {
<FooterSimple
columns={[
{
title: "Clinic",
items: [
title: "Clinic", items: [
{
label: "Home",
href: "#home",
},
label: "Home", href: "#home"},
{
label: "About Us",
href: "#about",
},
label: "About Us", href: "#about"},
{
label: "Services",
href: "#services",
},
label: "Services", href: "#services"},
{
label: "Shop",
href: "#shop",
},
label: "Shop", href: "#shop"},
],
},
{
title: "Support",
items: [
title: "Support", items: [
{
label: "Contact",
href: "#contact",
},
label: "Contact", href: "#contact"},
{
label: "FAQs",
href: "#faq",
},
label: "FAQs", href: "#faq"},
{
label: "Book Online",
href: "#booking",
},
label: "Book Online", href: "#booking"},
],
},
{
title: "Legal",
items: [
title: "Legal", items: [
{
label: "Privacy Policy",
href: "#",
},
label: "Privacy Policy", href: "#"},
{
label: "Terms of Service",
href: "#",
},
label: "Terms of Service", href: "#"},
],
},
]}