From 548cda69606f9860bd23e4405206729f99f90ea2 Mon Sep 17 00:00:00 2001
From: thejayyy <151413454+thejayyy@users.noreply.github.com>
Date: Tue, 4 Feb 2025 16:03:42 +1100
Subject: [PATCH] Update classes + fixes

After updating classes, the following issues were fixed:
* User area with sound settings and settings cog is cut off
* Elements from other layers appear in the settings popup
* Background is not consistent on Discover button (was not yellow)
* Friends tab is called Trollslum
* Pesterchum icon does not display, displays a styled Discord icon

Please note tab styling was also updated, making them thinner and with
centered text.
---
 scss/main/_a.scss                    | 18 ++++---
 scss/main/_dm.scss                   | 69 ++++++++++++-------------
 scss/main/_forum.scss                | 76 ++++++++++++++--------------
 scss/main/_header.scss               | 24 ++++-----
 scss/main/_memberslist.scss          |  8 +--
 scss/main/_membersview.scss          |  6 +--
 scss/main/_messages.scss             | 24 ++++-----
 scss/main/_messagesspecial.scss      | 62 +++++++++++------------
 scss/main/_search.scss               | 24 ++++-----
 scss/main/_serverslist.scss          | 29 ++++++-----
 scss/main/_split.scss                | 12 ++---
 scss/main/_titlebar.scss             |  4 +-
 scss/main/channels/_a.scss           |  8 +--
 scss/main/channels/_channellist.scss | 18 +++----
 scss/main/channels/_userpanel.scss   | 28 +++++-----
 scss/overlay/_settings.scss          | 34 +++++++------
 scss/overlay/_userprofile.scss       | 36 ++++++-------
 scss/part/_loading.scss              | 12 ++---
 scss/part/_scrollbar.scss            | 10 ++--
 scss/part/_tabs.scss                 |  6 ++-
 20 files changed, 259 insertions(+), 249 deletions(-)

diff --git a/scss/main/_a.scss b/scss/main/_a.scss
index 3a38f22..e171860 100644
--- a/scss/main/_a.scss
+++ b/scss/main/_a.scss
@@ -1,19 +1,25 @@
 @use "../top/vars" as *;
 
-.bg_d4b6c5 {
+.bg__960e4 {
     background: $medium;
 }
 
-.content_a4d4d9 {
+.content_c48ade {
     border: $size-border solid $light;
 
-    .sidebar_a4d4d9 + :is(div, main):not(.erd_scroll_detection_container),
-    .sidebar_a4d4d9 + .erd_scroll_detection_container + :is(div, main):not(.erd_scroll_detection_container) {
+    .sidebar_c48ade {
+        //Fix gap on channel list and user area
+        padding: 0px;
+        margin: 10px;
+    }
+
+    .sidebar_c48ade + :is(div, main):not(.erd_scroll_detection_container),
+    .sidebar_c48ade + .erd_scroll_detection_container + :is(div, main):not(.erd_scroll_detection_container) {
         background: unset !important;
         border-left: $size-border solid $light;
 
-        .content_a7d72e,
-        .tabBody_c2739c {
+        .content_f75fb0,
+        .tabBody__133bf {
             padding: 16px;
             gap: 16px;
 
diff --git a/scss/main/_dm.scss b/scss/main/_dm.scss
index 2a2d12d..d286904 100644
--- a/scss/main/_dm.scss
+++ b/scss/main/_dm.scss
@@ -5,55 +5,50 @@
 // DMs
 
 // DM list
-.privateChannels_f0963d {
-    .scroller_c47fa9 {
+.privateChannels__35e86 {
+    .scroller__99e7c {
         background: unset;
 
         // Primary channels
-        .channel_c91bad {
+        .channel__972a0 {
             max-width: unset;
 
             // Friends channel
-            &:has(path[d^="M3 5v-.75"]) .name_f9647d {
+            &:has(path[d^="M3 5v-.75"]) .name__20a53 {
                 @include replace.text("Chums", 16px);
                 height: 20px;
             }
         }
 
         // DM header
-        .headerText_c47fa9 {
+        .headerText__99e7c {
             @include replace.text("Chumroll", 12px);
         }
     }
 }
 
 // Friends header (for other headers see _header.scss)
-.container_e44302 {
+.container__9293f {
     // Friends title
-    &:has(path[d^="M3 5v-.75"]) .title_e44302 {
+    &:has(path[d^="M3 5v-.75"]) .title__9293f {
         @include replace.text("Chums", 16px);
     }
 
     // Friend tabs
-    .item_a0 {
+    .item_b3f026 {
         @include box.highlight;
         color: $black;
 
-        &.themed_a0:hover:not(.disabled_a0),
-        &.themed_a0.selected_a0.item_a0,
-        &.addFriend_c2739c.addFriend_c2739c {
+        &.themed_b3f026:hover:not(.disabled_b3f026),
+        &.themed_b3f026.selected_b3f026.item_b3f026,
+        &.addFriend__133bf.addFriend__133bf {
             background-color: $light;
             color: $black;
         }
     }
 
-    // Blocked tab
-    &:has(path[d^="M3 5v-.75"]) .item_a0:nth-last-child(2) {
-        @include replace.text("Trollslum", 16px);
-    }
-
     // Add friend button
-    .addFriend_c2739c span {
+    .addFriend__133bf span {
         @include replace.text("Add Chum", 16px);
         height: 20px;
     }
@@ -65,37 +60,37 @@
 }
 
 // DM call container
-.wrapper_d880dc.minimum_d880dc {
+.wrapper_cb9592.minimum_cb9592 {
     background: unset;
 
     .quickSelectLabel__79774,
     .quickSelect__540d0,
-    .controlIcon_ef18ee.themeable_ef18ee {
+    .controlIcon_f1ceac.themeable_f1ceac {
         color: $black;
     }
 
     // Square buttons
-    .controlButton_b6e2f9 {
+    .controlButton__1405b {
         @include box.default;
-        .colorable_ef18ee.primaryDark_ef18ee,
-        .colorable_ef18ee.primaryLight_ef18ee {
+        .colorable_f1ceac.primaryDark_f1ceac,
+        .colorable_f1ceac.primaryLight_f1ceac {
             background: unset;
         }
     }
 }
 
 // People
-.peopleColumn_c2739c {
+.peopleColumn__133bf {
     @include box.sync;
 
     // Sad wumpus: Wumpus is waiting on friends. You don't have to, though!
-    .image__08515[style*="bca918618b884a382ab5.svg"] + .flexChild_bba380 .text__0e310 {
+    .image__08515[style*="bca918618b884a382ab5.svg"] + .flexChild__7c0ba .text__0e310 {
         @include replace.text("Wumpus has no chums.", 16px);
     }
 
     // All tab
     &#all-tab {
-        .title_a1cafe {
+        .title__1472a {
             position: relative;
             overflow: visible;
             margin-inline-start: calc(30px - 1.2em);
@@ -111,7 +106,7 @@
 
     // Blocked tab
     &#blocked-tab {
-        .title_a1cafe {
+        .title__1472a {
             position: relative;
             overflow: visible;
             margin-inline-start: calc(30px + 1.2em);
@@ -128,44 +123,44 @@
     // Add friend tab
     &#add_friend-tab {
         // Title: Add friend
-        .title_c96274 {
+        .title__94b08 {
             @include replace.text("Add Chum", 16px);
         }
 
         // Subtitle: You can add friends with their Discord usernames.
-        .description_b89ec7:first-child {
+        .description_ddd181:first-child {
             @include replace.text("You can add chums with their chumhandles.", 14px);
         }
 
         // Input: You can add friends with their Discord usernames.
-        .input_f8bc55::placeholder {
+        .input__0f084::placeholder {
             color: transparent;
         }
 
         // Button: Send Friend Request
-        .button_dd4f85 {
+        .button__201d5 {
             @include box.default;
 
-            .contents_dd4f85 {
+            .contents__201d5 {
                 @include replace.text("Send chum request");
             }
         }
 
         // Title: Other places to make friends
-        .title_aef5fd {
+        .title_a14595 {
             @include replace.text("Other places to make chums", 16px);
         }
     }
 }
 
 // Active now
-.nowPlayingColumn_c2739c {
+.nowPlayingColumn__133bf {
     @include box.sync;
 
-    .container_bf550a {
+    .container__7d20c {
         background: unset;
 
-        .scroller_bf550a {
+        .scroller__7d20c {
             border-left: 0;
             margin-left: 0;
         }
@@ -183,12 +178,12 @@
 }
 
 // Library, Nitro, Shop
-:is(.scroller_ad8f79, .scroller_a8b566) {
+:is(.scroller__4a84a, .scroller_c880e8) {
     @include box.sync;
     margin: 16px;
 
     // Library header
-    .header_f1629a {
+    .header_adb41f {
         background: unset;
     }
 }
diff --git a/scss/main/_forum.scss b/scss/main/_forum.scss
index 6f9fabd..1cbec54 100644
--- a/scss/main/_forum.scss
+++ b/scss/main/_forum.scss
@@ -2,13 +2,13 @@
 @use "../top/box";
 
 // Forum main panel
-.container_a6d69a {
+.container_f369db {
     gap: 16px;
     background: unset;
 
     // Forum
-    .list_a6d69a,
-    .grid_a6d69a {
+    .list_f369db,
+    .grid_f369db {
         @include box.default;
 
         & > div:first-child {
@@ -17,35 +17,35 @@
         }
 
         // Post maker and posts
-        .mainCard_a6d69a {
+        .mainCard_f369db {
             @include box.sync;
 
             // Opened post
-            &.isOpen_a57509 {
+            &.isOpen__9a337 {
                 border-color: $light;
             }
 
             // Pinned post
-            .pinIcon_f451cd {
+            .pinIcon__08166 {
                 background: $dark;
             }
 
             // Gallery mode text
-            .contentPreview_a57509 {
+            .contentPreview__9a337 {
                 background: unset;
                 border: none;
 
-                .textContentFooter_a57509 {
+                .textContentFooter__9a337 {
                     background: linear-gradient(to top, $background, transparent);
                 }
             }
         }
-        .container_d331f1:hover {
+        .container_faa96b:hover {
             transform: none;
         }
 
         // Post maker results
-        .matchingPostsRow_a6d69a {
+        .matchingPostsRow_f369db {
             background: unset;
             --text-normal: #{$black};
 
@@ -57,25 +57,25 @@
         }
 
         // Post guidelines
-        .container_ddbb27 {
+        .container_ca49a1 {
             @include box.sync;
-            .descriptionContainer_ddbb27 {
+            .descriptionContainer_ca49a1 {
                 background: unset;
             }
         }
 
         // Filter by tag
-        .tagsContainer_a6d69a {
+        .tagsContainer_f369db {
             // Divider
-            .divider_a6d69a {
+            .divider_f369db {
                 width: $size-border;
                 background: $dark;
             }
 
             // Sort and view
             // See all tags
-            .sortDropdown_a6d69a,
-            .tagsButton_a6d69a {
+            .sortDropdown_f369db,
+            .tagsButton_f369db {
                 @include box.default;
                 --interactive-normal: #{$black};
 
@@ -83,14 +83,14 @@
                     border-color: $light;
                 }
             }
-            .tagsButton_a6d69a {
+            .tagsButton_f369db {
                 padding: 0;
 
                 // Tag counter
-                .countContainer_a6d69a {
+                .countContainer_f369db {
                     background: unset;
                 }
-                .countText_a6d69a {
+                .countText_f369db {
                     color: $black;
                     font-size: 14px;
                     line-height: 18px;
@@ -101,15 +101,15 @@
 }
 
 // Tags
-.pill_c993da.pill_c993da {
+.pill_a2c9e8.pill_a2c9e8 {
     @include box.default;
     --text-normal: #{$black};
 
-    &.clickable_c993da:not(.disabled_c993da):hover {
+    &.clickable_a2c9e8:not(.disabled_a2c9e8):hover {
         background: $medium;
     }
 
-    &.selected_c993da.selected_c993da {
+    &.selected_a2c9e8.selected_a2c9e8 {
         border-color: $light;
         background: $medium;
     }
@@ -117,57 +117,57 @@
 
 // Unset forum minimum width
 .grid-21dB-S > div:first-child,
-.headerRow_a6d69a,
-.list_a6d69a > div:first-child {
+.headerRow_f369db,
+.list_f369db > div:first-child {
     min-width: unset;
     box-sizing: border-box;
 }
 
 // Forum post info
-.scrollerInner_e2e187 {
+.scrollerInner__36d07 {
     overflow: unset;
-    .container_b385c8 {
+    .container__34c2c {
         background: unset;
         pointer-events: none;
         border-top: 0;
         top: 0;
 
-        .reactButtons_b385c8,
-        .buttons_b385c8 {
+        .reactButtons__34c2c,
+        .buttons__34c2c {
             pointer-events: all;
         }
     }
-    .divider_af45f8 {
+    .divider_ee23ac {
         display: none;
     }
 
     // Post action buttons
-    .addReactButton_b385c8,
-    .buttonInner_b385c8 {
+    .addReactButton__34c2c,
+    .buttonInner__34c2c {
         @include box.default;
         color: $black;
 
-        &.active_f61c73 {
+        &.active_f8896c {
             @include box.highlight;
         }
 
         &:hover,
-        &:active .icon_f61c73,
-        &.active_f61c73 .icon_f61c73,
-        &:hover .icon_f61c73 {
+        &:active .icon_f8896c,
+        &.active_f8896c .icon_f8896c,
+        &:hover .icon_f8896c {
             color: $black;
         }
     }
 
     // Reaction
-    .reaction_f61c73 {
+    .reaction_f8896c {
         @include box.default;
 
-        &.reactionMe_f61c73 {
+        &.reactionMe_f8896c {
             @include box.highlight;
         }
 
-        .reactionCount_f61c73 {
+        .reactionCount_f8896c {
             color: $black;
         }
     }
diff --git a/scss/main/_header.scss b/scss/main/_header.scss
index ea51226..436ba80 100644
--- a/scss/main/_header.scss
+++ b/scss/main/_header.scss
@@ -1,7 +1,7 @@
 @use "../top/vars" as *;
 
 // Header bar
-.container_e44302:is(.title_a7d72e, .themed_e44302) {
+.container__9293f:is(.title_f75fb0, .themed__9293f) {
     background: unset;
 
     // No shadow
@@ -9,33 +9,33 @@
         display: none;
     }
 
-    .children_e44302::after {
+    .children__9293f::after {
         background: linear-gradient(90deg, transparent, var(--message-background-alt));
     }
 
-    .title_e44302,
-    .topic_bf3bbb,
+    .title__9293f,
+    .topic__6ec1a,
     .nicknames__12efb {
         color: $black;
     }
 
-    .divider_e44302 {
+    .divider__9293f {
         display: none;
     }
 
-    .searchBar_a46bef,
-    .searchBar_e0264e {
+    .searchBar__97492,
+    .searchBar__3fb48 {
         background: $background;
     }
 
     // Channel icon
-    .icon_e44302,
-    .clickable_e44302 .icon_e44302,
-    .clickable_e44302:hover .icon_e44302,
-    .selected_e44302 .icon_e44302 {
+    .icon__9293f,
+    .clickable__9293f .icon__9293f,
+    .clickable__9293f:hover .icon__9293f,
+    .selected__9293f .icon__9293f {
         color: $black;
     }
-    .iconWrapper_e44302 path {
+    .iconWrapper__9293f path {
         fill: $black;
     }
 }
diff --git a/scss/main/_memberslist.scss b/scss/main/_memberslist.scss
index 4fa5c4f..487796c 100644
--- a/scss/main/_memberslist.scss
+++ b/scss/main/_memberslist.scss
@@ -2,16 +2,16 @@
 @use "../top/box";
 
 // Members list
-.container_cbd271 {
+.container_c8ffbb {
     background: unset;
 
-    @at-root .members_cbd271 {
+    @at-root .members_c8ffbb {
         @include box.sync;
 
         // Activity
-        @at-root .container_c64476,
+        @at-root .container__0f2e8,
         // Member
-        .member_cbd271 {
+        .member_c8ffbb {
             background: unset;
         }
     }
diff --git a/scss/main/_membersview.scss b/scss/main/_membersview.scss
index 7c0cffb..c6e2f02 100644
--- a/scss/main/_membersview.scss
+++ b/scss/main/_membersview.scss
@@ -2,7 +2,7 @@
 @use "../top/box";
 
 // Specific to members view header
-.header_d20375 {
+.header_c791b2 {
     box-shadow: none;
 
     + .scroller_d20375 {
@@ -11,7 +11,7 @@
         left: 16px;
         width: calc(100% - 28px);
 
-        .content_a7d72e.content_a7d72e.content_a7d72e {
+        .content_f75fb0.content_f75fb0.content_f75fb0 {
             padding: 0;
             @include box.sync;
         }
@@ -19,6 +19,6 @@
 }
 
 // Server members view
-.mainTableContainer_e23072 {
+.mainTableContainer__09a38 {
     background: $background;
 }
diff --git a/scss/main/_messages.scss b/scss/main/_messages.scss
index a1db840..8e51091 100644
--- a/scss/main/_messages.scss
+++ b/scss/main/_messages.scss
@@ -4,7 +4,7 @@
 // Chat
 
 // Header bar (eg. this channel is not on your channel list)
-.chatHeaderBar_efb691 {
+.chatHeaderBar_dc83f5 {
     @include box.highlight($BG-COLOR: $background);
 
     &::after {
@@ -13,55 +13,55 @@
 }
 
 // Chat main panel
-.chatContent_a7d72e {
+.chatContent_f75fb0 {
     gap: 16px;
     background: unset;
 
     // Chat
-    .messagesWrapper_e2e187 {
+    .messagesWrapper__36d07 {
         @include box.sync;
     }
 
     // Bars
-    .newMessagesBar_cf58b5,
-    .jumpToPresentBar_cf58b5 {
+    .newMessagesBar__0f481,
+    .jumpToPresentBar__0f481 {
         background: $dark;
     }
 }
 
 // Message area
-.form_a7d72e {
+.form_f75fb0 {
     padding: 0;
 
     &::before {
         display: none;
     }
 
-    .channelTextArea_a7d72e {
+    .channelTextArea_f75fb0 {
         @include box.sync;
         box-sizing: border-box;
 
-        &.channelTextAreaDisabled_d0696b {
+        &.channelTextAreaDisabled__74017 {
             background: $dark;
         }
 
-        .themedBackground_d0696b {
+        .themedBackground__74017 {
             background: unset;
         }
     }
 
     // Accessories
-    .base_d7ebeb {
+    .base_b88801 {
         color: $black;
         inset: auto 0 0;
 
         // Typing
-        .dots_ce0450.themed_ce0450 {
+        .dots__5ad89.themed__5ad89 {
             color: $black;
         }
 
         // Slow mode
-        .cooldownWrapper_d7ebeb {
+        .cooldownWrapper_b21699 {
             color: $black !important;
         }
     }
diff --git a/scss/main/_messagesspecial.scss b/scss/main/_messagesspecial.scss
index 46ce185..d602329 100644
--- a/scss/main/_messagesspecial.scss
+++ b/scss/main/_messagesspecial.scss
@@ -2,35 +2,35 @@
 @use "../top/box";
 
 // Server guide
-.scrollerBase_c49869:has(.homeContainer_e85cee) {
+.scrollerBase_d125d2:has(.homeContainer__7449f) {
     @include box.default;
     margin: 16px;
 
-    .row_b53f4f,
-    .sidebarCardWrapper_e85cee {
+    .row_d13feb,
+    .sidebarCardWrapper__7449f {
         @include box.sync;
     }
 }
 
 // Channels and roles
-.header_f1fd9c:has(path[d^="M18.5 23"]) + .container_f1fd9c.container_f1fd9c.container_f1fd9c {
+.header__0b563:has(path[d^="M18.5 23"]) + .container__0b563.container__0b563.container__0b563 {
     @include box.default;
     margin: 16px;
     padding: 0;
     gap: 0;
 
     // Background
-    .emptyPage_c6b11b,
+    .emptyPage__5d7c9,
     .scrollerContainer_c6b11b,
     .container_c2efea {
         background: unset;
     }
 
     // Tabs
-    .tabBar_f1fd9c {
+    .tabBar__0b563 {
         border-bottom: 0;
 
-        .tabBarItem_f1fd9c {
+        .tabBarItem__0b563 {
             padding: 2px 8px;
         }
 
@@ -50,23 +50,23 @@
     }
 
     // Choose all that apply
-    .helpText_c6b11b {
+    .helpText__5d7c9 {
         --text-muted: #{$black};
     }
 
     // Customisation question group
-    .prompt_c6b11b {
+    .prompt__5d7c9 {
         border: none;
         background: unset;
 
         // Option
-        .optionButtonWrapper_bd5e1f {
+        .optionButtonWrapper__270d7 {
             @include box.sync;
 
-            &.selected_bd5e1f {
+            &.selected__270d7 {
                 @include box.highlight($background);
 
-                .checkIcon_bd5e1f {
+                .checkIcon__270d7 {
                     background: $light;
 
                     path {
@@ -78,7 +78,7 @@
     }
 
     // Profile preview
-    .profileCard_c6b11b {
+    .profileCard__5d7c9 {
         @include box.sync;
     }
 
@@ -88,69 +88,69 @@
     }
 
     // Channel group header
-    .categoryRow_f04d06 {
+    .categoryRow_e4503a {
         --text-muted: #{$black};
 
-        .checkbox_f6cde8 {
+        .checkbox_f525d3 {
             background: $black !important;
             border: none;
         }
     }
 
     // Channel
-    .channelRow_f04d06 {
+    .channelRow_e4503a {
         @include box.sync;
         border-top-width: 0;
         border-bottom-width: 0;
 
-        &.firstChannel_f04d06 {
+        &.firstChannel_e4503a {
             border-top-width: 4px;
         }
 
-        &.lastChannel_f04d06 {
+        &.lastChannel_e4503a {
             border-bottom-width: 4px;
         }
     }
 
     // Separators
-    .separator_f04d06 {
+    .separator_e4503a {
         display: none;
     }
 }
 
 // Server shop
-.content_cac32e {
+.content__49668 {
     @include box.sync;
     margin: 16px;
     padding: 0;
     padding-right: 0 !important;
 
     // Box for some reason
-    .contentContainer_cac32e {
+    .contentContainer__49668 {
         width: auto;
     }
 
     // Banner
-    .container_e1e1a4 {
+    .container_adb50a {
         background: unset;
         box-shadow: none;
         border: none;
 
-        .coverImageContainer_e1e1a4 {
+        .coverImageContainer_adb50a {
             width: unset;
         }
     }
 
     // Support options
-    .container_ff1414 {
+    .container_d804ff {
         padding: 16px;
 
         // Item
-        .tab_ff1414 {
+        .tab_d804ff {
             @include box.default;
             box-shadow: none;
 
-            &.selected_ff1414 {
+            &.selected_d804ff {
                 @include box.highlight;
                 box-shadow: none;
             }
@@ -162,12 +162,12 @@
         }
     }
 
-    .tabContainer_cac32e {
+    .tabContainer__49668 {
         border-top: 0;
     }
 
     // Perk card
-    .cardContainerWithoutTopIndicator_ecba8f {
+    .cardContainerWithoutTopIndicator__3efc4 {
         @include box.default;
 
         --header-primary: #{$black};
@@ -177,13 +177,13 @@
         --text-muted: #{$black};
         --text-normal: #{$black};
 
-        .tierInfoContainer_ecba8f,
-        .subscriptionPerks_ecba8f {
+        .tierInfoContainer__3efc4,
+        .subscriptionPerks__3efc4 {
             background: unset;
         }
 
         // Preview
-        .roleMessagePreview_ecba8f {
+        .roleMessagePreview__3efc4 {
             @include box.sync;
             --text-normal: #{$foreground};
         }
diff --git a/scss/main/_search.scss b/scss/main/_search.scss
index 504a163..631c82b 100644
--- a/scss/main/_search.scss
+++ b/scss/main/_search.scss
@@ -3,25 +3,25 @@
 @use "../top/sticky";
 
 // Search results
-.searchResultsWrap_c2b47d {
+.searchResultsWrap_a9e706 {
     @include box.highlight;
 
     // Header
-    .searchHeader_b7c924 {
+    .searchHeader_f3b986 {
         background: $medium;
         --header-primary: #{$black};
     }
 
     // Results
-    .scroller_c2b47d {
+    .scroller_a9e706 {
         padding: 0 10px;
         padding-right: 10px - $size-border !important;
     }
 
     // Channel
-    .searchResultGroup_a9e225 {
+    .searchResultGroup_c68065 {
         // Name
-        .channelNameContainer_a9e225 {
+        .channelNameContainer_c68065 {
             // Channel name
             --header-primary: #{$black};
             // Parent channel name
@@ -29,24 +29,24 @@
         }
 
         // Content
-        .searchResult_ddc613 {
+        .searchResult__02a39 {
             @include box.sync;
             @include sticky.box($BOTTOM: 54px);
         }
 
         // Jump button
-        .buttonsContainer_ddc613 {
+        .buttonsContainer__02a39 {
             display: none;
         }
     }
-    &:not(:has(.pageControlContainer_b48941)) {
-        .searchResult_ddc613::after {
+    &:not(:has(.pageControlContainer_c15210)) {
+        .searchResult__02a39::after {
             bottom: 20px;
         }
     }
 
     // Navigation
-    .container_de9d09 {
+    .container__3f123 {
         position: sticky;
         bottom: 0;
         background: $medium;
@@ -58,10 +58,10 @@
         --interactive-hover: #{$black};
 
         // Buttons
-        .pageButton_b48941 {
+        .pageButton_c15210 {
             @include box.default;
 
-            &.activeButton_b48941 {
+            &.activeButton_c15210 {
                 border-color: $light;
                 color: $black;
             }
diff --git a/scss/main/_serverslist.scss b/scss/main/_serverslist.scss
index 7485019..721a068 100644
--- a/scss/main/_serverslist.scss
+++ b/scss/main/_serverslist.scss
@@ -1,41 +1,46 @@
 @use "../top/vars" as *;
 
 // Servers list
-.wrapper_fea3ef {
+.wrapper_ef3116 {
     background: unset;
 
     // Home and favourite icons
-    @at-root .wrapper_f90abb {
+    @at-root .wrapper__6e9f8 {
         &:is(&, :hover) {
-            .childWrapper_f90abb {
+            .childWrapper__6e9f8:not(.tutorialContainer__1f388 .childWrapper__6e9f8) {
                 background: $background;
                 color: $light;
             }
-        }
 
-        // Home icon
-        .tutorialContainer_f9623d.tutorialContainer_f9623d .childWrapper_f90abb {
-            background: url("https://minidiscordthemes.github.io/Pesterchum/img/home.avif") center/80% no-repeat $background;
-            color: transparent;
+            //Home icon
+            .childWrapper__6e9f8 {
+                background: url("https://minidiscordthemes.github.io/Pesterchum/img/home.avif") center/80% no-repeat $background;
+                color: transparent;
+            }
         }
     }
 
     // New and discover icons
-    .circleIconButton_db6521 {
+    .circleIconButton__5bc7e {
         color: $light;
     }
 
+    //Discover icon background fix
+    .footer__214dc {
+        background: unset;
+    }
+
     // Icon backgrounds
     .childWrapper_a6ce15,
     .wrapper__8436d:hover .childWrapper_a6ce15,
     .wrapper__8436d.selected_ae80f7 .childWrapper_a6ce15,
-    .circleIconButton_db6521 {
+    .circleIconButton__5bc7e {
         background-color: $background;
     }
 
     // Folders
-    .expandedFolderBackground_bc7085,
-    .folder_bc7085 {
+    .expandedFolderBackground__48112,
+    .folder__48112 {
         background: $background;
     }
 }
diff --git a/scss/main/_split.scss b/scss/main/_split.scss
index e7f6de0..e1edaaf 100644
--- a/scss/main/_split.scss
+++ b/scss/main/_split.scss
@@ -1,13 +1,13 @@
 @use "../top/vars" as *;
 
 // Thread split view
-.chatTarget_d1c246,
-.container_d1c246 {
+.chatTarget__01ae2,
+.container__01ae2 {
     background: $medium;
 }
 
-.chat_f57fdc,
-.chat_d6c7e0 {
+.chat_f02135,
+.chat_a44415 {
     padding: 16px;
 
     &::before {
@@ -16,13 +16,13 @@
 }
 
 // Floating thread view
-.floating_d1c246 {
+.floating__01ae2 {
     filter: none;
     border-left: $size-border solid $light;
 }
 
 // Resize thread handle
-.resizeHandle_d1c246 {
+.resizeHandle__01ae2 {
     width: $size-border * 1.5;
     background: $light;
 }
diff --git a/scss/main/_titlebar.scss b/scss/main/_titlebar.scss
index 4a453c6..12afde7 100644
--- a/scss/main/_titlebar.scss
+++ b/scss/main/_titlebar.scss
@@ -3,7 +3,7 @@
 // Titlebar
 
 // Logo
-.wordmark_a934d8 {
+.wordmark__421ed {
     visibility: hidden;
     padding: 0;
 
@@ -18,6 +18,6 @@
 }
 
 // Windows buttons
-.winButton_a934d8 {
+.winButton__421ed {
     color: $white;
 }
diff --git a/scss/main/channels/_a.scss b/scss/main/channels/_a.scss
index 184cee8..89169dd 100644
--- a/scss/main/channels/_a.scss
+++ b/scss/main/channels/_a.scss
@@ -2,7 +2,7 @@
 @use "../../top/box";
 
 // Channels
-.sidebar_a4d4d9 {
+.sidebar_c48ade {
     background: unset;
     padding: 10px;
     gap: 10px;
@@ -19,9 +19,9 @@
     }
 
     // Actual channels and userarea
-    .container_ee69e0,
-    .privateChannels_f0963d,
-    .panels_a4d4d9 {
+    .container__2637a,
+    .privateChannels__35e86,
+    .panels_c48ade {
         @include box.highlight($background);
     }
 }
diff --git a/scss/main/channels/_channellist.scss b/scss/main/channels/_channellist.scss
index 3dd6019..a70719b 100644
--- a/scss/main/channels/_channellist.scss
+++ b/scss/main/channels/_channellist.scss
@@ -8,34 +8,34 @@
 }
 
 // Server channels list
-.sidebar_a4d4d9 {
+.sidebar_c48ade {
     // Voice users collapsed
-    .overlap_cdc675 .avatar_cdc675,
-    .moreContainer_ac3629 {
+    .overlap__07f91 .avatar__07f91,
+    .moreContainer__55bab {
         @include box.black;
         border-radius: $size-max;
     }
 
     // Unread bars
-    .bar_eba0ba {
+    .bar__7aaec {
         @include box.black;
         border-radius: $size-max;
     }
 
     // Voice user limit
-    .wrapper_a5bc92 {
-        .users_a5bc92,
-        .total_a5bc92 {
+    .wrapper__260e1 {
+        .users__260e1,
+        .total__260e1 {
             background: unset;
         }
-        .total_a5bc92:after {
+        .total__260e1:after {
             content: "/";
             border: 0;
         }
     }
 
     // Show all voice channels
-    .voiceChannelsButton_a08117:hover {
+    .voiceChannelsButton__29444:hover {
         background: unset;
     }
 }
diff --git a/scss/main/channels/_userpanel.scss b/scss/main/channels/_userpanel.scss
index 63c8779..40c057a 100644
--- a/scss/main/channels/_userpanel.scss
+++ b/scss/main/channels/_userpanel.scss
@@ -1,32 +1,32 @@
 @use "../../top/vars" as *;
 @use "../../top/box";
 
-.panels_a4d4d9 {
-    .panel_bf1a22,
-    .container_adcaac,
-    .container_b2ca13,
-    .wrapper_c721cc {
+.panels_c48ade {
+    .panel__5dec7,
+    .container_e131a9,
+    .container__37e49,
+    .wrapper__0d616 {
         background: unset;
     }
 
     // Quest progress
-    .contentWrapper_c721cc,
+    .contentWrapper__0d616,
     .postEnrollmentBackground_c3427e {
         background: $background !important;
     }
 
     // Now playing
-    .panel_bf1a22 {
+    .panel__5dec7 {
         border-bottom: 0;
     }
 
     // Voice controls
-    .container_adcaac {
+    .container_e131a9 {
         border-bottom: 0;
 
         // Activity buttons
-        .actionButtons_adcaac {
-            .button_adcaac:not(.disabledButtonWrapper_dd4f85) {
+        .actionButtons_e131a9 {
+            .button_e131a9:not(.disabledButtonWrapper__201d5) {
                 @include box.default;
                 height: 36px;
                 color: $background;
@@ -34,10 +34,10 @@
             }
 
             // Disabled button
-            .disabledButtonWrapper_dd4f85 {
+            .disabledButtonWrapper__201d5 {
                 height: 36px;
 
-                .contents_dd4f85 {
+                .contents__201d5 {
                     display: flex;
                     align-items: center;
                 }
@@ -46,10 +46,10 @@
     }
 
     // User controls
-    .container_b2ca13 {
+    .container__37e49 {
         margin-bottom: 0;
 
-        .avatarWrapper_b2ca13 {
+        .avatarWrapper__37e49 {
             margin: 0;
             padding-left: 0;
         }
diff --git a/scss/overlay/_settings.scss b/scss/overlay/_settings.scss
index fc1c700..510fefb 100644
--- a/scss/overlay/_settings.scss
+++ b/scss/overlay/_settings.scss
@@ -3,16 +3,18 @@
 @use "../top/sticky";
 
 // Any layer
-.layer_d4b6c5 {
+.layer__960e4 {
     opacity: 1 !important;
 
     // Settings layer
-    + .layer_d4b6c5 {
+    + .layer__960e4 {
         background: unset;
         backdrop-filter: blur(2px) brightness(0.7);
         align-items: center;
+        //Stop any elements from other layers from showing through
+        z-index: 100;
 
-        div:has(> .standardSidebarView_c25c6d) {
+        div:has(> .standardSidebarView__23e6b) {
             display: flex;
             justify-content: center;
             width: 100%;
@@ -21,7 +23,7 @@
 }
 
 // Settings modal
-.standardSidebarView_c25c6d {
+.standardSidebarView__23e6b {
     @include box.highlight;
     padding: 10px;
     left: unset;
@@ -33,22 +35,22 @@
         top: 22px + 20px;
     }
 
-    .sidebarRegion_c25c6d {
+    .sidebarRegion__23e6b {
         flex: 0 0 var(--custom-standard-sidebar-view-sidebar-total-width);
     }
-    .sidebarRegionScroller_c25c6d {
+    .sidebarRegionScroller__23e6b {
         background: $medium;
     }
-    .sidebar_c25c6d {
+    .sidebar__23e6b {
         padding: 0 6px 0 0;
 
         // Item
-        :is(.item_a0.item_a0.item_a0, .item_a0.item_a0.item_a0:hover) {
+        :is(.item_b3f026.item_b3f026.item_b3f026, .item_b3f026.item_b3f026.item_b3f026:hover) {
             @include sticky.box;
             padding: 0;
 
-            &.selected_a0::before,
-            &.selected_a0::after {
+            &.selected_b3f026::before,
+            &.selected_b3f026::after {
                 background: $light;
             }
 
@@ -61,19 +63,19 @@
         }
 
         // Separator
-        .separator_a0 {
+        .separator_b3f026 {
             background: unset;
         }
 
         // Group header
-        .header_a0,
+        .header_b3f026,
         // Socials
-        .link_c44e94 {
+        .link__7df54 {
             color: $black;
         }
 
         // Group header category
-        .headerText_a0 {
+        .headerText_b3f026 {
             display: flex;
 
             .category-CysNYv {
@@ -87,12 +89,12 @@
         }
 
         // Version info
-        .info_c5a741 .line_c5a741 {
+        .info__2debe .line__2debe {
             color: $black !important;
         }
     }
 
-    .contentRegionScroller_c25c6d {
+    .contentRegionScroller__23e6b {
         @include box.sync;
     }
 }
diff --git a/scss/overlay/_userprofile.scss b/scss/overlay/_userprofile.scss
index e08705c..9628313 100644
--- a/scss/overlay/_userprofile.scss
+++ b/scss/overlay/_userprofile.scss
@@ -20,7 +20,7 @@
     }
 
     // Icon
-    .avatar_c51b4e {
+    .avatar__44b0c {
         background: $dark;
     }
 
@@ -44,12 +44,12 @@
 
             // Send friend request
             // Send message
-            .contents_dd4f85 {
+            .contents__201d5 {
                 @include replace.text("Pester");
             }
 
             // Friend request sent
-            &:disabled .contents_dd4f85 {
+            &:disabled .contents__201d5 {
                 @include replace.text("Chum request sent");
             }
         }
@@ -83,13 +83,13 @@
         .tabBar_b9fccc {
             gap: 10px;
 
-            .item_a0 {
+            .item_b3f026 {
                 @include box.highlight;
                 color: $black;
                 padding: 8px;
                 box-sizing: border-box;
 
-                &.selected_a0,
+                &.selected_b3f026,
                 &:hover {
                     border-bottom-color: $dark;
                 }
@@ -126,25 +126,25 @@
 
     // Activity
     .activity__20c1e {
-        .headerText_d5089b {
+        .headerText__2ef49 {
             color: $grey;
         }
-        .activityName_d5089b,
-        .content_d5089b,
-        .details_d5089b,
-        .name_d5089b,
-        .nameNormal_d5089b,
-        .nameWrap_d5089b {
+        .activityName__2ef49,
+        .content__2ef49,
+        .details__2ef49,
+        .name__2ef49,
+        .nameNormal__2ef49,
+        .nameWrap__2ef49 {
             color: $black;
         }
     }
 
     // Roles
-    .role_f9575e {
+    .role_dfa8b6 {
         @include box.sync;
         box-sizing: content-box;
         padding: 0;
-        .roleNameOverflow_e4010c {
+        .roleNameOverflow__48c1c {
             color: $foreground;
         }
     }
@@ -167,14 +167,14 @@
     }
 
     // Connected accounts
-    .connectedAccountContainer_f3eb60 {
+    .connectedAccountContainer_e6abe8 {
         @include box.sync;
     }
 
     // Server or friend
-    .listRow_e4be58 {
-        .listName_e4be58,
-        .guildNick_b26403 {
+    .listRow__9d78f {
+        .listName__9d78f,
+        .guildNick_aafe31 {
             color: $grey;
         }
     }
diff --git a/scss/part/_loading.scss b/scss/part/_loading.scss
index 26346d6..113eb4e 100644
--- a/scss/part/_loading.scss
+++ b/scss/part/_loading.scss
@@ -1,16 +1,16 @@
 @use "../top/vars" as *;
 
 // Loading messages
-.wrapper_cdfd51 {
+.wrapper_d852db {
     background: unset;
 
     // Message
-    .wrapper_b211c6 {
+    .wrapper_fc8177 {
         background: unset;
 
-        .attachment_b211c6,
-        .avatar_b211c6,
-        .blob_b211c6 {
+        .attachment_fc8177,
+        .avatar_fc8177,
+        .blob_fc8177 {
             background: $dark;
             opacity: 0.2 !important;
         }
@@ -18,7 +18,7 @@
 }
 
 // Loading forum posts
-.loadingCard_a6d69a {
+.loadingCard_f369db {
     background: $dark;
     opacity: 0.2 !important;
 }
diff --git a/scss/part/_scrollbar.scss b/scss/part/_scrollbar.scss
index b318ce7..8a3cd46 100644
--- a/scss/part/_scrollbar.scss
+++ b/scss/part/_scrollbar.scss
@@ -3,8 +3,8 @@
 // Scrollbars
 
 // Thick scrollbar
-.auto_c49869,
-.auto_eed6a8 {
+.auto_d125d2,
+.auto__99f8c {
     &::-webkit-scrollbar {
         width: $size-border * 2;
         height: $size-border * 2;
@@ -20,13 +20,13 @@
     }
 }
 
-.scroller_e2e187::-webkit-scrollbar-track {
+.scroller__36d07::-webkit-scrollbar-track {
     margin-bottom: 0;
 }
 
 // Thin scrollbar
-.thin_eed6a8,
-.thin_c49869 {
+.thin__99f8c,
+.thin_d125d2 {
     &::-webkit-scrollbar {
         width: $size-border;
         height: $size-border;
diff --git a/scss/part/_tabs.scss b/scss/part/_tabs.scss
index 24144f1..b811000 100644
--- a/scss/part/_tabs.scss
+++ b/scss/part/_tabs.scss
@@ -3,15 +3,17 @@
 
 // Tabs
 
-.item_a0.item_a0.item_a0.item_a0 {
+.item_b3f026.item_b3f026.item_b3f026.item_b3f026 {
     &,
     &:hover {
         @include box.default;
         background: $medium;
         color: $black;
+        padding: 0 5px;
     }
-    &.selected_a0 {
+    &.selected_b3f026 {
         border-color: $light;
         background: $medium;
+        padding: 0 5px;
     }
 }