169 lines
6.1 KiB
TypeScript
169 lines
6.1 KiB
TypeScript
"use client";
|
||
|
||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||
import ReactLenis from "lenis/react";
|
||
import FaqDouble from '@/components/sections/faq/FaqDouble';
|
||
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
|
||
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
|
||
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
||
|
||
export default function LandingPage() {
|
||
return (
|
||
<ThemeProvider
|
||
defaultButtonVariant="elastic-effect"
|
||
defaultTextAnimation="background-highlight"
|
||
borderRadius="rounded"
|
||
contentWidth="mediumLarge"
|
||
sizing="largeSizeMediumTitles"
|
||
background="noiseDiagonalGradient"
|
||
cardStyle="gradient-radial"
|
||
primaryButtonStyle="gradient"
|
||
secondaryButtonStyle="solid"
|
||
headingFontWeight="normal"
|
||
>
|
||
<ReactLenis root>
|
||
<div id="nav" data-section="nav">
|
||
<NavbarStyleApple
|
||
navItems={[
|
||
{
|
||
name: "トップ",
|
||
id: "/",
|
||
},
|
||
{
|
||
name: "メニュー",
|
||
id: "/menu",
|
||
},
|
||
{
|
||
name: "店舗情報",
|
||
id: "/access",
|
||
},
|
||
{
|
||
name: "ギャラリー",
|
||
id: "/gallery",
|
||
},
|
||
{
|
||
name: "お問い合わせ",
|
||
id: "/contact",
|
||
},
|
||
]}
|
||
brandName="ココミル"
|
||
/>
|
||
</div>
|
||
|
||
<div id="store-info" data-section="store-info">
|
||
<MetricCardEleven
|
||
animationType="slide-up"
|
||
textboxLayout="default"
|
||
useInvertedBackground={false}
|
||
metrics={[
|
||
{
|
||
id: "info-address",
|
||
value: "東京都大田区西六郷２丁目５−８ シルクハウス １Ｆ",
|
||
title: "住所",
|
||
description: "京急雑色駅から徒歩圏内",
|
||
imageSrc: "http://img.b2bpic.net/free-photo/distance-marker-gps-global-positioning-system_53876-132283.jpg",
|
||
imageAlt: "住所アイコン",
|
||
},
|
||
{
|
||
id: "info-phone",
|
||
value: "03-3738-4601",
|
||
title: "電話番号",
|
||
description: "ご予約はこちらからどうぞ",
|
||
imageSrc: "http://img.b2bpic.net/free-photo/incoming-call-front-side_187299-39477.jpg",
|
||
imageAlt: "電話アイコン",
|
||
},
|
||
{
|
||
id: "info-hours",
|
||
value: "11:00 - 18:00",
|
||
title: "営業時間",
|
||
description: "定休日：水曜日（仮）",
|
||
imageSrc: "http://img.b2bpic.net/free-photo/vintage-clock_1203-2886.jpg",
|
||
imageAlt: "営業時間アイコン",
|
||
},
|
||
{
|
||
id: "info-parking",
|
||
value: "駐車場なし / 駐輪場あり",
|
||
title: "アクセス",
|
||
description: "指定スペースに数台駐車可能",
|
||
imageSrc: "http://img.b2bpic.net/free-vector/25-transport-blue-icon-pack_1142-25676.jpg",
|
||
imageAlt: "駐車場アイコン",
|
||
},
|
||
{
|
||
id: "info-takeout",
|
||
value: "テイクアウト可能",
|
||
title: "サービスオプション",
|
||
description: "一部メニューはお持ち帰りいただけます",
|
||
imageSrc: "http://img.b2bpic.net/free-vector/green-eco-bag-design-with-grass_1394-1283.jpg",
|
||
imageAlt: "テイクアウトアイコン",
|
||
},
|
||
{
|
||
imageSrc: "http://img.b2bpic.net/free-photo/vertical-shot-waiter-serving-delicious-millefeuille-cake-with-powdered-sugar_181624-57695.jpg?_wi=2",
|
||
imageAlt: "location pin map icon",
|
||
id: "6",
|
||
},
|
||
]}
|
||
title="店舗情報・アクセス"
|
||
description="ココミルの詳細情報とアクセス方法をご案内いたします。皆様のご来店を心よりお待ちしております。"
|
||
/>
|
||
</div>
|
||
|
||
<div id="access-details-faq" data-section="access-details-faq">
|
||
<FaqDouble
|
||
textboxLayout="default"
|
||
useInvertedBackground={true}
|
||
faqs={[
|
||
{
|
||
id: "faq1",
|
||
title: "どのような決済方法が使えますか？",
|
||
content: "デビットカード、楽天ペイ、各種クレジットカード（Visa, Mastercard, JCBなど）がご利用いただけます。",
|
||
},
|
||
{
|
||
id: "faq2",
|
||
title: "子供連れでも大丈夫ですか？",
|
||
content: "はい、お子様連れのお客様も歓迎しております。お子様向けのお席もございますので、お気軽にお越しください。",
|
||
},
|
||
{
|
||
id: "faq3",
|
||
title: "バリアフリー対応はしていますか？",
|
||
content: "車椅子対応の入り口を設けております。お困りの際はスタッフまでお声がけください。（駐車場は別途確認が必要）",
|
||
},
|
||
{
|
||
id: "faq4",
|
||
title: "どのような雰囲気のお店ですか？",
|
||
content: "カジュアルで今っぽく、静かで落ち着いた雰囲気です。一人でもゆったり過ごせる居心地の良い空間を提供しています。",
|
||
},
|
||
{
|
||
id: "faq5",
|
||
title: "どんなメニューが人気ですか？",
|
||
content: "朝食やランチにスフレパンケーキが人気です。一人での食事にも最適とのお声を多くいただいております。",
|
||
},
|
||
{
|
||
id: "faq6",
|
||
title: "お茶の種類は豊富ですか？",
|
||
content: "はい、お茶の種類を豊富にご用意しております。コーヒーも美味しいとご好評いただいておりますので、ぜひお試しください。",
|
||
},
|
||
]}
|
||
title="店舗の特徴とよくあるご質問"
|
||
description="ココミルの魅力と、お客様からよくいただくご質問にお答えします。"
|
||
faqsAnimation="slide-up"
|
||
/>
|
||
</div>
|
||
|
||
<div id="footer" data-section="footer">
|
||
<FooterLogoReveal
|
||
logoText="ココミル"
|
||
leftLink={{
|
||
text: "プライバシーポリシー",
|
||
href: "#",
|
||
}}
|
||
rightLink={{
|
||
text: "利用規約",
|
||
href: "#",
|
||
}}
|
||
/>
|
||
</div>
|
||
</ReactLenis>
|
||
</ThemeProvider>
|
||
);
|
||
}
|