From 5c6c63821b688271b95a95d39ec2fdeb026ab702 Mon Sep 17 00:00:00 2001
From: Derrick Hammer <derrick@derrickhammer.com>
Date: Thu, 26 May 2022 02:15:43 -0400
Subject: [PATCH] *Add discord button for community

---
 src/components/Header.tsx | 11 ++++++++---
 src/css/style.scss        | 11 +++++++++++
 2 files changed, 19 insertions(+), 3 deletions(-)

diff --git a/src/components/Header.tsx b/src/components/Header.tsx
index ba02d3c..ac02f9c 100644
--- a/src/components/Header.tsx
+++ b/src/components/Header.tsx
@@ -6,9 +6,14 @@ import {StaticImage} from "gatsby-plugin-image";
 const Header = () => (
     <div className="header">
         <Link to={"/"}><StaticImage src={"../images/logo.png"} alt={"Lume Web"} className={"logo"}/> </Link>
-        <Link to={"/donate"}>
-            <button className="donate-btn">Donate</button>
-        </Link>
+        <div className={"header-buttons"}>
+            <Link to={"/donate"}>
+                <button className="donate-btn">Donate</button>
+            </Link>
+            <a href="https://discord.gg/3fe4KZhZ9y" target="_blank">
+                <button className="donate-btn">Discord</button>
+            </a>
+        </div>
     </div>
 )
 
diff --git a/src/css/style.scss b/src/css/style.scss
index 6287003..ad83bde 100644
--- a/src/css/style.scss
+++ b/src/css/style.scss
@@ -123,6 +123,14 @@ p + p {
     -ms-flex-pack: justify;
     justify-content: space-between;
     margin-bottom: 8px;
+
+    .header-buttons {
+        justify-content: space-evenly;
+
+        a {
+            margin: 0.5em;
+        }
+    }
 }
 
 .logo {
@@ -340,6 +348,7 @@ p + p {
     -ms-flex-pack: center;
     justify-content: center;
     margin: 24px 0 16px 0;
+
     & a {
         margin-right: 1em;
     }
@@ -879,6 +888,7 @@ blockquote {
     padding: 0.5em 10px;
     quotes: "\201C""\201D""\2018""\2019";
 }
+
 blockquote:before {
     color: #ccc;
     content: open-quote;
@@ -887,6 +897,7 @@ blockquote:before {
     margin-right: 0.25em;
     vertical-align: -0.4em;
 }
+
 blockquote p {
     display: inline;
 }