feat: added the code for the wireframe for all the pages

app/about/page.tsx

@@ -0,0 +1,22 @@
+import Layout from "components/Layout";
+
+const About: React.FC = () => {
+  return (
+    <Layout>
+      <section className="p-10 bg-blue-50">
+        <h1 className="text-3xl font-bold mb-4">About Us</h1>
+        <p className="mt-4 text-lg">
+          Lil Pals is a nurturing pre-school and daycare committed to providing a safe, supportive, and creative environment for early childhood development. We believe in fostering independent, curious, and empathetic young thinkers who are ready to engage with the world.
+        </p>
+        <p className="mt-4 text-lg">
+          Our highly trained faculty and staff focus on holistic growth, offering a comprehensive curriculum that blends academics with social, emotional, and physical development.
+        </p>
+        <p className="mt-4 text-lg">
+          We pride ourselves on being a community where children can thrive and develop their unique abilities at their own pace.
+        </p>
+      </section>
+    </Layout>
+  );
+};
+
+export default About;

app/admission/page.tsx

@@ -0,0 +1,25 @@
+import Layout from "components/Layout";
+
+const Admission: React.FC = () => {
+  return (
+    <Layout>
+      <section className="p-10 bg-red-50">
+        <h1 className="text-3xl font-bold mb-4">Admission Information</h1>
+        <p className="mt-4 text-lg">
+          We are excited to welcome new families to Lil Pals! Our admission process is simple and straightforward. Here’s how to apply:
+        </p>
+        <ol className="list-decimal ml-6 mt-4">
+          <li className="mb-2">Fill out the online application form.</li>
+          <li className="mb-2">Submit the required documents (birth certificate, vaccination records, etc.).</li>
+          <li className="mb-2">Schedule a visit or virtual tour of the school.</li>
+          <li className="mb-2">Attend an interview with our admissions team.</li>
+        </ol>
+        <p className="mt-4 text-lg">
+          We look forward to meeting you and your child. For more information, please contact us at <a href="mailto:admissions@lilpals.com" className="text-blue-500">admissions@lilpals.com</a>.
+        </p>
+      </section>
+    </Layout>
+  );
+};
+
+export default Admission;

app/blogs/page.tsx

@@ -0,0 +1,27 @@
+import Layout from "components/Layout";
+
+const Blogs: React.FC = () => {
+  return (
+    <Layout>
+      <section className="p-10 bg-indigo-50">
+        <h1 className="text-3xl font-bold mb-4">Our Blogs</h1>
+        <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
+          <div className="p-6 bg-white rounded shadow-md">
+            <h2 className="text-2xl font-bold mb-2">The Importance of Early Childhood Education</h2>
+            <p>Learn why early childhood education is the foundation of lifelong learning and development.</p>
+          </div>
+          <div className="p-6 bg-white rounded shadow-md">
+            <h2 className="text-2xl font-bold mb-2">How to Encourage Creativity in Children</h2>
+            <p>Explore fun, engaging ways to foster creativity and imagination in young minds.</p>
+          </div>
+          <div className="p-6 bg-white rounded shadow-md">
+            <h2 className="text-2xl font-bold mb-2">Tips for Smooth Pre-School Transitions</h2>
+            <p>Helpful tips for parents to make the transition to pre-school easier for their children.</p>
+          </div>
+        </div>
+      </section>
+    </Layout>
+  );
+};
+
+export default Blogs;

app/curriculum/page.tsx

@@ -0,0 +1,22 @@
+import Layout from "components/Layout";
+
+const Curriculum: React.FC = () => {
+  return (
+    <Layout>
+      <section className="p-10 bg-yellow-50">
+        <h1 className="text-3xl font-bold mb-4">Our Curriculum</h1>
+        <p className="mt-4 text-lg">
+          At Lil Pals, our curriculum is designed to cultivate curiosity and a love for learning. We integrate academics, social-emotional development, and physical activity in a balanced, well-rounded program.
+        </p>
+        <ul className="list-disc ml-6 mt-4">
+          <li className="mb-2">Cognitive Skills: We encourage problem-solving and critical thinking through play-based learning.</li>
+          <li className="mb-2">Language Development: We foster language skills through storytelling, reading, and phonics activities.</li>
+          <li className="mb-2">Creative Arts: Children express themselves through art, music, and creative play.</li>
+          <li className="mb-2">Physical Development: Our program includes physical activities to enhance motor skills, coordination, and overall health.</li>
+        </ul>
+      </section>
+    </Layout>
+  );
+};
+
+export default Curriculum;

app/franchise/page.tsx

@@ -0,0 +1,22 @@
+import Layout from "components/Layout";
+
+const Franchise: React.FC = () => {
+  return (
+    <Layout>
+      <section className="p-10 bg-purple-50">
+        <h1 className="text-3xl font-bold mb-4">Start a Franchise</h1>
+        <p className="mt-4 text-lg">
+          Join the Lil Pals family and become a part of our growing network of pre-schools and daycare centers. Starting a Lil Pals franchise is an opportunity to make a meaningful impact on the lives of young children in your community.
+        </p>
+        <p className="mt-4 text-lg">
+          As a franchise partner, you will receive comprehensive support, including training, marketing materials, and ongoing operational assistance.
+        </p>
+        <p className="mt-4 text-lg">
+          Interested in learning more? Contact us at <a href="mailto:franchise@lilpals.com" className="text-blue-500">franchise@lilpals.com</a> for further details and to discuss available opportunities.
+        </p>
+      </section>
+    </Layout>
+  );
+};
+
+export default Franchise;

app/home/page.tsx

@@ -0,0 +1,25 @@
+import Layout from "components/Layout";
+
+const Home: React.FC = () => {
+  return (
+    <Layout>
+      <section className="text-center bg-yellow-100 p-10">
+        <h1 className="text-4xl font-bold mb-4">A Pre-school and Daycare</h1>
+        <h2 className="text-2xl mb-6">for Free Thinkers</h2>
+        <img src="/plimages/slide.png" alt="Slide" className="mx-auto" />
+        <h1 className="text-xl italic mt-6">“This is a place where our child feels loved, valued, and excited to learn”</h1>
+      </section>
+      <section className="bg-white p-10">
+        <h2 className="text-3xl font-bold text-center mb-6">Our Overview</h2>
+        <div className="grid grid-cols-2 gap-4">
+          <div>Centres 130+</div>
+          <div>Children 130+</div>
+          <div>Faculty 600+</div>
+          <div>Decades 1</div>
+        </div>
+      </section>
+    </Layout>
+  );
+};
+
+export default Home;

app/layout.tsx

@@ -1,6 +1,13 @@
-import "styles/tailwind.css"
+export const metadata = {
+  title: 'Next.js',
+  description: 'Generated by Next.js',
+}
 
-export default function RootLayout({ children }: { children: React.ReactNode }) {
+export default function RootLayout({
+  children,
+}: {
+  children: React.ReactNode
+}) {
   return (
     <html lang="en">
       <body>{children}</body>

app/page.tsx

@@ -1,65 +1,25 @@
-import { Metadata } from "next"
+import Layout from "components/Layout";
-import { Button } from "components/Button/Button"
-import { LP_GRID_ITEMS } from "lp-items"
 
-export const metadata: Metadata = {
+const Home: React.FC = () => {
-  title: "Next.js Enterprise Boilerplate",
-  twitter: {
-    card: "summary_large_image",
-  },
-  openGraph: {
-    url: "https://next-enterprise.vercel.app/",
-    images: [
-      {
-        width: 1200,
-        height: 630,
-        url: "https://raw.githubusercontent.com/Blazity/next-enterprise/main/.github/assets/project-logo.png",
-      },
-    ],
-  },
-}
-
-export default function Web() {
   return (
-    <>
+    <Layout>
-      <section className="bg-white dark:bg-gray-900">
+      <section className="text-center bg-yellow-100 p-10">
-        <div className="mx-auto grid max-w-screen-xl px-4 py-8 text-center lg:py-16">
+        <h1 className="text-4xl font-bold mb-4">A Pre-school and Daycare</h1>
-          <div className="mx-auto place-self-center">
+        <h2 className="text-2xl mb-6">for Free Thinkers</h2>
-            <h1 className="mb-4 max-w-2xl text-4xl font-extrabold leading-none tracking-tight dark:text-white md:text-5xl xl:text-6xl">
+        <img src="/plimages/slide.png" alt="Slide" className="mx-auto" />
-              Next.js Enterprise Boilerplate
+        <h1 className="text-xl italic mt-6">“This is a place where our child feels loved, valued, and excited to learn”</h1>
-            </h1>
+      </section>
-            <p className="mb-6 max-w-2xl font-light text-gray-500 dark:text-gray-400 md:text-lg lg:mb-8 lg:text-xl">
+      <section className="bg-white p-10">
-              Jumpstart your enterprise project with our feature-packed, high-performance Next.js boilerplate!
+        <h2 className="text-3xl font-bold text-center mb-6">Our Overview</h2>
-              Experience rapid UI development, AI-powered code reviews, and an extensive suite of tools for a smooth and
+        <div className="grid grid-cols-2 gap-4">
-              enjoyable development process.
+          <div>Centres 130+</div>
-            </p>
+          <div>Children 130+</div>
-            <Button href="https://github.com/Blazity/next-enterprise" className="mr-3">
+          <div>Faculty 600+</div>
-              Get started
+          <div>Decades 1</div>
-            </Button>
-            <Button
-              href="https://vercel.com/new/git/external?repository-url=https://github.com/Blazity/next-enterprise"
-              intent="secondary"
-            >
-              Deploy Now
-            </Button>
-          </div>
         </div>
       </section>
-      <section className="bg-white dark:bg-gray-900">
+    </Layout>
-        <div className="mx-auto max-w-screen-xl px-4 py-8 sm:py-16 lg:px-6">
+  );
-          <div className="justify-center space-y-8 md:grid md:grid-cols-2 md:gap-12 md:space-y-0 lg:grid-cols-3">
+};
-            {LP_GRID_ITEMS.map((singleItem) => (
+
-              <div key={singleItem.title} className="flex flex-col items-center justify-center text-center">
+export default Home;
-                <div className="mb-4 flex h-10 w-10 items-center justify-center rounded-full bg-primary-100 p-1.5 text-blue-700 dark:bg-primary-900 lg:h-12 lg:w-12">
-                  {singleItem.icon}
-                </div>
-                <h3 className="mb-2 text-xl font-bold dark:text-white">{singleItem.title}</h3>
-                <p className="text-gray-500 dark:text-gray-400">{singleItem.description}</p>
-              </div>
-            ))}
-          </div>
-        </div>
-      </section>
-    </>
-  )
-}

app/programs/page.tsx

@@ -0,0 +1,33 @@
+import Layout from "components/Layout";
+
+const Programs: React.FC = () => {
+  return (
+    <Layout>
+      <section className="p-10 bg-green-50">
+        <h1 className="text-3xl font-bold mb-4">Our Programs</h1>
+        <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
+          <div className="p-6 bg-white rounded shadow-md">
+            <h2 className="text-2xl font-bold mb-2">Pre-School Program</h2>
+            <p>
+              Our pre-school program is designed to help children develop fundamental skills through interactive learning and play. We emphasize cognitive, social, and emotional growth.
+            </p>
+          </div>
+          <div className="p-6 bg-white rounded shadow-md">
+            <h2 className="text-2xl font-bold mb-2">Daycare Program</h2>
+            <p>
+              Our daycare program provides a safe, engaging environment where children can explore their creativity and interact with peers. Our staff ensures each child receives individual care and attention.
+            </p>
+          </div>
+          <div className="p-6 bg-white rounded shadow-md">
+            <h2 className="text-2xl font-bold mb-2">Extracurricular Activities</h2>
+            <p>
+              We offer a variety of extracurricular activities, including art, music, dance, and sports, to nurture children's creative and physical talents.
+            </p>
+          </div>
+        </div>
+      </section>
+    </Layout>
+  );
+};
+
+export default Programs;

components/Footer/index.tsx

@@ -0,0 +1,23 @@
+const Footer: React.FC = () => {
+  return (
+    <footer className="bg-gray-800 p-4 text-white text-center">
+      <div className="newsletter">
+        <input type="email" placeholder="Enter your email" className="p-2 mr-2" />
+        <button className="bg-blue-500 p-2">Subscribe</button>
+      </div>
+      <div className="contact-info mt-4">
+        <h3>Contact Us</h3>
+        <p>Email: <a href="mailto:enquiry@lilpals.com" className="text-blue-300">enquiry@lilpals.com</a></p>
+        <p>Phone: <a href="tel:+919972527072" className="text-blue-300">+91 99725 27072</a></p>
+        <p>Address: Learning Edge India Pvt Ltd, #2, Honeydew Mansion, Next to McDonald’s</p>
+      </div>
+      <div className="footer-links mt-4">
+        <a href="/terms-of-service" className="text-blue-300 mr-4">Terms of Service</a>
+        <a href="/my-account" className="text-blue-300 mr-4">My Account</a>
+        <a href="/refer-and-earn" className="text-blue-300">Refer & Earn</a>
+      </div>
+    </footer>
+  );
+};
+
+export default Footer;

components/Header/index.tsx

@@ -0,0 +1,24 @@
+import Link from 'next/link';
+
+const Header: React.FC = () => {
+  return (
+    <header className="bg-blue-500 flex justify-between items-center p-4">
+      <div className="left">
+        <img src="/plimages/Group1.png" alt="logo" className="w-12" />
+      </div>
+      <nav className="right">
+        <ul className="flex space-x-4">
+          <li><Link href="home">HOME</Link></li>
+          <li><Link href="about">ABOUT US</Link></li>
+          <li><Link href="programs">PROGRAMS</Link></li>
+          <li><Link href="curriculum">CURRICULUM</Link></li>
+          <li><Link href="admission">ADMISSION</Link></li>
+          <li><Link href="franchise">FRANCHISE</Link></li>
+          <li><Link href="blogs">BLOGS</Link></li>
+        </ul>
+      </nav>
+    </header>
+  );
+};
+
+export default Header;

components/Layout/index.tsx

@@ -0,0 +1,23 @@
+import Footer from 'components/Footer';
+import Header from 'components/Header';
+import { ReactNode } from 'react';
+import "styles/tailwind.css"
+
+
+interface LayoutProps {
+  children: ReactNode;
+}
+
+const Layout: React.FC<LayoutProps> = ({ children }) => {
+  return (
+    <div className="flex flex-col min-h-screen">
+      <Header />
+      <main className="flex-grow">
+        {children}
+      </main>
+      <Footer />
+    </div>
+  );
+};
+
+export default Layout;