From 6e4fe6478952f419d1b4368be696b784436f8dc9 Mon Sep 17 00:00:00 2001
From: sethburkart123 <seth.burkart@hills.adventist.edu.au>
Date: Sun, 25 Aug 2024 09:33:05 +1000
Subject: [PATCH] feat: add theme idea button on store to encourage sharing

---
 src/interface/main.tsx        | 8 ++++----
 src/interface/pages/Store.tsx | 9 +++++++++
 2 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/src/interface/main.tsx b/src/interface/main.tsx
index 0c1fdb18..fb1e37bb 100644
--- a/src/interface/main.tsx
+++ b/src/interface/main.tsx
@@ -35,11 +35,11 @@ root.render(
       <div className="grid w-full h-screen text-center place-content-center dark:text-white">
         <h1 className="text-2xl font-bold">An error occurred 😭😭😭</h1>
         <p className="text-lg">Try clicking this button and see if it helps...</p>
-        <button className='flex gap-2 p-2 px-4 mx-auto mt-4 text-white rounded-lg bg-zinc-100 dark:bg-zinc-800/20 outline outline-white/20 w-fit' onClick={() => window.location.reload()}>
+        <button className='flex gap-2 p-2 px-4 mx-auto mt-4 rounded-lg dark:text-white bg-zinc-100 dark:bg-zinc-800/20 outline outline-white/20 w-fit' onClick={() => window.location.reload()}>
           <svg height="18" width="18" viewBox="0 0 18 18" xmlns="http://www.w3.org/2000/svg">
-            <g fill="#F7F7F7">
-              <path d="M9.03,12.22c-.293-.293-.768-.293-1.061,0s-.293,.768,0,1.061l1.208,1.208c-.059,.002-.118,.012-.178,.012-3.032,0-5.5-2.467-5.5-5.5,0-1.616,.706-3.143,1.938-4.191,.315-.269,.354-.742,.085-1.057s-.74-.353-1.058-.085c-1.567,1.333-2.466,3.277-2.466,5.333,0,3.76,2.983,6.829,6.704,6.985l-.735,.735c-.293,.293-.293,.768,0,1.061,.146,.146,.338,.22,.53,.22s.384-.073,.53-.22l2.25-2.25c.293-.293,.293-.768,0-1.061l-2.25-2.25Z" fill="#F7F7F7"/>
-              <path d="M9.296,2.015l.735-.735c.293-.293,.293-.768,0-1.061s-.768-.293-1.061,0l-2.25,2.25c-.293,.293-.293,.768,0,1.061l2.25,2.25c.146,.146,.338,.22,.53,.22s.384-.073,.53-.22c.293-.293,.293-.768,0-1.061l-1.208-1.208c.059-.002,.118-.012,.177-.012,3.032,0,5.5,2.467,5.5,5.5,0,1.616-.706,3.143-1.938,4.191-.315,.269-.354,.742-.085,1.057,.148,.174,.359,.264,.571,.264,.172,0,.345-.059,.486-.179,1.567-1.333,2.466-3.277,2.466-5.333,0-3.76-2.983-6.829-6.704-6.985Z" fill="#F7F7F7"/>
+            <g fill="currentColor">
+              <path d="M9.03,12.22c-.293-.293-.768-.293-1.061,0s-.293,.768,0,1.061l1.208,1.208c-.059,.002-.118,.012-.178,.012-3.032,0-5.5-2.467-5.5-5.5,0-1.616,.706-3.143,1.938-4.191,.315-.269,.354-.742,.085-1.057s-.74-.353-1.058-.085c-1.567,1.333-2.466,3.277-2.466,5.333,0,3.76,2.983,6.829,6.704,6.985l-.735,.735c-.293,.293-.293,.768,0,1.061,.146,.146,.338,.22,.53,.22s.384-.073,.53-.22l2.25-2.25c.293-.293,.293-.768,0-1.061l-2.25-2.25Z" fill="currentColor"/>
+              <path d="M9.296,2.015l.735-.735c.293-.293,.293-.768,0-1.061s-.768-.293-1.061,0l-2.25,2.25c-.293,.293-.293,.768,0,1.061l2.25,2.25c.146,.146,.338,.22,.53,.22s.384-.073,.53-.22c.293-.293,.293-.768,0-1.061l-1.208-1.208c.059-.002,.118-.012,.177-.012,3.032,0,5.5,2.467,5.5,5.5,0,1.616-.706,3.143-1.938,4.191-.315,.269-.354,.742-.085,1.057,.148,.174,.359,.264,.571,.264,.172,0,.345-.059,.486-.179,1.567-1.333,2.466-3.277,2.466-5.333,0-3.76-2.983-6.829-6.704-6.985Z" fill="currentColor"/>
             </g>
           </svg>
           Reload
diff --git a/src/interface/pages/Store.tsx b/src/interface/pages/Store.tsx
index 10d10559..12296f2e 100644
--- a/src/interface/pages/Store.tsx
+++ b/src/interface/pages/Store.tsx
@@ -310,6 +310,15 @@ const Store = () => {
             </div>
           ))}
 
+            <a href="https://betterseqta.gitbook.io/" className='w-full cursor-pointer'>
+              <div className="bg-zinc-50 h-48 w-full transition-all hover:scale-105 duration-500 relative justify-center items-center group group/card flex flex-col hover:shadow-2xl dark:hover:shadow-white/[0.1] hover:shadow-white/[0.8] dark:bg-zinc-800 dark:border-white/[0.1] rounded-xl overflow-clip border">
+                <div className="text-2xl font-IconFamily">{'\uecb3'}</div>
+                <div className="text-xl font-bold text-center transition-all duration-500 dark:text-white">
+                  Got a Theme Idea?
+                  <p className="text-lg font-light subtitle">Transform it into a stunning theme!</p>
+                </div>
+              </div>
+            </a>
         </div>
         {filteredThemes.length == 0 && !loading && (
           <div className="flex flex-col items-center justify-center w-full text-center h-96">