From 9ae84e800ebbdb074fccce6dab4d012f27a51612 Mon Sep 17 00:00:00 2001
From: James Wyndham <samwyn@xam.com.au>
Date: Fri, 1 Mar 2024 12:18:56 +0800
Subject: [PATCH] feature - added homepage with more components

---
 Frontend/app/(public)/pricing/page.tsx        |   3 +-
 Frontend/app/(public)/whatsnew/page.tsx       |   8 +-
 Frontend/app/page.tsx                         |  18 ++
 Frontend/components/Footer.tsx                |   2 +-
 Frontend/components/Utilities/Background.tsx  |   2 +-
 Frontend/public/images/daisyui-icon.png       | Bin 0 -> 3387 bytes
 Frontend/public/images/nextjs-icon.png        | Bin 0 -> 2405 bytes
 Frontend/public/images/pocketbase-icon.png    | Bin 0 -> 2485 bytes
 Frontend/public/images/stripe-icon.png        | Bin 0 -> 3414 bytes
 Frontend/public/images/tailwind-icon.png      | Bin 0 -> 4836 bytes
 ...om.tsx => RightAlignedBorderBottomFAQ.tsx} |   0
 .../Feature/SolidBackgrondIconFeature.tsx     | 155 ++++++++++++++++++
 ...lTabsWithOverlappingBackgroundFeature.tsx} |   0
 .../Hero/WaitingListWithImageHero.tsx         |   3 +-
 .../IconsSections/SolidBackgrondIcon.tsx      | 116 -------------
 Frontend/tailwind.config.ts                   |  10 +-
 16 files changed, 187 insertions(+), 130 deletions(-)
 create mode 100644 Frontend/public/images/daisyui-icon.png
 create mode 100644 Frontend/public/images/nextjs-icon.png
 create mode 100644 Frontend/public/images/pocketbase-icon.png
 create mode 100644 Frontend/public/images/stripe-icon.png
 create mode 100644 Frontend/public/images/tailwind-icon.png
 rename Frontend/sections/FAQ/{RightAlignedBorderBottom.tsx => RightAlignedBorderBottomFAQ.tsx} (100%)
 create mode 100644 Frontend/sections/Feature/SolidBackgrondIconFeature.tsx
 rename Frontend/sections/{Features/VerticalTabsWithOverlappingBackground.tsx => Feature/VerticalTabsWithOverlappingBackgroundFeature.tsx} (100%)
 delete mode 100644 Frontend/sections/IconsSections/SolidBackgrondIcon.tsx

diff --git a/Frontend/app/(public)/pricing/page.tsx b/Frontend/app/(public)/pricing/page.tsx
index fe89671..fa3d4e0 100644
--- a/Frontend/app/(public)/pricing/page.tsx
+++ b/Frontend/app/(public)/pricing/page.tsx
@@ -22,7 +22,8 @@ export default function PricingPage() {
             <>
               {" "}
               <h2 className="text-base-content text-2xl font-medium content text-center max-w-6xl mx-auto px-6">
-                Are you ready to save 20 hours?
+                Are you ready to save 20 hours of coding? Start your Micro-SaaS
+                today
               </h2>
             </>
           }
diff --git a/Frontend/app/(public)/whatsnew/page.tsx b/Frontend/app/(public)/whatsnew/page.tsx
index bcd3060..f4a4a4d 100644
--- a/Frontend/app/(public)/whatsnew/page.tsx
+++ b/Frontend/app/(public)/whatsnew/page.tsx
@@ -1,8 +1,7 @@
 import Footer from "@/components/Footer";
 import Background from "@/components/Utilities/Background";
 import Spacer from "@/components/Utilities/Spacer";
-import FormLeftDescriptionRightContactUs from "@/sections/ContactUs/FormLeftDescriptionRightContactUs";
-import SolidBackgrondIcon from "@/sections/IconsSections/SolidBackgrondIcon";
+import SolidBackgrondIconFeature from "@/sections/Feature/SolidBackgrondIconFeature";
 import PageHeader from "@/sections/PageHeader";
 import React from "react";
 
@@ -16,12 +15,13 @@ const page = () => {
             <>
               {" "}
               <h2 className="text-base-content text-2xl font-medium content text-center max-w-6xl mx-auto px-6">
-                Take a look at all the cool features we&apos;ve built.
+                Fastpocket gives you boilerplate to help you build.
               </h2>
             </>
           }
         />
-        <SolidBackgrondIcon />
+
+        <SolidBackgrondIconFeature />
         <Spacer className="mt-auto" />
         <Footer />
       </Background>
diff --git a/Frontend/app/page.tsx b/Frontend/app/page.tsx
index 16465b3..f993f62 100644
--- a/Frontend/app/page.tsx
+++ b/Frontend/app/page.tsx
@@ -5,6 +5,9 @@ import { useEffect } from "react";
 import React from "react";
 import { WaitingListWithImageHero } from "@/sections/Hero";
 import PageWrapper from "@/components/Utilities/PageWrapper";
+import Footer from "@/components/Footer";
+import SolidBackgrondIconFeature from "@/sections/Feature/SolidBackgrondIconFeature";
+import PageHeader from "@/sections/PageHeader";
 
 export default function Home() {
   useEffect(() => {
@@ -20,6 +23,21 @@ export default function Home() {
     <>
       <PageWrapper>
         <WaitingListWithImageHero />
+        <div className="bg-primary/2">
+          <PageHeader
+            title="What You Get"
+            subtitle={
+              <>
+                {" "}
+                <h2 className="text-base-content text-2xl font-medium content text-center max-w-6xl mx-auto px-6">
+                  Fastpocket gives you boilerplate to help you build.
+                </h2>
+              </>
+            }
+          />
+          <SolidBackgrondIconFeature />
+        </div>
+        <Footer />
       </PageWrapper>
     </>
   );
diff --git a/Frontend/components/Footer.tsx b/Frontend/components/Footer.tsx
index ec1f704..08d3213 100644
--- a/Frontend/components/Footer.tsx
+++ b/Frontend/components/Footer.tsx
@@ -6,7 +6,7 @@ import Link from "next/link";
 
 function Footer() {
   return (
-    <footer className="w-full  py-10 px-4 sm:px-6 lg:px-8 mx-auto bg-base-100">
+    <footer className="w-full  pb-10 pt-14 px-4 sm:px-6 lg:px-8 mx-auto bg-base-200">
       {/* Grid */}
       <div className="grid grid-cols-2 md:grid-cols-4 lg:grid-cols-5 gap-6 mb-10">
         <div className="col-span-full hidden lg:col-span-1 lg:flex lg:flex-col lg:items-center">
diff --git a/Frontend/components/Utilities/Background.tsx b/Frontend/components/Utilities/Background.tsx
index 180251a..95f5035 100644
--- a/Frontend/components/Utilities/Background.tsx
+++ b/Frontend/components/Utilities/Background.tsx
@@ -26,7 +26,7 @@ const Background = ({ children }: { children: ReactNode }) => {
     <div
       className="h-full relative w-full bg-center bg-no-repeat bg-cover bg-fixed min-h-screen flex flex-col"
       style={{
-        backgroundImage: `linear-gradient(rgba(${backgroundColor?.r}, ${backgroundColor?.g}, ${backgroundColor?.b}, 0.8), rgba(135, 80, 156, 0.05)), url(/images/circuit.svg)`,
+        backgroundImage: `linear-gradient(rgba(${backgroundColor?.r}, ${backgroundColor?.g}, ${backgroundColor?.b}, 0.7), rgba(135, 80, 156, 0.05)), url(/images/circuit.svg)`,
       }}
     >
       {children}
diff --git a/Frontend/public/images/daisyui-icon.png b/Frontend/public/images/daisyui-icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..f2d8f006430c4b5da24dbfb5540a526158d755da
GIT binary patch
literal 3387
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
RRZIW?002ovPDHLkV1jNUa}xjn

literal 0
HcmV?d00001

diff --git a/Frontend/public/images/nextjs-icon.png b/Frontend/public/images/nextjs-icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..3c46c6cb343db0b445d43d1c4fc6943e6f8afc61
GIT binary patch
literal 2405
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
Xt8}~E=eH$+00000NkvXXu0mjf_sDJI

literal 0
HcmV?d00001

diff --git a/Frontend/public/images/pocketbase-icon.png b/Frontend/public/images/pocketbase-icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..724d76095ebe5c20eb31a8ab3e3875376d1586e0
GIT binary patch
literal 2485
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

literal 0
HcmV?d00001

diff --git a/Frontend/public/images/stripe-icon.png b/Frontend/public/images/stripe-icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..408bafe85d9f71e28aa6606392b597c03362e33a
GIT binary patch
literal 3414
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

literal 0
HcmV?d00001

diff --git a/Frontend/public/images/tailwind-icon.png b/Frontend/public/images/tailwind-icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..d0e148c12c2e6e80e769221f9526fb8cae9c4506
GIT binary patch
literal 4836
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

literal 0
HcmV?d00001

diff --git a/Frontend/sections/FAQ/RightAlignedBorderBottom.tsx b/Frontend/sections/FAQ/RightAlignedBorderBottomFAQ.tsx
similarity index 100%
rename from Frontend/sections/FAQ/RightAlignedBorderBottom.tsx
rename to Frontend/sections/FAQ/RightAlignedBorderBottomFAQ.tsx
diff --git a/Frontend/sections/Feature/SolidBackgrondIconFeature.tsx b/Frontend/sections/Feature/SolidBackgrondIconFeature.tsx
new file mode 100644
index 0000000..9d2666b
--- /dev/null
+++ b/Frontend/sections/Feature/SolidBackgrondIconFeature.tsx
@@ -0,0 +1,155 @@
+import React from "react";
+import Image from "next/image";
+import Icon from "@/components/Icons/Icon";
+
+function SolidBackgrondIconFeature() {
+  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-2">
+          {/* Icon Block */}
+          <a
+            className="group flex flex-col justify-center bg-base-200 shadow-lg rounded-xl p-4 md:p-7 "
+            href="#"
+          >
+            <div className="flex justify-center items-center size-12 bg-primary/20 rounded-xl py-2">
+              <Image
+                src={"/images/stripe-icon.png"}
+                alt={""}
+                width={32}
+                height={32}
+              />
+            </div>
+            <div className="mt-5">
+              <h3 className="group-hover:text-base-content text-lg font-semibold text-base-content  ">
+                Stripe Payments
+              </h3>
+              <p className="mt-1 text-base-content ">
+                We have built stripe payments for 1 off and reoccuring payments
+              </p>
+            </div>
+          </a>
+          {/* End Icon Block */}
+          {/* Icon Block */}
+          <a
+            className="group flex flex-col justify-center bg-base-200 shadow-lg rounded-xl p-4 md:p-7 "
+            href="#"
+          >
+            <div className="flex justify-center items-center size-12 bg-primary/20 rounded-xl py-2">
+              <Image
+                src={"/images/daisyui-icon.png"}
+                alt={""}
+                width={32}
+                height={32}
+              />
+            </div>
+            <div className="mt-5">
+              <h3 className="group-hover:text-base-content text-lg font-semibold text-base-content  ">
+                Theming
+              </h3>
+              <p className="mt-1 text-base-content ">
+                All our components include intuative theming with a js utility
+                class that uses your themes colors programmatically
+              </p>
+            </div>
+          </a>
+          {/* End Icon Block */}
+          {/* Icon Block */}
+          <a
+            className="group flex flex-col justify-center bg-base-200 shadow-lg rounded-xl p-4 md:p-7 "
+            href="#"
+          >
+            <div className="flex justify-center items-center size-12 bg-primary/20 rounded-xl py-2">
+              <Icon name="Library32Filled" style={{ height: 32, width: 32 }} />
+            </div>
+            <div className="mt-5">
+              <h3 className="group-hover:text-base-content text-lg font-semibold text-base-content  ">
+                Documentation
+              </h3>
+              <p className="mt-1 text-base-content ">
+                Every component and plugin is well documented
+              </p>
+            </div>
+          </a>
+          {/* End Icon Block */}
+          {/* Icon Block */}
+          <a
+            className="group flex flex-col justify-center bg-base-200 shadow-lg rounded-xl p-4 md:p-7 "
+            href="#"
+          >
+            <div className="flex justify-center items-center size-12 bg-primary/20 rounded-xl py-2">
+              <Image
+                src={"/images/pocketbase-icon.png"}
+                alt={""}
+                width={32}
+                height={32}
+              />
+            </div>
+            <div className="mt-5">
+              <h3 className="group-hover:text-base-content text-lg font-semibold text-base-content  ">
+                Deployment Templates
+              </h3>
+              <p className="mt-1 text-base-content ">
+                For fly.io, raleway, and more so you can get running with
+                PocketBase as quickly as possible
+              </p>
+            </div>
+          </a>
+          {/* End Icon Block */}
+          {/* Icon Block */}
+          <a
+            className="group flex flex-col justify-center bg-base-200 shadow-lg rounded-xl p-4 md:p-7 "
+            href="#"
+          >
+            <div className="flex justify-center items-center size-12 bg-primary/20 rounded-xl py-2">
+              <Image
+                src={"/images/daisyui-icon.png"}
+                alt={""}
+                width={32}
+                height={32}
+              />
+            </div>
+            <div className="mt-5">
+              <h3 className="group-hover:text-base-content text-lg font-semibold text-base-content  ">
+                Component Library
+              </h3>
+              <p className="mt-1 text-base-content ">
+                We provide fully customisable sections and components that you
+                can drop in
+              </p>
+            </div>
+          </a>
+          {/* End Icon Block */}
+          {/* Icon Block */}
+          <a
+            className="group flex flex-col justify-center bg-base-200 shadow-lg rounded-xl p-4 md:p-7 "
+            href="#"
+          >
+            <div className="flex justify-center items-center size-12 bg-primary/20 rounded-xl py-2">
+              <Image
+                src={"/images/nextjs-icon.png"}
+                alt={""}
+                width={32}
+                height={32}
+              />
+            </div>
+            <div className="mt-5">
+              <h3 className="group-hover:text-base-content text-lg font-semibold text-base-content  ">
+                Resources
+              </h3>
+              <p className="mt-1 text-base-content ">
+                A growing list of resources to help you build your products
+                faster
+              </p>
+            </div>
+          </a>
+          {/* End Icon Block */}
+        </div>
+      </div>
+      {/* End Icon Blocks */}
+    </>
+  );
+}
+
+export default SolidBackgrondIconFeature;
diff --git a/Frontend/sections/Features/VerticalTabsWithOverlappingBackground.tsx b/Frontend/sections/Feature/VerticalTabsWithOverlappingBackgroundFeature.tsx
similarity index 100%
rename from Frontend/sections/Features/VerticalTabsWithOverlappingBackground.tsx
rename to Frontend/sections/Feature/VerticalTabsWithOverlappingBackgroundFeature.tsx
diff --git a/Frontend/sections/Hero/WaitingListWithImageHero.tsx b/Frontend/sections/Hero/WaitingListWithImageHero.tsx
index fdc4323..11495e3 100644
--- a/Frontend/sections/Hero/WaitingListWithImageHero.tsx
+++ b/Frontend/sections/Hero/WaitingListWithImageHero.tsx
@@ -45,7 +45,7 @@ const WaitingListWithImageHero = () => {
   return (
     <Background>
       <div className="h-screen  w-full bg-clip flex items-center justify-center">
-        <div className="text-center py-8 px-4 sm:px-6 lg:px-8 bg-base-100 rounded-xl shadow-lg">
+        <div className="text-center py-8 px-4 sm:px-6 lg:px-8 bg-base-200 rounded-xl shadow-lg">
           <h1 className=" text-3xl sm:text-6xl text-base-content font-heading whitespace-nowrap flex flex-row justify-center pb-6 gap-x-3">
             <Logo href="/" />
             {title}
@@ -203,7 +203,6 @@ const WaitingListWithImageHero = () => {
           )}
         </div>
       </div>
-      <Footer />
     </Background>
   );
 };
diff --git a/Frontend/sections/IconsSections/SolidBackgrondIcon.tsx b/Frontend/sections/IconsSections/SolidBackgrondIcon.tsx
deleted file mode 100644
index 9093bdf..0000000
--- a/Frontend/sections/IconsSections/SolidBackgrondIcon.tsx
+++ /dev/null
@@ -1,116 +0,0 @@
-import React from "react";
-
-function SolidBackgrondIcon() {
-  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-2">
-          {/* Icon Block */}
-          <a
-            className="group flex flex-col justify-center bg-base-300 rounded-xl p-4 md:p-7 "
-            href="#"
-          >
-            <div className="flex justify-center items-center size-12 bg-primary rounded-xl">
-              <svg
-                className="flex-shrink-0 size-6 text-white"
-                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="group-hover:text-base-content text-lg font-semibold text-base-content  ">
-                Stripe Payments
-              </h3>
-              <p className="mt-1 text-base-content ">
-                We have built stripe payments for 1 off and reoccuring payments
-              </p>
-            </div>
-          </a>
-          {/* End Icon Block */}
-          {/* Icon Block */}
-          <a
-            className="group flex flex-col justify-center bg-base-300 rounded-xl p-4 md:p-7 "
-            href="#"
-          >
-            <div className="flex justify-center items-center size-12 bg-primary rounded-xl">
-              <svg
-                className="flex-shrink-0 size-6 text-white"
-                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="group-hover:text-base-content text-lg font-semibold text-base-content  ">
-                Theming
-              </h3>
-              <p className="mt-1 text-base-content ">
-                All our components include intuative theming with a js utility
-                class that uses your themes colors programmatically
-              </p>
-            </div>
-          </a>
-          {/* End Icon Block */}
-          {/* Icon Block */}
-          <a
-            className="group flex flex-col justify-center bg-base-300 rounded-xl p-4 md:p-7 "
-            href="#"
-          >
-            <div className="flex justify-center items-center size-12 bg-primary rounded-xl">
-              <svg
-                className="flex-shrink-0 size-6 text-white"
-                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="group-hover:text-base-content text-lg font-semibold text-base-content  ">
-                Documentation
-              </h3>
-              <p className="mt-1 text-base-content ">
-                Every component and plugin is well documented
-              </p>
-            </div>
-          </a>
-          {/* End Icon Block */}
-        </div>
-      </div>
-      {/* End Icon Blocks */}
-    </>
-  );
-}
-
-export default SolidBackgrondIcon;
diff --git a/Frontend/tailwind.config.ts b/Frontend/tailwind.config.ts
index 4e3e8dc..62af2ad 100644
--- a/Frontend/tailwind.config.ts
+++ b/Frontend/tailwind.config.ts
@@ -71,13 +71,13 @@ const config: Config = {
         light: {
           primary: "#FD5469",
           "primary-content": "#fff",
-          secondary: "#ff7400",
+          secondary: "#7082FF",
           "secondary-content": "#000",
           accent: "#fd0000",
           neutral: "#28282e",
-          "base-100": "#fefffd",
-          "base-200": "#fcfeff",
-          "base-300": "#fefaff",
+          "base-100": "#FBFAFA",
+          "base-200": "#F9F8F8",
+          "base-300": "#F4F3F4",
           "base-content": "#000",
           info: "#00f5ff",
           success: "#00ff8b",
@@ -87,7 +87,7 @@ const config: Config = {
         dark: {
           primary: "#FD5469",
           "primary-content": "#fff",
-          secondary: "#FD40FF",
+          secondary: "#7082FF",
           "secondary-content": "#fff",
           accent: "#006cff",
           neutral: "#060206",