fix discord transparency and add classes to target svg fills for themes

src/react-components/home/HomePage.js

@@ -74,7 +74,11 @@ export function HomePage() {
             <SignInButton mobile />
           )}
           <div className={styles.logoContainer}>
-            {isHmc ? <HmcLogo /> : <img alt={configs.translation("app-name")} src={configs.image("logo")} />}
+            {isHmc ? (
+              <HmcLogo className="hmc-logo" />
+            ) : (
+              <img alt={configs.translation("app-name")} src={configs.image("logo")} />
+            )}
           </div>
           <div className={styles.appInfo}>
             <div className={styles.appDescription}>{configs.translation("app-description")}</div>

src/react-components/layout/Header.scss

@@ -138,6 +138,9 @@ header {
   svg {
     margin-left: 21px;
     cursor: pointer;
+      *[fill]{
+        fill: theme.$text1-color;
+      }
   }
   li:first-child {
     padding-top: 0;

src/react-components/layout/LoadingScreenLayout.js

@@ -10,7 +10,7 @@ export function LoadingScreenLayout({ center, bottom, logoSrc }) {
   return (
     <div className={styles.loadingScreenLayout}>
       <Column center padding gap="lg" className={styles.center}>
-        {isHmc ? <HmcLogo /> : <img className={styles.logo} src={logoSrc} />}
+        {isHmc ? <HmcLogo className="hmc-logo" /> : <img className={styles.logo} src={logoSrc} />}
         {center}
       </Column>
       {bottom && (

src/react-components/room/RoomEntryModal.js

@@ -37,7 +37,9 @@ export function RoomEntryModal({
       <Column center className={styles.content}>
         {breakpoint !== "sm" &&
           breakpoint !== "md" && (
-            <div className={styles.logoContainer}>{isHmc ? <HmcLogo /> : <img src={logoSrc} alt={appName} />}</div>
+            <div className={styles.logoContainer}>
+              {isHmc ? <HmcLogo className="hmc-logo" /> : <img src={logoSrc} alt={appName} />}
+            </div>
           )}
         <div className={styles.roomName}>
           <h5>

src/react-components/scene-ui.js

@@ -217,7 +217,7 @@ class SceneUI extends Component {
           <div className={styles.mainPanel}>
             <a href="/" className={styles.logo}>
               {isHmc ? (
-                <HmcLogo />
+                <HmcLogo className="hmc-logo" />
               ) : (
                 <img
                   src={configs.image("logo")}

src/react-components/styles/global.scss

@@ -463,3 +463,9 @@ input::placeholder {
 summary {
   cursor: pointer;
 }
+
+.hmc-logo {
+  [fill] {
+    fill: theme.$text1-color;
+  }
+}