Fix: Mislined social links in subscribe section on landing page

Author: webdev403

src/pages/LandingPage/CommunityBlock.tsx

@@ -49,11 +49,11 @@ const CommunityBlock: React.FC = ({}) => {
       icon: <Announcement />,
       title: 'Announcements',
     },
-    // {
-    //   link: 'https://t.me/+OQ-H4hjc-BU5ZmRl',
-    //   icon: <DiscordIcon />,
-    //   title: 'Discord',
-    // },
+    {
+      link: 'https://discord.gg/cSbHcjBSWM',
+      icon: <DiscordIcon />,
+      title: 'Discord',
+    },
     {
       link: 'https://blog.quickswap.exchange/',
       icon: <BlogIcon />,
@@ -217,7 +217,9 @@ const CommunityBlock: React.FC = ({}) => {
                 }
               >
                 <a href={val.link} target='_blank' rel='noopener noreferrer'>
-                  {val.icon}
+                  <Box height={64} style={{ alignContent: 'center' }}>
+                    {val.icon}
+                  </Box>
                   <Typography style={{ color: '#fff' }}>{val.title}</Typography>
                 </a>
               </Box>

src/pages/styles/landing.scss

@@ -452,8 +452,18 @@
         fill: white;
       }
       & img {
-        width: 64px;
-        height: 64px;
+        width: 48px;
+        height: 48px;
+        margin-bottom: 8px;
+        filter: grayscale(1);
+        @media screen and (max-width: '900px') {
+          width: 48px;
+          height: 48px;
+        }
+      }
+      & svg {
+        width: 48px;
+        height: 48px;
         margin-bottom: 8px;
         filter: grayscale(1);
         @media screen and (max-width: '900px') {
@@ -464,6 +474,14 @@
       &.svgFill svg path {
         fill: $textPrimary;
       }
+      &.svgFill,
+      & svg {
+        opacity: 0.8;
+      }
+      &.svgFill,
+      & a:hover svg {
+        opacity: 1;
+      }
       &.noFill svg,
       & img {
         opacity: 0.8;