From 2d380e5975d8110976b3225de60978ea928e7460 Mon Sep 17 00:00:00 2001
From: ca <achinga.chris@gmail.com>
Date: Wed, 11 Dec 2024 13:28:09 +0300
Subject: [PATCH] refactor: update README title, change links in Header and
 Hero components, and add CI workflow for Next.js app

---
 .github/workflows/nextjs-ci.yml          |  35 ++++++
 README.md                                |   2 +-
 app/components/landing_page/FAQs.tsx     | 135 ---------------------
 app/components/landing_page/Features.tsx | 148 -----------------------
 app/components/landing_page/Hero.tsx     |   5 +-
 app/components/landing_page/Services.tsx | 136 ---------------------
 ui/Header.tsx                            |   4 +-
 7 files changed, 41 insertions(+), 424 deletions(-)
 create mode 100644 .github/workflows/nextjs-ci.yml
 delete mode 100644 app/components/landing_page/FAQs.tsx
 delete mode 100644 app/components/landing_page/Features.tsx
 delete mode 100644 app/components/landing_page/Services.tsx

diff --git a/.github/workflows/nextjs-ci.yml b/.github/workflows/nextjs-ci.yml
new file mode 100644
index 0000000..ab27cea
--- /dev/null
+++ b/.github/workflows/nextjs-ci.yml
@@ -0,0 +1,35 @@
+name: CI for Next.js App
+
+on:
+  push:
+    branches:
+      - main
+      - staging:dev-patch-main
+  pull_request:
+
+jobs:
+  ci:
+    name: Continuous Integration
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout Repository
+        uses: actions/checkout@v3
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v3
+        with:
+          node-version: 20
+          cache: 'npm'
+
+      - name: Install Dependencies
+        run: npm ci
+
+      - name: Run Linter
+        run: npm run lint
+
+      - name: Run Tests
+        run: npm test
+
+      - name: Build Application
+        run: npm run build
diff --git a/README.md b/README.md
index 2366916..1a9ab28 100644
--- a/README.md
+++ b/README.md
@@ -1,2 +1,2 @@
-# ChrisDevCode - Web
+# NextJs + Tailwind(Preline) Starter Template
 
diff --git a/app/components/landing_page/FAQs.tsx b/app/components/landing_page/FAQs.tsx
deleted file mode 100644
index 1ddd602..0000000
--- a/app/components/landing_page/FAQs.tsx
+++ /dev/null
@@ -1,135 +0,0 @@
-const FAQs = () => {
-  return (
-<>
-  {/* FAQ */}
-  <div className="max-w-[85rem] px-4 py-10 sm:px-6 lg:px-8 lg:py-14 mx-auto">
-    {/* Title */}
-    <div className="max-w-2xl mx-auto mb-10 lg:mb-14">
-      <h2 className="text-2xl font-bold md:text-4xl md:leading-tight dark:text-white">
-        You might be wondering...
-      </h2>
-    </div>
-    {/* End Title */}
-    <div className="max-w-2xl mx-auto divide-y divide-gray-200 dark:divide-neutral-700">
-      <div className="py-8 first:pt-0 last:pb-0">
-        <div className="flex gap-x-5">
-          <svg
-            className="shrink-0 mt-1 size-6 text-gray-500 dark:text-neutral-500"
-            xmlns="http://www.w3.org/2000/svg"
-            width={24}
-            height={24}
-            viewBox="0 0 24 24"
-            fill="none"
-            stroke="currentColor"
-            strokeWidth={2}
-            strokeLinecap="round"
-            strokeLinejoin="round"
-          >
-            <circle cx={12} cy={12} r={10} />
-            <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3" />
-            <path d="M12 17h.01" />
-          </svg>
-          <div className="grow">
-            <h3 className="md:text-lg font-semibold text-gray-800 dark:text-neutral-200">
-              Do you make custom software?
-            </h3>
-            <p className="mt-1 text-gray-500 dark:text-neutral-500">
-              At the moment, No. We are afraid to make deals with funny deadlines and requests.
-            </p>
-          </div>
-        </div>
-      </div>
-      <div className="py-8 first:pt-0 last:pb-0">
-        <div className="flex gap-x-5">
-          <svg
-            className="shrink-0 mt-1 size-6 text-gray-500 dark:text-neutral-500"
-            xmlns="http://www.w3.org/2000/svg"
-            width={24}
-            height={24}
-            viewBox="0 0 24 24"
-            fill="none"
-            stroke="currentColor"
-            strokeWidth={2}
-            strokeLinecap="round"
-            strokeLinejoin="round"
-          >
-            <circle cx={12} cy={12} r={10} />
-            <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3" />
-            <path d="M12 17h.01" />
-          </svg>
-          <div className="grow">
-            <h3 className="md:text-lg font-semibold text-gray-800 dark:text-neutral-200">
-              What about updating existing websites for businesses?
-            </h3>
-            <p className="mt-1 text-gray-500 dark:text-neutral-500">
-              Still No, but if you make sense, we will make some good recommendations from our pool of developers
-            </p>
-          </div>
-        </div>
-      </div>
-      <div className="py-8 first:pt-0 last:pb-0">
-        <div className="flex gap-x-5">
-          <svg
-            className="shrink-0 mt-1 size-6 text-gray-500 dark:text-neutral-500"
-            xmlns="http://www.w3.org/2000/svg"
-            width={24}
-            height={24}
-            viewBox="0 0 24 24"
-            fill="none"
-            stroke="currentColor"
-            strokeWidth={2}
-            strokeLinecap="round"
-            strokeLinejoin="round"
-          >
-            <circle cx={12} cy={12} r={10} />
-            <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3" />
-            <path d="M12 17h.01" />
-          </svg>
-          <div className="grow">
-            <h3 className="md:text-lg font-semibold text-gray-800 dark:text-neutral-200">
-              If you were to make custom website/software, how much would you charge?
-            </h3>
-            <p className="mt-1 text-gray-500 dark:text-neutral-500">
-              For websites, our charges would start from 1000USD and for mobile apps, 5000USD. We give free consultations for upto 10minutes, you can let us hear you out
-            </p>
-          </div>
-        </div>
-      </div>
-      <div className="py-8 first:pt-0 last:pb-0">
-        <div className="flex gap-x-5">
-          <svg
-            className="shrink-0 mt-1 size-6 text-gray-500 dark:text-neutral-500"
-            xmlns="http://www.w3.org/2000/svg"
-            width={24}
-            height={24}
-            viewBox="0 0 24 24"
-            fill="none"
-            stroke="currentColor"
-            strokeWidth={2}
-            strokeLinecap="round"
-            strokeLinejoin="round"
-          >
-            <circle cx={12} cy={12} r={10} />
-            <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3" />
-            <path d="M12 17h.01" />
-          </svg>
-          <div className="grow">
-            <h3 className="md:text-lg font-semibold text-gray-800 dark:text-neutral-200">
-              So what TF do you do?
-            </h3>
-            <p className="mt-1 text-gray-500 dark:text-neutral-500">
-              For now, we are building our ideas, testing them out. If they work out we are happy, if they don&apos;t we may need to start building custom websites and softwares for businesses and people out here.
-            </p>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-  {/* End FAQ */}
-</>
-
-
-  )
-}
-
-export default FAQs
\ No newline at end of file
diff --git a/app/components/landing_page/Features.tsx b/app/components/landing_page/Features.tsx
deleted file mode 100644
index 6fe3f2c..0000000
--- a/app/components/landing_page/Features.tsx
+++ /dev/null
@@ -1,148 +0,0 @@
-import Image from 'next/image'
-
-const Features = () => {
-  return (
-    <>
-  {/* Features */}
-  <div className="max-w-[85rem] px-4 py-10 sm:px-6 lg:px-8 lg:py-14 mx-auto">
-    {/* Title */}
-    <div className="mx-auto max-w-2xl mb-8 lg:mb-14 text-center">
-      <h2 className="text-3xl lg:text-4xl text-gray-800 font-bold dark:text-neutral-200">
-        Explore tools
-      </h2>
-      <p className="mt-3 text-gray-800 dark:text-neutral-200">
-        We currently don&apos;t make customizable Software
-      </p>
-    </div>
-    {/* End Title */}
-    {/* Grid */}
-    <div className="mx-auto max-w-3xl grid grid-cols-12 gap-6 lg:gap-8">
-      {/* Icon Block */}
-      <div className="col-span-6 sm:col-span-4 text-center">
-        <svg
-          className="mx-auto h-auto w-7 md:w-9 text-gray-800 dark:text-neutral-200"
-          xmlns="http://www.w3.org/2000/svg"
-          width={24}
-          height={24}
-          viewBox="0 0 24 24"
-          fill="none"
-          stroke="currentColor"
-          strokeWidth={2}
-          strokeLinecap="round"
-          strokeLinejoin="round"
-        >
-          <rect width={10} height={14} x={3} y={8} rx={2} />
-          <path d="M5 4a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v16a2 2 0 0 1-2 2h-2.4" />
-          <path d="M8 18h.01" />
-        </svg>
-        <div className="mt-2 sm:mt-6">
-          <h3 className="text-lg font-semibold text-gray-800 dark:text-neutral-200">
-            SGR Transit
-          </h3>
-        </div>
-      </div>
-      {/* End Icon Block */}
-      {/* Icon Block */}
-      <div className="col-span-6 sm:col-span-4 text-center">
-        <svg
-          className="mx-auto h-auto w-7 md:w-9 text-gray-800 dark:text-neutral-200"
-          xmlns="http://www.w3.org/2000/svg"
-          width={24}
-          height={24}
-          viewBox="0 0 24 24"
-          fill="none"
-          stroke="currentColor"
-          strokeWidth={2}
-          strokeLinecap="round"
-          strokeLinejoin="round"
-        >
-          <path d="M20 7h-9" />
-          <path d="M14 17H5" />
-          <circle cx={17} cy={17} r={3} />
-          <circle cx={7} cy={7} r={3} />
-        </svg>
-        <div className="mt-2 sm:mt-6">
-          <h3 className="text-lg font-semibold text-gray-800 dark:text-neutral-200">
-            Events and Conferences
-          </h3>
-        </div>
-      </div>
-      {/* End Icon Block */}
-      {/* Icon Block */}
-      <div className="col-span-6 col-start-4 sm:col-span-4 text-center">
-        <svg
-          className="mx-auto h-auto w-7 md:w-9 text-gray-800 dark:text-neutral-200"
-          xmlns="http://www.w3.org/2000/svg"
-          width={24}
-          height={24}
-          viewBox="0 0 24 24"
-          fill="none"
-          stroke="currentColor"
-          strokeWidth={2}
-          strokeLinecap="round"
-          strokeLinejoin="round"
-        >
-          <path d="M14 9a2 2 0 0 1-2 2H6l-4 4V4c0-1.1.9-2 2-2h8a2 2 0 0 1 2 2v5Z" />
-          <path d="M18 9h2a2 2 0 0 1 2 2v11l-4-4h-6a2 2 0 0 1-2-2v-1" />
-        </svg>
-        <div className="mt-2 sm:mt-6">
-          <h3 className="text-lg font-semibold text-gray-800 dark:text-neutral-200">
-            Messaging Tools
-          </h3>
-        </div>
-      </div>
-      {/* End Icon Block */}
-    </div>
-    {/* End Grid */}
-    {/* Grid */}
-    <div className="mt-20 grid grid-cols-12 items-center gap-x-2 sm:gap-x-6 lg:gap-x-8">
-      <div className="hidden md:block col-span-4 md:col-span-3">
-        <Image
-          className="rounded-xl"
-          src="https://images.unsplash.com/photo-1606868306217-dbf5046868d2?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=920&q=80"
-              alt="Features Image"
-              width={920}
-              height={612}
-        />
-      </div>
-      {/* End Col */}
-      <div className="col-span-4 md:col-span-3">
-        <Image
-          className="rounded-xl"
-          src="https://images.unsplash.com/photo-1587613991119-fbbe8e90531d?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=920&q=80"
-              alt="Features Image"
-              width={920}
-              height={612}
-        />
-      </div>
-      {/* End Col */}
-      <div className="col-span-4 md:col-span-3">
-        <Image
-          className="rounded-xl"
-          src="https://images.unsplash.com/photo-1554295405-abb8fd54f153?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=920&q=80"
-              alt="Features Image"
-              width={920}
-              height={612}
-        />
-      </div>
-      {/* End Col */}
-      <div className="col-span-4 md:col-span-3">
-        <Image
-          className="rounded-xl"
-          src="https://images.unsplash.com/photo-1640622300473-977435c38c04?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=920&q=80"
-              alt="Features Image"
-              width={920}
-              height={612}
-        />
-      </div>
-      {/* End Col */}
-    </div>
-    {/* End Grid */}
-  </div>
-  {/* End Features */}
-</>
-
-  )
-}
-
-export default Features
\ No newline at end of file
diff --git a/app/components/landing_page/Hero.tsx b/app/components/landing_page/Hero.tsx
index 43400f8..8e03a1c 100644
--- a/app/components/landing_page/Hero.tsx
+++ b/app/components/landing_page/Hero.tsx
@@ -51,7 +51,8 @@ const Hero = () => {
       <div className="mt-8 gap-3 flex justify-center">
         <a
           className="inline-flex justify-center items-center gap-x-3 text-center bg-gradient-to-tl from-blue-600 to-violet-600 hover:from-violet-600 hover:to-blue-600 focus:outline-none focus:from-violet-600 focus:to-blue-600 border border-transparent text-white text-sm font-medium rounded-full py-3 px-4"
-          href="#"
+              href="https://github.com/achingachris/nextjs-tailwind-starter"
+              target='_blank'
         >
           <svg
             className="shrink-0 size-4"
@@ -63,7 +64,7 @@ const Hero = () => {
           >
             <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8z" />
           </svg>
-          What We Are Buidling
+          Clone Me To Start
         </a>
       </div>
       {/* End Buttons */}
diff --git a/app/components/landing_page/Services.tsx b/app/components/landing_page/Services.tsx
deleted file mode 100644
index c74dfb1..0000000
--- a/app/components/landing_page/Services.tsx
+++ /dev/null
@@ -1,136 +0,0 @@
-import React from 'react'
-
-const Services = () => {
-  return (
-    <>
-  {/* Icon Blocks */}
-  <div className="max-w-[85rem] px-4 py-10 sm:px-6 lg:px-8 lg:py-14 mx-auto">
-    <div className="grid sm:grid-cols-2 lg:grid-cols-4 items-center gap-12">
-      {/* Icon Block */}
-      <div>
-        <div className="relative flex justify-center items-center size-12 bg-white rounded-xl before:absolute before:-inset-px before:-z-[1] before:bg-gradient-to-br before:from-blue-600 before:via-transparent before:to-violet-600 before:rounded-xl dark:bg-neutral-900">
-          <svg
-            className="shrink-0 size-6 text-blue-600 dark:text-blue-500"
-            xmlns="http://www.w3.org/2000/svg"
-            width={24}
-            height={24}
-            viewBox="0 0 24 24"
-            fill="none"
-            stroke="currentColor"
-            strokeWidth={2}
-            strokeLinecap="round"
-            strokeLinejoin="round"
-          >
-            <rect width={10} height={14} x={3} y={8} rx={2} />
-            <path d="M5 4a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v16a2 2 0 0 1-2 2h-2.4" />
-            <path d="M8 18h.01" />
-          </svg>
-        </div>
-        <div className="mt-5">
-          <h3 className="text-lg font-semibold text-gray-800 dark:text-white">
-            Responsive
-          </h3>
-          <p className="mt-1 text-gray-600 dark:text-neutral-400">
-            Responsive, and mobile-first project on the web
-          </p>
-        </div>
-      </div>
-      {/* End Icon Block */}
-      {/* Icon Block */}
-      <div>
-        <div className="relative flex justify-center items-center size-12 bg-white rounded-xl before:absolute before:-inset-px before:-z-[1] before:bg-gradient-to-br before:from-blue-600 before:via-transparent before:to-violet-600 before:rounded-xl dark:bg-neutral-900">
-          <svg
-            className="shrink-0 size-6 text-blue-600 dark:text-blue-500"
-            xmlns="http://www.w3.org/2000/svg"
-            width={24}
-            height={24}
-            viewBox="0 0 24 24"
-            fill="none"
-            stroke="currentColor"
-            strokeWidth={2}
-            strokeLinecap="round"
-            strokeLinejoin="round"
-          >
-            <path d="M20 7h-9" />
-            <path d="M14 17H5" />
-            <circle cx={17} cy={17} r={3} />
-            <circle cx={7} cy={7} r={3} />
-          </svg>
-        </div>
-        <div className="mt-5">
-          <h3 className="text-lg font-semibold text-gray-800 dark:text-white">
-            Customizable
-          </h3>
-          <p className="mt-1 text-gray-600 dark:text-neutral-400">
-            Components are easily customized and extendable
-          </p>
-        </div>
-      </div>
-      {/* End Icon Block */}
-      {/* Icon Block */}
-      <div>
-        <div className="relative flex justify-center items-center size-12 bg-white rounded-xl before:absolute before:-inset-px before:-z-[1] before:bg-gradient-to-br before:from-blue-600 before:via-transparent before:to-violet-600 before:rounded-xl dark:bg-neutral-900">
-          <svg
-            className="shrink-0 size-6 text-blue-600 dark:text-blue-500"
-            xmlns="http://www.w3.org/2000/svg"
-            width={24}
-            height={24}
-            viewBox="0 0 24 24"
-            fill="none"
-            stroke="currentColor"
-            strokeWidth={2}
-            strokeLinecap="round"
-            strokeLinejoin="round"
-          >
-            <path d="M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z" />
-            <path d="M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z" />
-          </svg>
-        </div>
-        <div className="mt-5">
-          <h3 className="text-lg font-semibold text-gray-800 dark:text-white">
-            Documentation
-          </h3>
-          <p className="mt-1 text-gray-600 dark:text-neutral-400">
-            Every component and plugin is well documented
-          </p>
-        </div>
-      </div>
-      {/* End Icon Block */}
-      {/* Icon Block */}
-      <div>
-        <div className="relative flex justify-center items-center size-12 bg-white rounded-xl before:absolute before:-inset-px before:-z-[1] before:bg-gradient-to-br before:from-blue-600 before:via-transparent before:to-violet-600 before:rounded-xl dark:bg-neutral-900">
-          <svg
-            className="shrink-0 size-6 text-blue-600 dark:text-blue-500"
-            xmlns="http://www.w3.org/2000/svg"
-            width={24}
-            height={24}
-            viewBox="0 0 24 24"
-            fill="none"
-            stroke="currentColor"
-            strokeWidth={2}
-            strokeLinecap="round"
-            strokeLinejoin="round"
-          >
-            <path d="M14 9a2 2 0 0 1-2 2H6l-4 4V4c0-1.1.9-2 2-2h8a2 2 0 0 1 2 2v5Z" />
-            <path d="M18 9h2a2 2 0 0 1 2 2v11l-4-4h-6a2 2 0 0 1-2-2v-1" />
-          </svg>
-        </div>
-        <div className="mt-5">
-          <h3 className="text-lg font-semibold text-gray-800 dark:text-white">
-            24/7 Support
-          </h3>
-          <p className="mt-1 text-gray-600 dark:text-neutral-400">
-            Contact us 24 hours a day, 7 days a week
-          </p>
-        </div>
-      </div>
-      {/* End Icon Block */}
-    </div>
-  </div>
-  {/* End Icon Blocks */}
-</>
-
-  )
-}
-
-export default Services
\ No newline at end of file
diff --git a/ui/Header.tsx b/ui/Header.tsx
index ae73465..75d7e0a 100644
--- a/ui/Header.tsx
+++ b/ui/Header.tsx
@@ -84,10 +84,10 @@ const Header = () => {
           </Link> */}
           <a
             className="py-0.5 md:py-3 px-4 md:px-1 border-s-2 md:border-s-0 md:border-b-2 border-transparent text-gray-500 hover:text-gray-800 focus:outline-none dark:text-neutral-400 dark:hover:text-neutral-200"
-            href="https://medium.com/@chrisdevcode"
+            href="https://github.com/achingachris/nextjs-tailwind-starter"
             target='_blank'
           >
-            Articles
+            Repo
           </a>
         </div>
       </div>