From cb265fe531b91d6e1b71512a80341e7f459e9c76 Mon Sep 17 00:00:00 2001
From: Aadil Ahmed <aadilahmed0@gmail.com>
Date: Wed, 7 Feb 2024 14:05:58 -0800
Subject: [PATCH] Replace slack-self-invite.svg with icon-slack.svg on CoP page
 (#6141)

* replace slack-self-invite.svg with icon-slack.svg on CoP page

* fix css for slack self invite svg
---
 _sass/components/_communities-of-practice.scss | 12 +++++++-----
 pages/communities-of-practice.html             |  4 +++-
 2 files changed, 10 insertions(+), 6 deletions(-)

diff --git a/_sass/components/_communities-of-practice.scss b/_sass/components/_communities-of-practice.scss
index 057c83a5e5..922607ea06 100644
--- a/_sass/components/_communities-of-practice.scss
+++ b/_sass/components/_communities-of-practice.scss
@@ -5,11 +5,13 @@
   margin-top: 31px;
 
   .self-invite-img {
-    /*Note "margin-top: 15px" is needed to keep this img aligned with neighboring text*/
-    margin-top: 15px;
-    margin-right: 27px;
-    width: 24px;
-    height: 24px;
+    color: #fa114f;
+    margin-top: 14px;
+    margin-right: 26px;
+    margin-left: -1px;
+    width: 26px;
+    height: 26px;
+    min-width: 26px;
   }
 
   .alert--communities {
diff --git a/pages/communities-of-practice.html b/pages/communities-of-practice.html
index 7e745f3a0a..3cce279671 100644
--- a/pages/communities-of-practice.html
+++ b/pages/communities-of-practice.html
@@ -15,7 +15,9 @@ <h1 class="title1">Communities of Practice</h1>
             If you'd like to join one of the Communities of Practice that has a regular meeting time, join their Slack channel and look for the meeting details, usually pinned or in the description. Otherwise, see the "How to get started" sections below.
         </p>
             <div class="header-self-invite--communities">
-                <img class="self-invite-img" src="/assets/images/communities-of-practice/slack-self-invite.svg" alt="slack icon" />
+                <svg version="1.1" class="self-invite-img" viewBox="0 0 90 90" xmlns="http://www.w3.org/2000/svg" width="100%">
+                    {% include svg/icon-slack.svg %}
+                </svg>
                 <p class="alert--communities">To join the Slack channels below, you first need to be a member of our Hack for LA Slack Community. If you have not joined yet, please follow the steps in <a href="/getting-started" target="_blank">Getting Started</a>.
             </p></div>
     </div>