Add footer

spatie · Jan 3, 2024 · 4c30a11 · 4c30a11
1 parent 5bd834e
commit 4c30a11
Show file tree

Hide file tree

Showing 5 changed files with 25,809 additions and 80 deletions.
diff --git a/resources/compiled/ignition.css b/resources/compiled/ignition.css
diff --git a/resources/compiled/ignition.js b/resources/compiled/ignition.js
diff --git a/resources/js/Ignition.tsx b/resources/js/Ignition.tsx
@@ -17,7 +17,7 @@ import {
 import {IgniteData} from './types';
 import {useInView} from 'react-intersection-observer';
 import AppDebugWarning from 'components/AppDebugWarning';
-import FlareFooter from "components/FlareFooter";
+import Footer from "components/Footer";
 
 type Props = {
     errorOccurrence: ErrorOccurrence;
@@ -59,7 +59,7 @@ export default function Ignition({
 
                                 {hasDebugInfo(errorOccurrence) && <Section name="debug" children={<Debug/>}/>}
 
-                                <Section name="flare" children={<FlareFooter />}/>
+                                <Section name="footer" children={<Footer />}/>
                             </main>
                         </InViewContextProvider>
                     </ErrorOccurrenceContext.Provider>

diff --git a/resources/js/components/FlareFooter.tsx b/resources/js/components/FlareFooter.tsx
diff --git a/resources/js/components/Footer.tsx b/resources/js/components/Footer.tsx
@@ -0,0 +1,43 @@
+import {FlareIcon, IgnitionIcon} from '@flareapp/ignition-ui';
+import React from 'react';
+
+export default function Footer() {
+    return (
+        <footer
+            className="mx-auto mb-20 px-6 lg:px-10 max-w-4xl lg:max-w-[90rem] | flex flex-row justify-between gap-4 ~text-gray-500">
+            <ul className="grid grid-flow-col gap-5 justify-center items-center uppercase text-xs font-medium">
+                <li>
+                    <IgnitionIcon/>
+                </li>
+                <li>·</li>
+                <li>
+                    <a href="https://github.com/spatie/laravel-ignition" target="_blank"
+                       className="hover:text-red-500">Source</a>
+                </li>
+                <li>·</li>
+                <li>
+                    <a href="https://flareapp.io/docs/ignition/introducing-ignition/overview" target="_blank"
+                       className="hover:text-red-500">Docs</a>
+                </li>
+                <li>·</li>
+                <li>
+                    <a href="https://laravel.com" target="_blank" className="hover:text-red-500">Laravel</a>
+                </li>
+            </ul>
+            <div className="text-sm flex items-center">
+                <p>
+                Ignition is built by
+                <a
+                    href="https://flareapp.io/?utm_campaign=ignition&utm_source=ignition"
+                    target="_blank"
+                    className="font-medium hover:text-purple-500"
+                >
+                    <FlareIcon className={"inline-block -mt-1 ml-1 mr-px"}/>
+                    Flare
+                </a>,
+                the Laravel error reporting service.
+                </p>
+            </div>
+        </footer>
+    )
+}