fix: A lot of stage channel bugs & the account switcher (#219)

* fix: Account switcher selected icon

* fix: Stage channel invite button

* fix: Stage channel raise hand button

* fix: Strange gradient on forum channel headers

* fix: Red buttons turn blue on click

src/components/_buttons.scss

@@ -29,6 +29,11 @@
   }
 }
 
+// For some reason, red buttons on click turn blue. Sure.
+button[class*="lookFilled-"][class*="colorRed-"]:active {
+  background-color: $red;
+}
+
 [class*="lookOutlined-"][class*="colorPrimary-"] {
   border-color: $surface1;
 

src/components/_chat.scss

@@ -369,6 +369,13 @@ div[class|="callContainer"] {
       }
     }
 
+    div[class|="bottomControls"] {
+      button[class|="textButton"] {
+        color: $text;
+        background-color: $surface1;
+      }
+    }
+
     div[class|="toolbar"] {
       svg[class|="controlIcon"] {
         color: var(--interactive-normal);
@@ -417,6 +424,10 @@ div[class|="callContainer"] {
         [class*="centerIcon-"] {
           color: $text;
         }
+
+        svg[class|="raisedHandButtonIcon"] {
+          color: $text;
+        }
       }
 
       &[class*="green-"] {
@@ -444,6 +455,14 @@ div[class|="callContainer"] {
   }
 }
 
+// Weird gradient thing on forums
+div[class|="chat"]
+  section[class*="forumOrHome-"]
+  div[class|="upperContainer"]
+  > div[class|="children"]:after {
+  background: none;
+}
+
 // gifts
 div[class*="giftCodeContainer"] [class*="tile"] {
   background-color: $mantle;

src/components/_popouts.scss

@@ -45,9 +45,31 @@ div[class|="layerContainer"] [role="menu"] {
     }
   }
 
-  // make the switch account username crust when focused
-  [class*="focused"] [class*="userMenuUsername"] * {
-    color: $crust;
+  // Account switcher submenu
+  div[id|="account-switch-account"] {
+    &[class*="focused"] {
+      div[class*="userMenuUsername"] div {
+        color: $crust;
+      }
+
+      svg[class|="activeIcon"] {
+        circle {
+          fill: $blue;
+        }
+        g path {
+          fill: $crust;
+        }
+      }
+    }
+
+    svg[class|="activeIcon"] {
+      circle {
+        fill: $crust;
+      }
+      g path {
+        fill: $blue;
+      }
+    }
   }
 
   [class*="colorDanger"][class*="focused"],