From 08c71fe9b2a7fc2fdc85812dbfbc37946a36629d Mon Sep 17 00:00:00 2001 From: vincanger <70215737+vincanger@users.noreply.github.com> Date: Fri, 8 Dec 2023 14:19:59 +0100 Subject: [PATCH] update banner and logos --- src/client/landing-page/LandingPage.tsx | 76 +++++++++++++++------ src/client/static/open-saas-alt-banner.png | Bin 0 -> 234782 bytes src/client/static/open-saas-banner.png | Bin 0 -> 863949 bytes tailwind.config.cjs | 1 + 4 files changed, 58 insertions(+), 19 deletions(-) create mode 100644 src/client/static/open-saas-alt-banner.png create mode 100644 src/client/static/open-saas-banner.png diff --git a/src/client/landing-page/LandingPage.tsx b/src/client/landing-page/LandingPage.tsx index ed765b6..d5cd263 100644 --- a/src/client/landing-page/LandingPage.tsx +++ b/src/client/landing-page/LandingPage.tsx @@ -1,4 +1,4 @@ -import { useState } from 'react'; +import { useState, useEffect } from 'react'; import { Dialog } from '@headlessui/react'; import { AiFillCheckCircle, AiFillCloseCircle } from 'react-icons/ai'; import { HiBars3 } from 'react-icons/hi2'; @@ -6,7 +6,8 @@ import { BiLogIn } from 'react-icons/bi'; import { Link } from '@wasp/router'; import logo from '../static/logo.png'; import daBoi from '../static/da-boi.png'; -import openSaasBanner from '../static/open-saas-banner-gr.png'; +import openSaasBanner from '../static/open-saas-banner.png'; +// import openSaasBanner from '../static/open-saas-alt-banner.p ng'; import { features, navigation, tiers, faqs, footerNavigation } from './contentSections'; import useAuth from '@wasp/auth/useAuth'; import DropdownUser from '../components/DropdownUser'; @@ -18,11 +19,24 @@ import { UserMenuItems } from '../components/UserMenuItems'; export default function LandingPage() { const [mobileMenuOpen, setMobileMenuOpen] = useState(false); const [isStripePaymentLoading, setIsStripePaymentLoading] = useState(false); + const [isDemoInfoVisible, setIsDemoInfoVisible] = useState(false); const { data: user, isLoading: isUserLoading } = useAuth(); const history = useHistory(); + useEffect(() => { + try { + if (localStorage.getItem('isDemoInfoVisible') === 'false') { + // do nothing + } else { + setIsDemoInfoVisible(true); + } + } catch (error) { + console.error(error); + } + }, []); + async function handleBuyNowClick(tierId: string) { if (!user) { history.push('/login'); @@ -42,16 +56,40 @@ export default function LandingPage() { } } + const handleDemoInfoClose = () => { + try { + localStorage.setItem('isDemoInfoVisible', 'false'); + setIsDemoInfoVisible(false); + } catch (error) { + console.error(error); + } + }; + const NavLogo = () => Open SaaS App; return (
+ {/* Floating Demo Announcement */} + {isDemoInfoVisible &&
+
+ + This demo app is the SaaS template. Feel free to play around! + + +
+
} {/* Header */}