mrwyndham/fastpocket
1
2
Fork 3
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

added stylings

Browse Source
This commit is contained in:
James Wyndham 2024-02-16 16:33:55 +08:00
parent 8143fe009f
commit 15eaf62995
18 changed files with 153 additions and 77 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
Backend/README.md
View File

@ -1,4 +1,4 @@
# Fast Pocket - React + PocketBase Boiler Plate # FastPocket - React + PocketBase Boiler Plate
The all-in-one starter kit for high-performance SaaS applications. That don't want a vendor buy in when it comes to backend and frontend. This is a front end agnostic template that you can use 100% with any SaaS application. If there are any issues please feel free to reach out to me on X - [@meinbiz](https://twitter.com/meinbiz) The all-in-one starter kit for high-performance SaaS applications. That don't want a vendor buy in when it comes to backend and frontend. This is a front end agnostic template that you can use 100% with any SaaS application. If there are any issues please feel free to reach out to me on X - [@meinbiz](https://twitter.com/meinbiz)

37
Frontend/app/(admin)/blogs/page.tsx
View File

@ -2,6 +2,7 @@ import PageHeader from "@/sections/PageHeader";
import BlogCard from "@/components/BlogCard"; import BlogCard from "@/components/BlogCard";
import getPostMetadata from "@/utils/getPostMetaData"; import getPostMetadata from "@/utils/getPostMetaData";
import React from "react"; import React from "react";
import Background from "@/components/Utilities/Background";
export default function BlogsPage() { export default function BlogsPage() {
const postMetadata = getPostMetadata(); const postMetadata = getPostMetadata();
@ -15,24 +16,26 @@ export default function BlogsPage() {
role="main" role="main"
className="h-full flex-grow flex flex-col bg-white dark:bg-black" className="h-full flex-grow flex flex-col bg-white dark:bg-black"
> >
{/* Page sections */} <Background>
<PageHeader {/* Page sections */}
title="Blogs" <PageHeader
subtitle={ title="Blogs"
<> subtitle={
{" "} <>
<h2 className="text-black dark:text-white font-bold text-2xl lg:text-3xl text-center max-w-5xl mx-auto px-6"> {" "}
Join us for the journey as we make great food. Learn and grow <h2 className="text-black dark:text-white font-bold text-2xl lg:text-3xl text-center max-w-5xl mx-auto px-6">
together Join us for the journey as we make great food. Learn and grow
</h2> together
</> </h2>
} </>
/> }
<div className="max-w-6xl mx-auto mb-24 h-full w-full py-12 px-8"> />
<div className="w-full flex items-start justify-center flex-row flex-wrap gap-x-8 gap-y-8 md:gap-12 text-black dark:text-white"> <div className="max-w-6xl mx-auto mb-24 h-full w-full py-12 px-8">
{postPreviews} <div className="w-full flex items-start justify-center flex-row flex-wrap gap-x-8 gap-y-8 md:gap-12 text-black dark:text-white">
{postPreviews}
</div>
</div> </div>
</div> </Background>
</main> </main>
); );
} }

11
Frontend/app/(admin)/contact/page.tsx
View File

@ -1,4 +1,5 @@
import Footer from "@/components/Footer"; import Footer from "@/components/Footer";
import Background from "@/components/Utilities/Background";
import Spacer from "@/components/Utilities/Spacer"; import Spacer from "@/components/Utilities/Spacer";
import FormLeftDescriptionRightContactUs from "@/sections/ContactUs/FormLeftDescriptionRightContactUs"; import FormLeftDescriptionRightContactUs from "@/sections/ContactUs/FormLeftDescriptionRightContactUs";
import React from "react"; import React from "react";
@ -6,10 +7,12 @@ import React from "react";
const page = () => { const page = () => {
return ( return (
<div className="flex flex-col h-full w-full bg-white dark:bg-black"> <div className="flex flex-col h-full w-full bg-white dark:bg-black">
<Spacer className="pt-28" /> <Background>
<FormLeftDescriptionRightContactUs /> <Spacer className="pt-28" />
<Footer /> <FormLeftDescriptionRightContactUs />
<Spacer className="pt-16" /> <Footer />
<Spacer className="pt-16" />
</Background>
</div> </div>
); );
}; };

51
Frontend/app/(admin)/pricing/page.tsx
View File

@ -10,6 +10,7 @@ import Newsletter from "@/sections/Newsletter/Newsletter";
import { createCheckoutSession, isAuthenticated } from "@/app/(auth)/actions"; import { createCheckoutSession, isAuthenticated } from "@/app/(auth)/actions";
import { toast } from "react-toastify"; import { toast } from "react-toastify";
import { useRouter } from "next/navigation"; import { useRouter } from "next/navigation";
import Background from "@/components/Utilities/Background";
export default function PricingPage() { export default function PricingPage() {
const [isAnnual, setIsAnnual] = useState(false); const [isAnnual, setIsAnnual] = useState(false);
@ -31,31 +32,33 @@ export default function PricingPage() {
role="main" role="main"
className="h-full flex flex-col min-h-screen mx-auto w-screen overflow-hidden bg-white dark:bg-black" className="h-full flex flex-col min-h-screen mx-auto w-screen overflow-hidden bg-white dark:bg-black"
> >
<PageHeader <Background>
title="Pricing" <PageHeader
subtitle={ title="Pricing"
<> subtitle={
{" "} <>
<h2 className="h3 text-base-content content text-center max-w-6xl mx-auto px-6"> {" "}
Are you ready for fresh South West produce to be delivered to your <h2 className="h3 text-black dark:text-white content text-center max-w-6xl mx-auto px-6">
door? Are you ready for fresh South West produce to be delivered to
</h2> your door?
</> </h2>
} </>
/> }
<div className="flex items-center justify-center mt-10"> />
<PriceToggle isAnnual={isAnnual} onChange={handleToggle} /> <div className="flex items-center justify-center mt-10">
</div> <PriceToggle isAnnual={isAnnual} onChange={handleToggle} />
<div className="max-w-6xl mx-auto mb-24 h-full">
<div
className={`w-screen lg:w-full flex gap-x-4 lg:justify-center gap-y-8 px-6 pt-12 overflow-x-scroll`}
>
{products.map((x, i) => (
<PriceCard key={i} product={x} isAnnual={isAnnual} />
))}
</div> </div>
</div> <div className="max-w-6xl mx-auto mb-24 h-full">
<Newsletter /> <div
className={`w-screen lg:w-full flex gap-x-4 lg:justify-center gap-y-8 px-6 pt-12 overflow-x-scroll`}
>
{products.map((x, i) => (
<PriceCard key={i} product={x} isAnnual={isAnnual} />
))}
</div>
</div>
<Newsletter />
</Background>
</main> </main>
); );
} }

5
Frontend/app/layout.tsx
View File

@ -22,9 +22,8 @@ const arimo = Arimo({
}); });
export const metadata: Metadata = { export const metadata: Metadata = {
title: "Sign365", title: "FastPocket",
description: description: "FastPocket",
"Sign365 is your window into freedom from paper work. Get the paper work to do itself",
}; };
export default async function RootLayout({ export default async function RootLayout({

2
Frontend/components/BlogCard.tsx
View File

@ -9,7 +9,7 @@ function BlogCard({ title, slug, subtitle, image }: PostMetadata) {
<> <>
<Link <Link
href={`/blogs/${slug}`} href={`/blogs/${slug}`}
className="w-52 md:w-64 md:max-w-[300px] h-fit flex flex-col items-center flex-auto" className="w-52 md:w-64 md:max-w-[300px] h-fit flex flex-col items-center flex-auto bg-white dark:bg-black p-10 rounded-xl"
> >
<div className="w-full aspect-[4/3] bg-slate-400 rounded-lg overflow-hidden relative"> <div className="w-full aspect-[4/3] bg-slate-400 rounded-lg overflow-hidden relative">
<Image <Image

2
Frontend/components/Header.tsx
View File

@ -67,7 +67,7 @@ function Header({ isUserLoggedIn }: HeaderProps) {
) : ( ) : (
<button <button
onClick={() => logout()} onClick={() => logout()}
className={`btn-sm cursor-pointer py-5 w-24 text-primary-content ml-3 bg-error hover:bg-error/70`} className={`btn-sm cursor-pointer py-5 w-24 text-white ml-3 bg-error hover:bg-error/70`}
> >
Logout Logout
</button> </button>

7
Frontend/components/Logo.tsx
View File

@ -1,7 +1,6 @@
import React from "react"; import React from "react";
import logo from "@/images/icon.svg";
import Image from "next/image";
import Icon from "./icon"; import Icon from "./icon";
import Link from "next/link";
interface LogoProps { interface LogoProps {
label?: string; label?: string;
@ -10,7 +9,7 @@ interface LogoProps {
function Logo({ label, className }: LogoProps) { function Logo({ label, className }: LogoProps) {
return ( return (
<a <Link
href={ href={
label !== undefined label !== undefined
? "https://www.youtube.com/channel/UCZzzsJK5koyqUnP4x4oXnqw" ? "https://www.youtube.com/channel/UCZzzsJK5koyqUnP4x4oXnqw"
@ -28,7 +27,7 @@ function Logo({ label, className }: LogoProps) {
) : ( ) : (
<></> <></>
)} )}
</a> </Link>
); );
} }

2
Frontend/components/Navigation.tsx
View File

@ -70,7 +70,7 @@ function Navigation({ isUserLoggedIn }: { isUserLoggedIn: boolean }) {
<div className="drawer-side"> <div className="drawer-side">
<label htmlFor="my-drawer-3" className="drawer-overlay"></label> <label htmlFor="my-drawer-3" className="drawer-overlay"></label>
<ul className="menu w-80 h-full bg-base-200"> <ul className="menu w-80 h-full bg-white dark:bg-black">
{/* Sidebar content here */} {/* Sidebar content here */}
<div className="shrink-0 m-3"> <div className="shrink-0 m-3">
{/* Logo */} {/* Logo */}

23
Frontend/components/Utilities/Background.tsx Normal file
View File

@ -0,0 +1,23 @@
"use client";
import React, { ReactNode } from "react";
const Background = ({ children }: { children: ReactNode }) => {
const isDarkMode = (() =>
typeof window !== "undefined" &&
window.matchMedia &&
window.matchMedia("(prefers-color-scheme: dark)").matches)();
return (
<div
className="h-full relative w-full bg-center bg-no-repeat bg-cover bg-fixed min-h-screen"
style={{
backgroundImage: isDarkMode
? "linear-gradient(rgba(0, 0, 0, 0.7), rgba(135, 80, 156, 0.05)), url(/images/hero.jpg)"
: "linear-gradient(rgba(255, 255, 255, 0.7), rgba(135, 80, 156, 0.05)), url(/images/hero.jpg)",
}}
>
{children}
</div>
);
};
export default Background;

30
Frontend/package-lock.json generated
View File

@ -16,6 +16,7 @@
"@vidstack/react": "^1.9.8", "@vidstack/react": "^1.9.8",
"aos": "^2.3.4", "aos": "^2.3.4",
"autoprefixer": "10.4.15", "autoprefixer": "10.4.15",
"colorcolor": "^3.0.1",
"crypto-js": "^4.2.0", "crypto-js": "^4.2.0",
"daisyui": "^3.5.1", "daisyui": "^3.5.1",
"eslint": "8.47.0", "eslint": "8.47.0",
@ -2415,6 +2416,14 @@
"simple-swizzle": "^0.2.2" "simple-swizzle": "^0.2.2"
} }
}, },
"node_modules/colorcolor": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/colorcolor/-/colorcolor-3.0.1.tgz",
"integrity": "sha512-DIGQgRENjBP+MTI5Ua9teyZs2E7+ismYFxVN1vb3It1u+7G93aZzmDsUeRgxyoSKIsAz9PzEa7mHCCc6bChfJw==",
"dependencies": {
"css-color-names": "^1.0.1"
}
},
"node_modules/colord": { "node_modules/colord": {
"version": "2.9.3", "version": "2.9.3",
"license": "MIT" "license": "MIT"
@ -2461,6 +2470,14 @@
"node": ">=4" "node": ">=4"
} }
}, },
"node_modules/css-color-names": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/css-color-names/-/css-color-names-1.0.1.tgz",
"integrity": "sha512-/loXYOch1qU1biStIFsHH8SxTmOseh1IJqFvy8IujXOm1h+QjUdDhkzOrR5HG8K8mlxREj0yfi8ewCHx0eMxzA==",
"engines": {
"node": "*"
}
},
"node_modules/css-selector-tokenizer": { "node_modules/css-selector-tokenizer": {
"version": "0.8.0", "version": "0.8.0",
"license": "MIT", "license": "MIT",
@ -7771,6 +7788,14 @@
"simple-swizzle": "^0.2.2" "simple-swizzle": "^0.2.2"
} }
}, },
"colorcolor": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/colorcolor/-/colorcolor-3.0.1.tgz",
"integrity": "sha512-DIGQgRENjBP+MTI5Ua9teyZs2E7+ismYFxVN1vb3It1u+7G93aZzmDsUeRgxyoSKIsAz9PzEa7mHCCc6bChfJw==",
"requires": {
"css-color-names": "^1.0.1"
}
},
"colord": { "colord": {
"version": "2.9.3" "version": "2.9.3"
}, },
@ -7803,6 +7828,11 @@
"integrity": "sha512-FyyrDHZKEjXDpNJYvVsV960FiqQyXc/LlYmsxl2BcdMb2WPx0OGRVgTg55rPSyLSNMqP52R9r8geSp7apN3Ofg==", "integrity": "sha512-FyyrDHZKEjXDpNJYvVsV960FiqQyXc/LlYmsxl2BcdMb2WPx0OGRVgTg55rPSyLSNMqP52R9r8geSp7apN3Ofg==",
"peer": true "peer": true
}, },
"css-color-names": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/css-color-names/-/css-color-names-1.0.1.tgz",
"integrity": "sha512-/loXYOch1qU1biStIFsHH8SxTmOseh1IJqFvy8IujXOm1h+QjUdDhkzOrR5HG8K8mlxREj0yfi8ewCHx0eMxzA=="
},
"css-selector-tokenizer": { "css-selector-tokenizer": {
"version": "0.8.0", "version": "0.8.0",
"requires": { "requires": {

1
Frontend/package.json
View File

@ -17,6 +17,7 @@
"@vidstack/react": "^1.9.8", "@vidstack/react": "^1.9.8",
"aos": "^2.3.4", "aos": "^2.3.4",
"autoprefixer": "10.4.15", "autoprefixer": "10.4.15",
"colorcolor": "^3.0.1",
"crypto-js": "^4.2.0", "crypto-js": "^4.2.0",
"daisyui": "^3.5.1", "daisyui": "^3.5.1",
"eslint": "8.47.0", "eslint": "8.47.0",

8
Frontend/sections/AccountContent.tsx
View File

@ -150,10 +150,10 @@ function AccountContent({ user }: ManageSubscriptionProps) {
</h3> </h3>
{subscription ? ( {subscription ? (
<> <>
<h2 className="h2 text-3xl mb-3 text-base-content"> <h2 className="h2 text-3xl mb-3 text-black dark:text-white">
{subscription?.product?.name} {subscription?.product?.name}
</h2> </h2>
<p className="text-lg text-base-content mb-4"> <p className="text-lg text-black dark:text-white mb-4">
{subscription.product?.description} {subscription.product?.description}
</p> </p>
<button <button
@ -165,12 +165,12 @@ function AccountContent({ user }: ManageSubscriptionProps) {
</> </>
) : ( ) : (
<> <>
<p className="text-lg text-base-content mb-4"> <p className="text-lg text-black dark:text-white mb-4">
{"You haven’t upgraded your workflow yet"} {"You haven’t upgraded your workflow yet"}
</p> </p>
<button <button
onClick={() => router.push("/pricing")} onClick={() => router.push("/pricing")}
className="px-10 py-2 text-base capitalize !rounded-3xl text-base-content bg-gradient-to-r from-primary to-secondary hover:bg-gray-900 w-full sm:w-auto" className="px-10 py-2 text-base capitalize !rounded-3xl text-black dark:text-white bg-gradient-to-r from-primary to-secondary hover:bg-gray-900 w-full sm:w-auto"
> >
Upgrade Upgrade
</button> </button>

14
Frontend/sections/ContactUs/FormLeftDescriptionRightContactUs.tsx
View File

@ -7,17 +7,17 @@ const FormLeftDescriptionRightContactUs = () => {
<div className="max-w-[85rem] px-4 py-10 sm:px-6 lg:px-8 lg:py-14 mx-auto"> <div className="max-w-[85rem] px-4 py-10 sm:px-6 lg:px-8 lg:py-14 mx-auto">
<div className="max-w-2xl lg:max-w-5xl mx-auto"> <div className="max-w-2xl lg:max-w-5xl mx-auto">
<div className="text-center"> <div className="text-center">
<h1 className="text-3xl font-bold text-gray-800 sm:text-4xl dark:text-white"> <h1 className="text-3xl font-bold text-black sm:text-4xl dark:text-white">
Contact us Contact us
</h1> </h1>
<p className="mt-1 text-gray-600 dark:text-gray-400"> <p className="mt-1 text-black dark:text-white">
We&apos;d love to talk about how we can help you. We&apos;d love to talk about how we can help you.
</p> </p>
</div> </div>
<div className="mt-12 grid items-center lg:grid-cols-2 gap-6 lg:gap-16"> <div className="mt-12 grid items-center lg:grid-cols-2 gap-6 lg:gap-16">
{/* Card */} {/* Card */}
<div className="flex flex-col border rounded-xl p-4 sm:p-6 lg:p-8 dark:border-gray-700"> <div className="flex flex-col border rounded-xl p-4 sm:p-6 lg:p-8 dark:border-gray-700 ">
<h2 className="mb-8 text-xl font-semibold text-gray-800 dark:text-gray-200"> <h2 className="mb-8 text-xl font-semibold text-black dark:text-white">
Fill in the form Fill in the form
</h2> </h2>
<form> <form>
@ -105,7 +105,7 @@ const FormLeftDescriptionRightContactUs = () => {
</button> </button>
</div> </div>
<div className="mt-3 text-center"> <div className="mt-3 text-center">
<p className="text-sm text-gray-500"> <p className="text-sm text-black dark:text-white">
We&apos;ll get back to you in 1-2 business days. We&apos;ll get back to you in 1-2 business days.
</p> </p>
</div> </div>
@ -135,7 +135,7 @@ const FormLeftDescriptionRightContactUs = () => {
<h3 className="font-semibold text-gray-800 dark:text-gray-200"> <h3 className="font-semibold text-gray-800 dark:text-gray-200">
Knowledgebase Knowledgebase
</h3> </h3>
<p className="mt-1 text-sm text-gray-500"> <p className="mt-1 text-sm text-black dark:text-white">
We&apos;re here to help with any questions or code. We&apos;re here to help with any questions or code.
</p> </p>
<a <a
@ -280,7 +280,7 @@ const FormLeftDescriptionRightContactUs = () => {
<h3 className="font-semibold text-gray-800 dark:text-gray-200"> <h3 className="font-semibold text-gray-800 dark:text-gray-200">
Contact us by email Contact us by email
</h3> </h3>
<p className="mt-1 text-sm text-gray-500"> <p className="mt-1 text-sm text-black dark:text-white">
If you wish to write us an email instead please use If you wish to write us an email instead please use
</p> </p>
<a <a

2
Frontend/sections/Hero/SquaredBackgroundHero.tsx
View File

@ -11,7 +11,7 @@ const SquaredBackgroundHero = () => {
<div> <div>
<h1 className="block text-3xl font-bold text-primary-content sm:text-4xl lg:text-6xl lg:leading-tight"> <h1 className="block text-3xl font-bold text-primary-content sm:text-4xl lg:text-6xl lg:leading-tight">
Start your journey with{" "} Start your journey with{" "}
<span className="text-primary">Fast Pocket</span> <span className="text-primary">FastPocket</span>
</h1> </h1>
<p className="mt-3 text-lg text-secondary-content"> <p className="mt-3 text-lg text-secondary-content">
Hand-picked professionals and expertly crafted components, Hand-picked professionals and expertly crafted components,

22
Frontend/sections/Hero/WaitingListWithImageHero.tsx
View File

@ -3,21 +3,25 @@ import Icon from "@/components/icon";
import React from "react"; import React from "react";
const WaitingListWithImageHero = () => { const WaitingListWithImageHero = () => {
const isDarkMode = () =>
window.matchMedia &&
window.matchMedia("(prefers-color-scheme: dark)").matches;
return ( return (
<div <div
className="h-full relative w-full bg-center bg-no-repeat bg-cover bg-fixed" className="h-full relative w-full bg-center bg-no-repeat bg-cover bg-fixed"
style={{ style={{
backgroundImage: backgroundImage: isDarkMode()
"linear-gradient(rgba(0, 0, 0, 0.7), rgba(135, 80, 156, 0.05)), url(/images/hero.jpg)", ? "linear-gradient(rgba(0, 0, 0, 0.7), rgba(135, 80, 156, 0.05)), url(/images/hero.jpg)"
: "linear-gradient(rgba(255, 255, 255, 0.7), rgba(135, 80, 156, 0.05)), url(/images/hero.jpg)",
}} }}
> >
<div className="h-screen w-full bg-clip flex items-center justify-center"> <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"> <div className="text-center py-8 px-4 sm:px-6 lg:px-8">
<h1 className="text-3xl text-primary-content sm:text-4xl whitespace-nowrap flex flex-row justify-center pb-6 gap-x-3"> <h1 className="text-3xl text-black dark:text-white sm:text-4xl whitespace-nowrap flex flex-row justify-center pb-6 gap-x-3">
<Icon name="LeafThree24Filled" size="xlarge" /> <Icon name="LeafThree24Filled" size="xlarge" />
Bethel Farms Bethel Farms
</h1> </h1>
<h2 className="text-2xl text-primary-content sm:text-4xl"> <h2 className="text-2xl text-black dark:text-white sm:text-4xl">
Get notified when we launch Get notified when we launch
</h2> </h2>
<form> <form>
@ -33,12 +37,12 @@ const WaitingListWithImageHero = () => {
<input <input
type="text" type="text"
id="hs-cover-with-gradient-form-name-1" id="hs-cover-with-gradient-form-name-1"
className="py-3 ps-11 pe-4 block w-full bg-white/[.03] border-white/20 text-primary-content placeholder:text-primary-content rounded-lg text-sm focus:border-white/30 focus:ring-white/30 sm:p-4 sm:ps-11" className=" py-3 ps-11 pe-4 block w-full bg-white/[.03] border-white/20 placeholder:text-black dark:placeholder:text-white placeholder:text-black dark:text-white rounded-lg text-sm focus:border-white/30 focus:ring-white/30 sm:p-4 sm:ps-11"
placeholder="Full name" placeholder="Full name"
/> />
<div className="absolute inset-y-0 start-0 flex items-center pointer-events-none z-20 ps-4"> <div className="absolute inset-y-0 start-0 flex items-center pointer-events-none z-20 ps-4">
<svg <svg
className="flex-shrink-0 size-4 text-primary-content dark:text-white" className="flex-shrink-0 size-4 text-black dark:text-white"
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
width={24} width={24}
height={24} height={24}
@ -66,12 +70,12 @@ const WaitingListWithImageHero = () => {
<input <input
type="email" type="email"
id="hs-cover-with-gradient-form-email-1" id="hs-cover-with-gradient-form-email-1"
className="py-3 ps-11 pe-4 block w-full bg-white/[.03] border-white/20 text-primary-content placeholder:text-primary-content rounded-lg text-sm focus:border-white/30 focus:ring-white/30 sm:p-4 sm:ps-11" className=" py-3 ps-11 pe-4 block w-full bg-white/[.03] border-white/20 text-black placeholder:text-black dark:placeholder:text-white dark:text-white rounded-lg text-sm focus:border-white/30 focus:ring-white/30 sm:p-4 sm:ps-11"
placeholder="Email address" placeholder="Email address"
/> />
<div className="absolute inset-y-0 start-0 flex items-center pointer-events-none z-20 ps-4"> <div className="absolute inset-y-0 start-0 flex items-center pointer-events-none z-20 ps-4">
<svg <svg
className="flex-shrink-0 size-4 text-primary-content dark:text-white" className="flex-shrink-0 size-4 text-black dark:text-white"
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
width={24} width={24}
height={24} height={24}
@ -91,7 +95,7 @@ const WaitingListWithImageHero = () => {
<div className="grid"> <div className="grid">
<button <button
type="submit" type="submit"
className="sm:p-4 py-3 px-4 inline-flex justify-center items-center gap-x-2 text-sm font-semibold rounded-lg border border-transparent bg-white/10 text-primary-content hover:bg-white/20 disabled:opacity-50 disabled:pointer-events-none dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600" className=" sm:p-4 py-3 px-4 inline-flex justify-center items-center gap-x-2 text-sm font-semibold rounded-lg border border-transparent bg-white/10 text-black dark:text-white hover:bg-white/20 disabled:opacity-50 disabled:pointer-events-none dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600"
> >
Join the waitlist Join the waitlist
<svg <svg

11
Frontend/tailwind.config.ts
View File

@ -94,6 +94,17 @@ const config: Config = {
}, },
}, },
}, },
daisyui: {
themes: [
{
light: {
...require("daisyui/src/theming/themes")["light"],
"primary": '#c0df68',
"secondary": '#73d776'
},
},
],
},
plugins: [require("@tailwindcss/forms"), require("@tailwindcss/typography"), require("daisyui"), require('preline/plugin')], plugins: [require("@tailwindcss/forms"), require("@tailwindcss/typography"), require("daisyui"), require('preline/plugin')],
}; };
export default config; export default config;

0
Frontend/utils/colors.ts Normal file
View File