Bob AI: Update font and color palette for a warm retro Kyoto aesthet

2026-06-15 12:29:36 +00:00
8 changed files with 265 additions and 188 deletions
--- a/src/index.css
+++ b/src/index.css
@@ -1,19 +1,19 @@
-@import url('https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;500;600;700&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Shippori+Mincho:wght@400;500;600;700&display=swap');
@import "tailwindcss";
@import "./styles/masks.css";
@import "./styles/animations.css";

 :root {
  /* @colorThemes/lightTheme/grayNavyBlue */
-  --background: #f5f4ef;
-  --card: #dad6cd;
-  --foreground: #2a2928;
-  --primary-cta: #2a2928;
-  --primary-cta-text: #f5f4ef;
-  --secondary-cta: #ecebea;
-  --secondary-cta-text: #2a2928;
+  --background: #f4ebd9;
+  --card: #e8ddc5;
+  --foreground: #3b2f2f;
+  --primary-cta: #8b2500;
+  --primary-cta-text: #f4ebd9;
+  --secondary-cta: #d9cbb0;
+  --secondary-cta-text: #3b2f2f;
  --accent: #ffffff;
-  --background-accent: #c6b180;
+  --background-accent: #c4a482;

  /* @layout/border-radius/rounded */
  --radius: 0.5rem;
@@ -88,8 +88,8 @@
  --color-background-accent: var(--background-accent);

  /* Fonts */
-  --font-sans: 'Inter Tight', sans-serif;
-  --font-tight: "Inter Tight", sans-serif;
+  --font-sans: 'Shippori Mincho', serif;
+  --font-tight: "Shippori Mincho", serif;
  --font-mono: monospace;

  /* Border Radius */
--- a/src/pages/HomePage.tsx
+++ b/src/pages/HomePage.tsx
@@ -1,187 +1,30 @@
-import AboutMediaOverlay from '@/components/sections/about/AboutMediaOverlay';
-import ContactCta from '@/components/sections/contact/ContactCta';
-import FaqTabbedAccordion from '@/components/sections/faq/FaqTabbedAccordion';
-import FeaturesImageBento from '@/components/sections/features/FeaturesImageBento';
-import HeroOverlay from '@/components/sections/hero/HeroOverlay';
-import TestimonialQuoteCards from '@/components/sections/testimonial/TestimonialQuoteCards';
-import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+// AUTO-GENERATED shell by per-section-migrate.
+// Section bodies live in ./<PageBase>/sections/<X>.tsx. Edit the section
+// files directly. Non-block content (wrappers, non-inlinable sections) is
+// preserved inline; extracted section blocks become <XSection/> refs.

-export default function HomePage() {
+import React from 'react';
+import HeroSection from './HomePage/sections/Hero';
+import AboutSection from './HomePage/sections/About';
+import MenuSection from './HomePage/sections/Menu';
+import TestimonialsSection from './HomePage/sections/Testimonials';
+import FaqSection from './HomePage/sections/Faq';
+import ContactSection from './HomePage/sections/Contact';
+
+export default function HomePage(): React.JSX.Element {
  return (
-    <>
-  <div id="hero" data-section="hero">
-    <SectionErrorBoundary name="hero">
-          <HeroOverlay
-      tag="Kyoto Kawaramachi"
-      title="こだわりホルモン処 じゃまん"
-      description="京都河原町で厳選されたホルモンを最高の状態で。至福の焼肉体験をご提供します。"
-      primaryButton={{
-        text: "予約する",
-        href: "#contact",
-      }}
-      secondaryButton={{
-        text: "メニューを見る",
-        href: "#menu",
-      }}
-      imageSrc="http://img.b2bpic.net/free-photo/steak-beef-meat_1203-8373.jpg"
-    />
-    </SectionErrorBoundary>
-  </div>
+<>
+  <HeroSection />

-  <div id="about" data-section="about">
-    <SectionErrorBoundary name="about">
-          <AboutMediaOverlay
-      tag="Our Story"
-      title="素材へのこだわり"
-      description="毎日仕入れる新鮮なホルモンは、職人が一つ一つ丁寧に下処理を行っております。秘伝のタレと炭火の香りが食欲をそそる、ここだけの味をお楽しみください。"
-      imageSrc="http://img.b2bpic.net/free-photo/tattooed-hands-hold-plate-with-three-cow-steaks-hungry-dogs-is-watching_346278-532.jpg"
-    />
-    </SectionErrorBoundary>
-  </div>
+  <AboutSection />

-  <div id="menu" data-section="menu">
-    <SectionErrorBoundary name="menu">
-          <FeaturesImageBento
-      tag="Specialty Menu"
-      title="逸品メニュー"
-      description="当店自慢のホルモン盛り合わせから、店長厳選の極上肉までご堪能ください。"
-      items={[
-        {
-          title: "特選ホルモン盛り",
-          description: "新鮮なホルモンを贅沢に。",
-          imageSrc: "http://img.b2bpic.net/free-photo/raw-wagyu-beef-steak-side-dishes-prepared-charcoal-grilling_1308-190332.jpg",
-        },
-        {
-          title: "名物タン塩",
-          description: "厚切りでジューシー。",
-          imageSrc: "http://img.b2bpic.net/free-photo/traditional-japanese-food-grill_23-2148759598.jpg",
-        },
-        {
-          title: "ハラミステーキ",
-          description: "柔らかく旨味たっぷり。",
-          imageSrc: "http://img.b2bpic.net/free-photo/tuna-diet-restaurant-seafood-fish_1203-4009.jpg",
-        },
-        {
-          title: "上ミノ",
-          description: "コリコリの食感が魅力。",
-          imageSrc: "http://img.b2bpic.net/free-photo/sushi-is-beautifully-arranged-plate_1150-22655.jpg",
-        },
-        {
-          title: "黒毛和牛カルビ",
-          description: "とろける脂の甘み。",
-          imageSrc: "http://img.b2bpic.net/free-photo/pork-sliced-grilling-pan_1339-6861.jpg",
-        },
-        {
-          title: "キムチ盛り合わせ",
-          description: "自家製の絶品キムチ。",
-          imageSrc: "http://img.b2bpic.net/free-photo/top-view-creamy-soup-served-bread-bowl_140725-7070.jpg",
-        },
-        {
-          title: "特製冷麺",
-          description: "締めはさっぱりと。",
-          imageSrc: "http://img.b2bpic.net/free-photo/chicken-pieces-grilled-teriyaki-sauce_114579-1720.jpg",
-        },
-      ]}
-    />
-    </SectionErrorBoundary>
-  </div>
+  <MenuSection />

-  <div id="testimonials" data-section="testimonials">
-    <SectionErrorBoundary name="testimonials">
-          <TestimonialQuoteCards
-      tag="Voices"
-      title="お客様の声"
-      description="多くのお客様に愛されております。"
-      testimonials={[
-        {
-          name: "A様",
-          role: "常連のお客様",
-          quote: "ここのホルモンは本当に新鮮で、他の店では食べられません。",
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-young-friends-restaurant_23-2148395397.jpg",
-        },
-        {
-          name: "B様",
-          role: "観光客",
-          quote: "京都旅行の夕食にぴったりでした。お店の雰囲気も最高です。",
-          imageSrc: "http://img.b2bpic.net/free-photo/happy-couple-holding-hands-talking-thanksgiving-meal-dining-room_637285-10153.jpg",
-        },
-        {
-          name: "C様",
-          role: "グルメな方",
-          quote: "店長のおすすめを頼めば間違いなし！とても美味しかったです。",
-          imageSrc: "http://img.b2bpic.net/free-photo/woman-eating-restaurant_23-2148006700.jpg",
-        },
-        {
-          name: "D様",
-          role: "地元の会社員",
-          quote: "仕事帰りの癒やしです。お酒も進む味付けが最高。",
-          imageSrc: "http://img.b2bpic.net/free-photo/glad-playful-woman-with-bunch-pink-hair-tattoo-wearing-white-t-shirt-blinking-eye-smiling-broadly-while-flirting-with-her-boyfriend-pretty-hipster-female-having-fun-indoors-isolated_273609-572.jpg",
-        },
-        {
-          name: "E様",
-          role: "家族連れ",
-          quote: "家族みんなで楽しめました。店員さんの対応も親切です。",
-          imageSrc: "http://img.b2bpic.net/free-photo/group-friends-having-lunch-together-restaurant_23-2150520109.jpg",
-        },
-      ]}
-    />
-    </SectionErrorBoundary>
-  </div>
+  <TestimonialsSection />

-  <div id="faq" data-section="faq">
-    <SectionErrorBoundary name="faq">
-          <FaqTabbedAccordion
-      tag="FAQ"
-      title="よくあるご質問"
-      description="ご予約や店舗に関する疑問にお答えします。"
-      categories={[
-        {
-          name: "予約について",
-          items: [
-            {
-              question: "予約は必要ですか？",
-              answer: "混雑時はご予約をおすすめしております。",
-            },
-            {
-              question: "当日予約は可能ですか？",
-              answer: "お席の状況により可能です。お電話ください。",
-            },
-          ],
-        },
-        {
-          name: "店舗について",
-          items: [
-            {
-              question: "カードは使えますか？",
-              answer: "はい、主要なクレジットカードがご利用いただけます。",
-            },
-            {
-              question: "貸切はできますか？",
-              answer: "人数に応じて承っておりますので、ご相談ください。",
-            },
-          ],
-        },
-      ]}
-    />
-    </SectionErrorBoundary>
-  </div>
+  <FaqSection />

-  <div id="contact" data-section="contact">
-    <SectionErrorBoundary name="contact">
-          <ContactCta
-      tag="Access"
-      text="京都河原町で、本物のホルモンを。ご予約・お問い合わせはお気軽にどうぞ。"
-      primaryButton={{
-        text: "予約電話番号",
-        href: "tel:00-0000-0000",
-      }}
-      secondaryButton={{
-        text: "Google Maps",
-        href: "https://maps.google.com",
-      }}
-    />
-    </SectionErrorBoundary>
-  </div>
+  <ContactSection />
    </>
  );
 }
--- a/src/pages/HomePage/sections/About.tsx
+++ b/src/pages/HomePage/sections/About.tsx
@@ -0,0 +1,21 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "about" section.
+
+import React from 'react';
+import AboutMediaOverlay from '@/components/sections/about/AboutMediaOverlay';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function AboutSection(): React.JSX.Element {
+  return (
+    <div id="about" data-section="about">
+        <SectionErrorBoundary name="about">
+              <AboutMediaOverlay
+          tag="Our Story"
+          title="素材へのこだわり"
+          description="毎日仕入れる新鮮なホルモンは、職人が一つ一つ丁寧に下処理を行っております。秘伝のタレと炭火の香りが食欲をそそる、ここだけの味をお楽しみください。"
+          imageSrc="http://img.b2bpic.net/free-photo/tattooed-hands-hold-plate-with-three-cow-steaks-hungry-dogs-is-watching_346278-532.jpg"
+        />
+        </SectionErrorBoundary>
+      </div>
+  );
+}
--- a/src/pages/HomePage/sections/Contact.tsx
+++ b/src/pages/HomePage/sections/Contact.tsx
@@ -0,0 +1,27 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "contact" section.
+
+import React from 'react';
+import ContactCta from '@/components/sections/contact/ContactCta';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function ContactSection(): React.JSX.Element {
+  return (
+    <div id="contact" data-section="contact">
+        <SectionErrorBoundary name="contact">
+              <ContactCta
+          tag="Access"
+          text="京都河原町で、本物のホルモンを。ご予約・お問い合わせはお気軽にどうぞ。"
+          primaryButton={{
+            text: "予約電話番号",
+            href: "tel:00-0000-0000",
+          }}
+          secondaryButton={{
+            text: "Google Maps",
+            href: "https://maps.google.com",
+          }}
+        />
+        </SectionErrorBoundary>
+      </div>
+  );
+}
--- a/src/pages/HomePage/sections/Faq.tsx
+++ b/src/pages/HomePage/sections/Faq.tsx
@@ -0,0 +1,48 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "faq" section.
+
+import React from 'react';
+import FaqTabbedAccordion from '@/components/sections/faq/FaqTabbedAccordion';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function FaqSection(): React.JSX.Element {
+  return (
+    <div id="faq" data-section="faq">
+        <SectionErrorBoundary name="faq">
+              <FaqTabbedAccordion
+          tag="FAQ"
+          title="よくあるご質問"
+          description="ご予約や店舗に関する疑問にお答えします。"
+          categories={[
+            {
+              name: "予約について",
+              items: [
+                {
+                  question: "予約は必要ですか？",
+                  answer: "混雑時はご予約をおすすめしております。",
+                },
+                {
+                  question: "当日予約は可能ですか？",
+                  answer: "お席の状況により可能です。お電話ください。",
+                },
+              ],
+            },
+            {
+              name: "店舗について",
+              items: [
+                {
+                  question: "カードは使えますか？",
+                  answer: "はい、主要なクレジットカードがご利用いただけます。",
+                },
+                {
+                  question: "貸切はできますか？",
+                  answer: "人数に応じて承っておりますので、ご相談ください。",
+                },
+              ],
+            },
+          ]}
+        />
+        </SectionErrorBoundary>
+      </div>
+  );
+}
--- a/src/pages/HomePage/sections/Hero.tsx
+++ b/src/pages/HomePage/sections/Hero.tsx
@@ -0,0 +1,29 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "hero" section.
+
+import React from 'react';
+import HeroOverlay from '@/components/sections/hero/HeroOverlay';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function HeroSection(): React.JSX.Element {
+  return (
+    <div id="hero" data-section="hero">
+        <SectionErrorBoundary name="hero">
+              <HeroOverlay
+          tag="Kyoto Kawaramachi"
+          title="こだわりホルモン処 じゃまん"
+          description="京都河原町で厳選されたホルモンを最高の状態で。至福の焼肉体験をご提供します。"
+          primaryButton={{
+            text: "予約する",
+            href: "#contact",
+          }}
+          secondaryButton={{
+            text: "メニューを見る",
+            href: "#menu",
+          }}
+          imageSrc="http://img.b2bpic.net/free-photo/steak-beef-meat_1203-8373.jpg"
+        />
+        </SectionErrorBoundary>
+      </div>
+  );
+}
--- a/src/pages/HomePage/sections/Menu.tsx
+++ b/src/pages/HomePage/sections/Menu.tsx
@@ -0,0 +1,57 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "menu" section.
+
+import React from 'react';
+import FeaturesImageBento from '@/components/sections/features/FeaturesImageBento';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function MenuSection(): React.JSX.Element {
+  return (
+    <div id="menu" data-section="menu">
+        <SectionErrorBoundary name="menu">
+              <FeaturesImageBento
+          tag="Specialty Menu"
+          title="逸品メニュー"
+          description="当店自慢のホルモン盛り合わせから、店長厳選の極上肉までご堪能ください。"
+          items={[
+            {
+              title: "特選ホルモン盛り",
+              description: "新鮮なホルモンを贅沢に。",
+              imageSrc: "http://img.b2bpic.net/free-photo/raw-wagyu-beef-steak-side-dishes-prepared-charcoal-grilling_1308-190332.jpg",
+            },
+            {
+              title: "名物タン塩",
+              description: "厚切りでジューシー。",
+              imageSrc: "http://img.b2bpic.net/free-photo/traditional-japanese-food-grill_23-2148759598.jpg",
+            },
+            {
+              title: "ハラミステーキ",
+              description: "柔らかく旨味たっぷり。",
+              imageSrc: "http://img.b2bpic.net/free-photo/tuna-diet-restaurant-seafood-fish_1203-4009.jpg",
+            },
+            {
+              title: "上ミノ",
+              description: "コリコリの食感が魅力。",
+              imageSrc: "http://img.b2bpic.net/free-photo/sushi-is-beautifully-arranged-plate_1150-22655.jpg",
+            },
+            {
+              title: "黒毛和牛カルビ",
+              description: "とろける脂の甘み。",
+              imageSrc: "http://img.b2bpic.net/free-photo/pork-sliced-grilling-pan_1339-6861.jpg",
+            },
+            {
+              title: "キムチ盛り合わせ",
+              description: "自家製の絶品キムチ。",
+              imageSrc: "http://img.b2bpic.net/free-photo/top-view-creamy-soup-served-bread-bowl_140725-7070.jpg",
+            },
+            {
+              title: "特製冷麺",
+              description: "締めはさっぱりと。",
+              imageSrc: "http://img.b2bpic.net/free-photo/chicken-pieces-grilled-teriyaki-sauce_114579-1720.jpg",
+            },
+          ]}
+        />
+        </SectionErrorBoundary>
+      </div>
+  );
+}
--- a/src/pages/HomePage/sections/Testimonials.tsx
+++ b/src/pages/HomePage/sections/Testimonials.tsx
@@ -0,0 +1,52 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "testimonials" section.
+
+import React from 'react';
+import TestimonialQuoteCards from '@/components/sections/testimonial/TestimonialQuoteCards';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function TestimonialsSection(): React.JSX.Element {
+  return (
+    <div id="testimonials" data-section="testimonials">
+        <SectionErrorBoundary name="testimonials">
+              <TestimonialQuoteCards
+          tag="Voices"
+          title="お客様の声"
+          description="多くのお客様に愛されております。"
+          testimonials={[
+            {
+              name: "A様",
+              role: "常連のお客様",
+              quote: "ここのホルモンは本当に新鮮で、他の店では食べられません。",
+              imageSrc: "http://img.b2bpic.net/free-photo/close-up-young-friends-restaurant_23-2148395397.jpg",
+            },
+            {
+              name: "B様",
+              role: "観光客",
+              quote: "京都旅行の夕食にぴったりでした。お店の雰囲気も最高です。",
+              imageSrc: "http://img.b2bpic.net/free-photo/happy-couple-holding-hands-talking-thanksgiving-meal-dining-room_637285-10153.jpg",
+            },
+            {
+              name: "C様",
+              role: "グルメな方",
+              quote: "店長のおすすめを頼めば間違いなし！とても美味しかったです。",
+              imageSrc: "http://img.b2bpic.net/free-photo/woman-eating-restaurant_23-2148006700.jpg",
+            },
+            {
+              name: "D様",
+              role: "地元の会社員",
+              quote: "仕事帰りの癒やしです。お酒も進む味付けが最高。",
+              imageSrc: "http://img.b2bpic.net/free-photo/glad-playful-woman-with-bunch-pink-hair-tattoo-wearing-white-t-shirt-blinking-eye-smiling-broadly-while-flirting-with-her-boyfriend-pretty-hipster-female-having-fun-indoors-isolated_273609-572.jpg",
+            },
+            {
+              name: "E様",
+              role: "家族連れ",
+              quote: "家族みんなで楽しめました。店員さんの対応も親切です。",
+              imageSrc: "http://img.b2bpic.net/free-photo/group-friends-having-lunch-together-restaurant_23-2150520109.jpg",
+            },
+          ]}
+        />
+        </SectionErrorBoundary>
+      </div>
+  );
+}