custom fill colors for social tray icons

Author: thescientist13

src/assets/discord.svg

@@ -18,13 +18,13 @@ export default class Footer extends HTMLElement {
             </a>
           </li>
 
-          <li class="social-icon">
+          <li class="${styles.socialIcon}">
             <a href="https://discord.gg/bsy9jvWh" title="Discord">
               ${discordIcon}
             </a>
           </li>
 
-          <li class="social-icon">
+          <li class="${styles.socialIcon}">
             <a href="https://twitter.com/PrjEvergreen" title="Twitter">
               ${twitterIcon}
             </a>

src/assets/github.svg

@@ -21,11 +21,15 @@
   display: flex;
   gap: var(--size-3);
   list-style-type: none;
-  background-color: var(--color-gray);
+  background-color: var(--color-secondary);
   border: var(--border-size-1) solid var(--color-black);
   border-radius: var(--radius-6);
   padding: var(--size-2) var(--size-3);
   align-items: center;
   justify-content: center;
   cursor: pointer;
 }
+
+.socialIcon svg {
+  fill: var(--color-gray);
+}

src/assets/twitter-logo.svg

@@ -48,6 +48,10 @@ header {
   cursor: pointer;
 }
 
+.social-icon svg {
+  fill: var(--color-secondary);
+}
+
 .mobile-menu,
 .mobile-menu.active,
 .mobile-menu-items,