collapse

.prettierrc

@@ -2,5 +2,6 @@
     "semi": true,
     "bracketSpacing": false,
     "endOfLine": "lf",
-    "printWidth": 120
+    "printWidth": 120,
+    "tabWidth": 2
 }

pxvmc.scss

@@ -18,3 +18,4 @@
 @use "src/guilds";
 @use "src/misc";
 @use "src/ansi_chain";
+@use "src/collapse";

src/collapse.scss

@@ -0,0 +1,54 @@
+@media (width < 1300px) {
+  html:not(.visual-refresh) [class^="sidebar_"]:not([class*="hidden_"]),
+  [class^="sidebar_"] {
+    width: 48px !important;
+
+    [class^="devBanner_"],
+    .dmDates-date,
+    .dmFavorites-icon,
+    [data-list-item-id^="channels___boosts-"],
+    [class^="linkTop_"] > [class^="children"] {
+      display: none;
+    }
+  }
+  html:not(.visual-refresh) [class^="sidebar_"]:not([class*="hidden_"]):hover,
+  [class^="sidebar_"]:hover {
+    width: 240px !important;
+
+    [class^="devBanner_"],
+    .dmDates-date,
+    .dmFavorites-icon {
+      display: block;
+    }
+    [data-list-item-id^="channels___boosts-"],
+    [class^="linkTop_"] > [class^="children"] {
+      display: flex;
+    }
+  }
+
+  [class^="chat_"] > [class^="content_"] > [class^="container_"]:nth-child(2) > [class^="membersWrap_"],
+  [class^="chat_"] > [class^="content_"] > [class^="container_"]:nth-child(2),
+  [class^="chat_"] > [class^="content_"] > [class^="membersWrap_"] {
+    width: 48px !important;
+    min-width: 48px !important;
+    --custom-member-list-width: 48px !important;
+
+    [class^="membersGroup_"],
+    [class*="openOnHover_"] {
+      display: none;
+    }
+  }
+
+  [class^="chat_"] > [class^="content_"] > [class^="container_"]:nth-child(2):hover,
+  [class^="chat_"] > [class^="content_"] > [class^="container_"]:hover > [class^="membersWrap_"],
+  [class^="chat_"] > [class^="content_"] > [class^="membersWrap_"]:hover {
+    width: 240px !important;
+    min-width: 240px !important;
+    --custom-member-list-width: 240px !important;
+
+    [class^="membersGroup_"],
+    [class*="openOnHover_"] {
+      display: flex;
+    }
+  }
+}

src/misc.scss

@@ -63,6 +63,11 @@ nav[class*="guilds_"] [class^="itemsContainer_"] > [class^="footer_"] {
   display: none;
 }
 
+.mediaControls {
+  padding: 4px;
+  padding-bottom: 0.5rem;
+}
+
 /* unround */
 *,
 [class],

src/private_channels.scss

@@ -9,7 +9,7 @@
   > [class^="privateChannels_"] {
   & > [class^="scroller_"] {
     & > [class^="content_"] {
-      & > [class^="channel_"] {
+      [class^="channel_"] {
         margin-left: 0;
         max-width: unset;
 
@@ -99,7 +99,11 @@
           font-weight: normal;
           font-size: 12px;
           color: colors.$c7;
-          text-shadow: 0px 0px 4px colors.$c0, 0px 0px 4px colors.$c0, 0px 0px 4px colors.$c0, 0px 0px 4px colors.$c0;
+          text-shadow:
+            0px 0px 4px colors.$c0,
+            0px 0px 4px colors.$c0,
+            0px 0px 4px colors.$c0,
+            0px 0px 4px colors.$c0;
           margin-left: 5px;
         }