From 0139a91882008ac57ce0efa0b319ceef5235d674 Mon Sep 17 00:00:00 2001
From: Paul <paulmakles@gmail.com>
Date: Mon, 2 Aug 2021 22:03:59 +0100
Subject: [PATCH] Add donation button to home page.

---
 src/components/ui/Button.tsx | 19 +++++++++++++++++++
 src/pages/home/Home.tsx      | 18 +++++++++++-------
 2 files changed, 30 insertions(+), 7 deletions(-)

diff --git a/src/components/ui/Button.tsx b/src/components/ui/Button.tsx
index 0fefdab3..e9027a76 100644
--- a/src/components/ui/Button.tsx
+++ b/src/components/ui/Button.tsx
@@ -6,6 +6,7 @@ interface Props {
     readonly contrast?: boolean;
     readonly plain?: boolean;
     readonly error?: boolean;
+    readonly gold?: boolean;
     readonly iconbutton?: boolean;
 }
 
@@ -125,4 +126,22 @@ export default styled.button<Props>`
                 background: var(--error);
             }
         `}
+    
+    ${(props) =>
+        props.gold &&
+        css`
+            color: black;
+            font-weight: 600;
+            background: goldenrod;
+
+            &:hover {
+                filter: brightness(1.2);
+                background: goldenrod;
+            }
+
+            &:disabled {
+                cursor: not-allowed;
+                background: goldenrod;
+            }
+        `}
 `;
diff --git a/src/pages/home/Home.tsx b/src/pages/home/Home.tsx
index de554cd6..0574b42a 100644
--- a/src/pages/home/Home.tsx
+++ b/src/pages/home/Home.tsx
@@ -1,3 +1,4 @@
+import { Coffee } from "@styled-icons/boxicons-regular";
 import { Home as HomeIcon } from "@styled-icons/boxicons-solid";
 import { Link } from "react-router-dom";
 
@@ -17,7 +18,8 @@ export default function Home() {
                 <Text id="app.navigation.tabs.home" />
             </Header>
             <h3>
-                <Text id="app.special.modals.onboarding.welcome" />{" "}
+                <Text id="app.special.modals.onboarding.welcome" />
+                <br />
                 <img src={wideSVG} />
             </h3>
             <div className={styles.actions}>
@@ -26,6 +28,14 @@ export default function Home() {
                         Join testers server
                     </Button>
                 </Link>
+                <a
+                    href="https://insrt.uk/donate"
+                    target="_blank"
+                    rel="noreferrer">
+                    <Button contrast gold>
+                        Donate to Revolt
+                    </Button>
+                </a>
                 <Link to="/settings/feedback">
                     <Button contrast>Give feedback</Button>
                 </Link>
@@ -34,12 +44,6 @@ export default function Home() {
                         <Button contrast>Open settings</Button>
                     </Tooltip>
                 </Link>
-                <a
-                    href="https://gitlab.insrt.uk/revolt"
-                    target="_blank"
-                    rel="noreferrer">
-                    <Button contrast>Source code</Button>
-                </a>
             </div>
         </div>
     );