change custom app tab styles

CHANGELOG.md

@@ -5,4 +5,5 @@ Fixed:
 - Custom search input not being focussed after clicking
 
 Improved:
-- Add `embedWidgetGenerator` modals to custom modal styles. (Things like the [spicetify-marketplace](https://github.com/CharlieS1103/spicetify-marketplace) options)
+- Add `embedWidgetGenerator` modals to custom modal styles. (Things like the [spicetify-marketplace](https://github.com/CharlieS1103/spicetify-marketplace) options)
+- Changed custom app tab styles to fit in with the theme

src/styles/CustomAppTabBar.scss

@@ -0,0 +1,32 @@
+.main-topBar-topbarContent {
+    height: 100%;
+
+    & > nav[class*="-tabBar"][class*="-tabBar-nav"] {
+        height: 100%;
+
+        & > ul {
+            display: flex;
+            gap: 8px;
+            height: 100%;
+
+            li[class*="-tabBar-headerItem"] {
+                height: 100%;
+
+                & > a {
+                    display: flex;
+                    align-items: center;
+                    justify-content: center;
+                    margin: 0px;
+                    height: 100%;
+                    padding: 0px 8px;
+                    border-radius: var(--sidebar-icons-border-radius);
+
+                    & > span {
+                        line-height: 13px;
+                        @include spiceFont("glue", 14px, "Medium");
+                    }
+                }
+            }
+        }
+    }
+}

src/styles/main.scss

@@ -11,6 +11,7 @@
 @import "Modals";
 @import "ConnectDeviceList";
 @import "Icons";
+@import "CustomAppTabBar";
 
 :root {
     --bar-height: 70px;
@@ -800,6 +801,10 @@ li.GlueDropTarget {
     gap: 8px;
     max-width: unset;
     padding: 16px 32px !important;
+
+    & > * {
+        height: 100%;
+    }
 }
 
 /** Custom elements */
@@ -1268,13 +1273,14 @@ html.right-expanded-cover.buddyfeed-visible .main-coverSlotExpanded-container {
     }
 }
 
-// Fix lyrics-plus having a scrollbar when top-bar is `solid` or `transparent`
-.lyrics-lyricsContainer-LyricsContainer {
-    height: 100% !important;
-}
+// Fix main-view-containers having a scrollbar when top-bar is `solid` or `transparent`
 .main-view-container__scroll-node-child {
     height: 100%;
     padding-bottom: 0px;
+
+    & > * {
+        height: 100% !important;
+    }
 }
 
 // Hide default Spotify "Offline" notice