Merge pull request #18 from Toff-kun/master

More Alignments and Tweaks

SpotifyWPW/WebPlayer/Style/Components/_DarkMode.scss

@@ -9,6 +9,13 @@
 		background: black !important;
 	}
 
+	// Padded background
+	.Root__main-view .main-view-container {
+		.main-view-container__scroll-node {
+			background: black;
+		}
+	}
+
     // Remaining background
     > div {
         background-color: black;

SpotifyWPW/WebPlayer/Style/Components/_Page.scss

@@ -13,20 +13,29 @@
 
 	.main-view-container {
 		z-index: 0; // Prevent NowPlaying View from creating garbage on mobile after minimizing
-		._11pfm-p6kRU6CrLDyLhi3a {
-			margin-top: $statusBarHeight; // Move Home and Library content below the Status Bar
+		.main-view-container__scroll-node {
+			padding-bottom: 108px; // Raise bottom content hidden behind controls
+			._11pfm-p6kRU6CrLDyLhi3a {
+				margin-top: $statusBarHeight; // Move Home and Library content below the Status Bar
+			}
+
+			// Hide the infinite loading circle
+			._3UiTf7sJvnMMlRcSCZre-V {
+				display: none;
+			}
 		}
 	}
 
 	// Podcast episode description page
 	._2gwrTZfYN8-9w_lJJQs6-J {
-		padding: 40px 24px;
-		padding-bottom: 150px;
+		padding: 40px 0;
+	//	padding-bottom: 150px;
 
 		// Header (art, play button and descriptions)
 		._1EhXu-6E7989P5tH_gJXI_ {
 			display: flex;
 			flex-direction: column;
+			padding: 0 24px;
 
 			& > img {
 				max-width: 300px;
@@ -40,10 +49,39 @@
 
 				// For some reason this button does not use the standard button style
 				button {
-					font-size: 12px;
+				//	font-size: 12px;
 					line-height: 18px;
 					padding: 11px 44px;
-					font-weight: 700;
+					font-weight: var(--glue-font-weight-black);
+					min-width: 130px;
+				}
+			}
+
+			// Center episode title 1
+			h1 {
+				text-align: center;
+				font-size: 28px;
+				font-weight: var(--glue-font-weight-black);
+				margin: 0;
+			}
+
+			// Center episode date and duration
+			._3Eww95sj_r_sRJXqgFcjxU {
+				display: flex;
+				flex-direction: column;
+				align-items: center;
+				margin-top: 8px;
+
+				// Center episode title 2
+				h2 {
+					text-align: center;
+					font-size: 15px;
+				}
+
+				// Fix for missing font glyphs
+				._2mShaXz92UAVInSvwS9FAh {
+					font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+					font-weight: var(--glue-font-weight-normal);
 				}
 			}
 
@@ -53,6 +91,11 @@
 				._1EpCyCQkO1mWZNW-ZQ-6l- {
 					height: auto !important;
 					mask-image: none !important;
+
+                    // Description font
+                    ._5HLGmANFIK7to55ZbGSL4 {
+                        font-weight: var(--glue-font-weight-normal);
+                    }
 				}
 
 				// "Read more" button
@@ -61,6 +104,34 @@
 				}
 			}
 		}
+
+		// Fix for missing font glyphs in You May Also Like section
+		._1-e6DtaKMuZeuD7QAoow-K {
+			font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+		}
+
+		// Remove unneeded padding for You May Also Like section
+		._2pQl2ltKQQEKBX18Us_RJf {
+			padding-top: 0;
+
+			// You May Also Like text
+			h2 {
+				font-size: 22px;
+				text-align: center;
+			}
+
+			// Convert You May Also Like section into horizontal scrolling
+			._2Sf-9i8rxxP0vzBjZ-XUpC {
+				display: flex;
+				overflow-x: scroll;
+				flex-wrap: nowrap;
+
+				// Remove background for You May Also Like thumbnails
+				._1Auz6MhtRs4C27k356s5a4 {
+					background: none;
+				}
+			}
+		}
 	}
 
 	.contentSpacing {
@@ -90,7 +161,7 @@
 	h1 {
 		font-size: 18px;
 		line-height: normal;
-		margin: 8px 0;
+		margin: 20px 0; // Move Play Queue text under the status bar
 	}
 
 	// Remove play/pause button from album pictures
@@ -190,3 +261,12 @@
 		display: none;
 	}
 }
+
+// Raise bottom content above the ad banner when it is visible
+.Root__main-view--has-ads {
+    .main-view-container {
+        .main-view-container__scroll-node {
+            padding-bottom: 160px;
+        }
+    }
+}

SpotifyWPW/WebPlayer/Style/Components/_SearchPage.scss

@@ -49,6 +49,11 @@
 
 		ul {
 			text-align: left;
+
+			// Restore Search result spacing
+			h1 {
+				margin: 0;
+			}
 		}
 	}
 

SpotifyWPW/WebPlayer/Style/Components/_TrackList.scss

@@ -198,9 +198,4 @@
 			}
 		}
 	}
-}
-
-// Copyrights (raise them above the controls)
-.copyrights {
-    padding-bottom: 70px;
 }

SpotifyWPW/WebPlayer/Style/Player.scss

@@ -42,18 +42,18 @@ html, body {
 }
 
 .AdsContainer {
-    width: auto;
+	width: 100%;
     height: 52px;
     bottom: 100px;
-    padding: 0 1px 0 0; // Fills 1px gap between the banner and the right edge on mobile
+	padding: 0;
     position: -ms-device-fixed; // Prevent rubber scrolling
 
     &__inner {
         margin: 0 auto;
 
         iframe {
             transform: scale(0.565); // More precise banner width
-            transform-origin: top left;
+			transform-origin: top center;
         }
     }
 }
@@ -74,6 +74,8 @@ html, body {
 
 // Green playlist play/pause button
 .btn{
+	font-weight: var(--glue-font-weight-black);
+
 	&.green:focus, &.green:hover{
 		background-color: #1db954 !important;
 	}

SpotifyWPW/WebPlayer/script.js

@@ -62,7 +62,7 @@ const DARK_MODE = "amoledDarkMode";
 		}
 
 		// Show settings button on the library view
-		if (document.location.pathname.indexOf("/collection/") >= 0) {
+		if (document.location.pathname.indexOf("/collection/") >= 0 || document.location.pathname.indexOf("/made-for-you") >= 0) {
 			document.body.classList.add(SHOW_SETTINGS_BUTTON);
 		} else {
 			document.body.classList.remove(SHOW_SETTINGS_BUTTON);