From 9fe05aa832752ff18cb0b60abf128d3352338cc7 Mon Sep 17 00:00:00 2001
From: Derrick Hammer <derrick@derrickhammer.com>
Date: Sat, 17 Jun 2023 21:38:56 -0400
Subject: [PATCH] refactor: update layout community icons

---
 .../Layout/JoinCommunity/JoinCommunity.astro  |  14 +-
 .../Layout/JoinCommunity/JoinCommunity.scss   | 132 +++++++++---------
 2 files changed, 74 insertions(+), 72 deletions(-)

diff --git a/src/components/Layout/JoinCommunity/JoinCommunity.astro b/src/components/Layout/JoinCommunity/JoinCommunity.astro
index 0cd7120..c6788df 100644
--- a/src/components/Layout/JoinCommunity/JoinCommunity.astro
+++ b/src/components/Layout/JoinCommunity/JoinCommunity.astro
@@ -11,6 +11,12 @@ import './JoinCommunity.scss';
       Web3 gives people control over their data, privacy, and ownership.
     </p>
   </div>
+    <div>
+        <a href="#" title="GitHub" class="git-logo">
+
+            <svg xmlns="http://www.w3.org/2000/svg" width="92pt" height="92pt" viewBox="0 0 92 92"><defs><clipPath id="a"><path d="M0 .113h91.887V92H0Zm0 0"/></clipPath></defs><g clip-path="url(#a)"><path style="stroke:none;fill-rule:nonzero;fill:#100f0d;fill-opacity:1" d="M90.156 41.965 50.036 1.848a5.913 5.913 0 0 0-8.368 0l-8.332 8.332 10.566 10.566a7.03 7.03 0 0 1 7.23 1.684 7.043 7.043 0 0 1 1.673 7.277l10.183 10.184a7.026 7.026 0 0 1 7.278 1.672 7.04 7.04 0 0 1 0 9.957 7.045 7.045 0 0 1-9.961 0 7.038 7.038 0 0 1-1.532-7.66l-9.5-9.497V59.36a7.04 7.04 0 0 1 1.86 11.29 7.04 7.04 0 0 1-9.957 0 7.04 7.04 0 0 1 0-9.958 7.034 7.034 0 0 1 2.308-1.539V33.926a7.001 7.001 0 0 1-2.308-1.535 7.049 7.049 0 0 1-1.516-7.7L29.242 14.273 1.734 41.777a5.918 5.918 0 0 0 0 8.371L41.855 90.27a5.92 5.92 0 0 0 8.368 0l39.933-39.934a5.925 5.925 0 0 0 0-8.371"/></g></svg>
+        </a>
+    </div>
   <div>
     <a href="#" title="GitHub" class="github-logo">
       <svg viewBox="0 0 98 96" xmlns="http://www.w3.org/2000/svg">
@@ -32,12 +38,4 @@ import './JoinCommunity.scss';
       </svg>
     </a>
   </div>
-  <div>
-    <a href="#" title="Facebook" class="facebook-logo">
-      <svg viewBox="0 0 40 40" xmlns="http://www.w3.org/2000/svg">
-        <path fill="currentcolor" d="M16.7 39.8C7.2 38.1 0 29.9 0 20 0 9 9 0 20 0s20 9 20 20c0 9.9-7.2 18.1-16.7 19.8l-1.1-.9h-4.4l-1.1.9z"/>
-        <path fill="#7afcbb" d="m27.8 25.6.9-5.6h-5.3v-3.9c0-1.6.6-2.8 3-2.8H29V8.2c-1.4-.2-3-.4-4.4-.4-4.6 0-7.8 2.8-7.8 7.8V20h-5v5.6h5v14.1c1.1.2 2.2.3 3.3.3 1.1 0 2.2-.1 3.3-.3V25.6h4.4z"/>
-      </svg>
-    </a>
-  </div>
 </section>
diff --git a/src/components/Layout/JoinCommunity/JoinCommunity.scss b/src/components/Layout/JoinCommunity/JoinCommunity.scss
index ab6dc62..742bcca 100644
--- a/src/components/Layout/JoinCommunity/JoinCommunity.scss
+++ b/src/components/Layout/JoinCommunity/JoinCommunity.scss
@@ -2,79 +2,83 @@
 @import "/src/styles/vars.scss";
 
 #join-community {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 2em;
-  padding: 5em 7.5%;
-  background: $color-aquamarine;
-  color: $color-blue-charcoal-2;
-  @include fluid-font-size(0.625rem);
-
-  div {
-    flex-grow: 1;
-
-    &:first-child {
-      flex-grow: 10;
-    }
-
-    &:last-child {
-      flex-grow: 0;
-    }
-  }
-
-  @media screen and (max-width: 56rem) {
-    flex-wrap: wrap;
-    justify-content: center;
-
-    div:first-child {
-      flex-basis: 100%;
-      margin-bottom: 2em;
-      text-align: center;
-    }
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 2em;
+    padding: 5em 7.5%;
+    background: $color-aquamarine;
+    color: $color-blue-charcoal-2;
+    @include fluid-font-size(0.625rem);
 
     div {
-      flex-grow: 0;
+        flex-grow: 1;
+
+        &:first-child {
+            flex-grow: 10;
+        }
+
+        &:last-child {
+            flex-grow: 0;
+        }
     }
-  }
 
-  h2 {
-    margin-bottom: 0.25em;
-    @include fluid-font-size(2rem);
-    font-weight: 700;
-    line-height: 153%;
-    text-transform: none;
-    color: inherit;
-  }
+    @media screen and (max-width: 56rem) {
+        flex-wrap: wrap;
+        justify-content: center;
 
-  p {
-    font-family: $font-family-jaldi;
-    @include fluid-font-size(1.5rem);
-    line-height: 157%;
-  }
+        div:first-child {
+            flex-basis: 100%;
+            margin-bottom: 2em;
+            text-align: center;
+        }
 
-  a {
-    display: block;
-    color: #0B3F48;
-
-    &:hover {
-      color: inherit;
+        div {
+            flex-grow: 0;
+        }
     }
-  }
 
-  .github-logo svg {
-    @include fluid-width(3.625rem);
-  }
+    h2 {
+        margin-bottom: 0.25em;
+        @include fluid-font-size(2rem);
+        font-weight: 700;
+        line-height: 153%;
+        text-transform: none;
+        color: inherit;
+    }
 
-  .discord-logo svg {
-    @include fluid-width(3.625rem);
-  }
+    p {
+        font-family: $font-family-jaldi;
+        @include fluid-font-size(1.5rem);
+        line-height: 157%;
+    }
 
-  .twitter-logo svg {
-    @include fluid-width(3.625rem);
-  }
+    a {
+        display: block;
+        color: #0B3F48;
 
-  .facebook-logo svg {
-    @include fluid-width(3.625rem);
-  }
+        &:hover {
+            color: inherit;
+        }
+    }
+
+    .github-logo svg {
+        @include fluid-width(3.625rem);
+    }
+
+    .git-logo svg {
+        @include fluid-width(3.625rem);
+    }
+
+    .discord-logo svg {
+        @include fluid-width(3.625rem);
+    }
+
+    .twitter-logo svg {
+        @include fluid-width(3.625rem);
+    }
+
+    .facebook-logo svg {
+        @include fluid-width(3.625rem);
+    }
 }