From 0218e4c7f545a3dfb39f4c1ae7285618daea2d7f Mon Sep 17 00:00:00 2001
From: AI Studio <ai@google.com>
Date: Tue, 19 May 2026 21:59:20 +0000
Subject: [PATCH] feat: inject dynamic ThemeListener for fonts and colors

---
 Template-01/src/App.tsx | 2 ++
 Template-02/src/App.tsx | 2 ++
 2 files changed, 4 insertions(+)

diff --git a/Template-01/src/App.tsx b/Template-01/src/App.tsx
index c46708b..69cffc3 100644
--- a/Template-01/src/App.tsx
+++ b/Template-01/src/App.tsx
@@ -1,3 +1,4 @@
+import { ThemeListener } from './components/layout/ThemeListener';
 import { BrowserRouter, Routes, Route, useLocation } from 'react-router-dom';
 import { useEffect } from 'react';
 import { Navbar } from './components/navbar';
@@ -27,6 +28,7 @@ export default function App() {
     <BrowserRouter>
       <ScrollToTop />
       <div className="min-h-screen flex flex-col font-sans">
+      <ThemeListener />
         <Navbar />
         <main className="flex-grow">
           <Routes>
diff --git a/Template-02/src/App.tsx b/Template-02/src/App.tsx
index f1316d3..35467db 100644
--- a/Template-02/src/App.tsx
+++ b/Template-02/src/App.tsx
@@ -1,3 +1,4 @@
+import { ThemeListener } from './components/layout/ThemeListener';
 import { BrowserRouter, Routes, Route, useLocation } from 'react-router-dom';
 import { useEffect } from 'react';
 import { HelmetProvider } from 'react-helmet-async';
@@ -32,6 +33,7 @@ function RouteTracker() {
 export default function App() {
   return (
     <HelmetProvider>
+      <ThemeListener />
       <BrowserRouter>
         <RouteTracker />
         <div className="min-h-screen flex flex-col font-sans">