adding banner

caesarHQ · Oct 20, 2023 · ba53aba · ba53aba
1 parent 60644b9
commit ba53aba
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 0 deletions.
diff --git a/client/censusGPT/src/App.js b/client/censusGPT/src/App.js
@@ -9,6 +9,7 @@ import { FeedContext } from './contexts/feedContext'
 import LoadingSpinner from './components/loadingSpinner'
 import ExamplesFeed from './components/examplesFeed'
 import Examples from './components/examples'
+import PromoBanner from './components/banner'
 
 import { ResultsContainer } from './components/results/resultsContainer'
 
@@ -842,6 +843,8 @@ function App(props) {
             className="h-screen bg-white dark:bg-dark-900 dark:text-white overflow-y-auto max-h-screen"
             style={{ position: 'relative' }}
         >
+            <PromoBanner />
+
             {showExplanationModal && (
                 <ExplanationModal
                     showExplanationModal={showExplanationModal}

diff --git a/client/censusGPT/src/components/banner.js b/client/censusGPT/src/components/banner.js
@@ -0,0 +1,23 @@
+import { XMarkIcon } from '@heroicons/react/20/solid';
+
+export default function PromoBanner() {
+    return (
+        <div className="flex items-center gap-x-6 bg-white px-6 py-10 sm:px-3.5 sm:before:flex-1">
+            <p className="text-xl leading-6 text-black">
+                <strong>Hey!</strong> The team behind CensusGPT is now working on Julius, your personal AI data analyst&nbsp;
+            </p>
+            <a
+                href="https://julius.ai?utm_source=censusGPT"
+                className="flex-none rounded-full bg-red-500 px-3.5 py-1 text-lg font-semibold text-white shadow-sm hover:bg-red-600 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gray-900"
+            >
+                Check out Julius <span aria-hidden="true">&rarr;</span>
+            </a>
+            <div className="flex flex-1 justify-end">
+                <button type="button" className="-m-3 p-3 focus-visible:outline-offset-[-4px]">
+                    <span className="sr-only">Dismiss</span>
+                    <XMarkIcon className="h-5 w-5 text-gray-900" aria-hidden="true" />
+                </button>
+            </div>
+        </div>
+    );
+}