Fixed Discord profile customization

Gibbu · Gibbu · commit 8beab03ea50d · 2022-10-27T10:45:29.000+11:00
diff --git a/src/core/_root.scss b/src/core/_root.scss
@@ -61,7 +61,7 @@
 	 */
 	--window-padding: 20px; /* Spacing around the Discord window | DEFAULT: 20px */
 	--window-roundness: 10px; /* Roundness of Discord | DEFAULT: 10px */
-	--scrollbar-colour: rgba(255, 255, 255, 0.05); /* DEFAULT: rgba(255,255,255,0.05) */
+	--scrollbar-colour: rgb(255, 255, 255, 0.05); /* DEFAULT: rgb(255,255,255,0.05) */
 	--link-colour: #00b0f4; /* DEFAULT: #00b0f4 */
 
 	/*
diff --git a/src/theme/_vars.scss b/src/theme/_vars.scss
@@ -1,20 +1,20 @@
 :root {
 	// Frosted Glass variables
-	--version: 'Frosted Glass 2.0.14';
+	--version: 'Frosted Glass 2.0.15';
 
 	--TB-top: calc(var(--server-container) + var(--window-padding));
 	--TB-tr-roundness: var(--window-roundness);
 	--TB-position-top: var(--TB-top, var(--window-padding));
 	--TB-position-right: var(--window-padding);
-	--tint: rgba(var(--tint-colour), var(--tint-brightness));
-	--white-half: rgba(255, 255, 255, 0.025);
-	--white: rgba(255, 255, 255, 0.05);
-	--white-double: rgba(255, 255, 255, 0.1);
-	--white-triple: rgba(255, 255, 255, 0.15);
+	--tint: rgb(var(--tint-colour), var(--tint-brightness));
+	--white-half: rgb(255, 255, 255, 0.025);
+	--white: rgb(255, 255, 255, 0.05);
+	--white-double: rgb(255, 255, 255, 0.1);
+	--white-triple: rgb(255, 255, 255, 0.15);
 	--gradient: linear-gradient(var(--gradient-direction), rgb(var(--gradient-primary)), rgb(var(--gradient-secondary)));
-	--gradient-20: linear-gradient(var(--gradient-direction), rgba(var(--gradient-primary), 0.2), rgba(var(--gradient-secondary), 0.2));
-	--gradient-50: linear-gradient(var(--gradient-direction), rgba(var(--gradient-primary), 0.5), rgba(var(--gradient-secondary), 0.5));
-	--gradient-90: linear-gradient(var(--gradient-direction), rgba(var(--gradient-primary), 0.9), rgba(var(--gradient-secondary), 0.9));
+	--gradient-20: linear-gradient(var(--gradient-direction), rgb(var(--gradient-primary), 0.2), rgb(var(--gradient-secondary), 0.2));
+	--gradient-50: linear-gradient(var(--gradient-direction), rgb(var(--gradient-primary), 0.5), rgb(var(--gradient-secondary), 0.5));
+	--gradient-90: linear-gradient(var(--gradient-direction), rgb(var(--gradient-primary), 0.9), rgb(var(--gradient-secondary), 0.9));
 	--text-shadow: 1;
 	--chat-embed: var(--background-secondary);
 
@@ -50,36 +50,36 @@
 	--interactive-active: #fff;
 	--interactive-muted: #777;
 	--background-primary: transparent;
-	--background-secondary: rgba(0, 0, 0, 0.3);
+	--background-secondary: rgb(0, 0, 0, 0.3);
 	--background-secondary-alt: transparent;
 	--background-tertiary: transparent;
 	--background-accent: #4f545c;
 	--background-floating: transparent;
 	--background-mobile-primary: #36393f;
 	--background-mobile-secondary: #2f3136;
-	--background-modifier-hover: rgba(255, 255, 255, 0.05);
-	--background-modifier-active: rgba(255, 255, 255, 0.07);
-	--background-modifier-selected: rgba(255, 255, 255, 0.1);
-	--background-modifier-accent: rgba(255, 255, 255, 0.1);
-	--background-mentioned: rgba(250, 166, 26, 0.05);
-	--background-mentioned-hover: rgba(250, 166, 26, 0.08);
-	--background-message-hover: rgba(4, 4, 5, 0.07);
-	--elevation-stroke: 0 0 0 1px rgba(4, 4, 5, 0.15);
-	--elevation-low: 0 1px 0 rgba(4, 4, 5, 0.2), 0 1.5px 0 rgba(6, 6, 7, 0.05), 0 2px 0 rgba(4, 4, 5, 0.05);
-	--elevation-medium: 0 4px 4px rgba(0, 0, 0, 0.16);
-	--elevation-high: 0 8px 16px rgba(0, 0, 0, 0.24);
+	--background-modifier-hover: rgb(255, 255, 255, 0.05);
+	--background-modifier-active: rgb(255, 255, 255, 0.07);
+	--background-modifier-selected: rgb(255, 255, 255, 0.1);
+	--background-modifier-accent: rgb(255, 255, 255, 0.1);
+	--background-mentioned: rgb(250, 166, 26, 0.05);
+	--background-mentioned-hover: rgb(250, 166, 26, 0.08);
+	--background-message-hover: rgb(4, 4, 5, 0.07);
+	--elevation-stroke: 0 0 0 1px rgb(4, 4, 5, 0.15);
+	--elevation-low: 0 1px 0 rgb(4, 4, 5, 0.2), 0 1.5px 0 rgb(6, 6, 7, 0.05), 0 2px 0 rgb(4, 4, 5, 0.05);
+	--elevation-medium: 0 4px 4px rgb(0, 0, 0, 0.16);
+	--elevation-high: 0 8px 16px rgb(0, 0, 0, 0.24);
 	--logo-primary: #fff;
-	--guild-header-text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
-	--channeltextarea-background: rgba(255, 255, 255, 0.05);
+	--guild-header-text-shadow: 0 1px 1px rgb(0, 0, 0, 0.4);
+	--channeltextarea-background: rgb(255, 255, 255, 0.05);
 	--activity-card-background: #202225;
 	--textbox-markdown-syntax: #8e9297;
-	--deprecated-card-bg: rgba(0, 0, 0, 0.3);
-	--deprecated-card-editable-bg: rgba(0, 0, 0, 0.3);
+	--deprecated-card-bg: rgb(0, 0, 0, 0.3);
+	--deprecated-card-editable-bg: rgb(0, 0, 0, 0.3);
 	--deprecated-store-bg: #36393f;
 	--deprecated-quickswitcher-input-background: var(--channeltextarea-background);
-	--deprecated-quickswitcher-input-placeholder: rgba(255, 255, 255, 0.5);
-	--deprecated-text-input-bg: rgba(0, 0, 0, 0.1);
-	--deprecated-text-input-border: rgba(0, 0, 0, 0.3);
+	--deprecated-quickswitcher-input-placeholder: rgb(255, 255, 255, 0.5);
+	--deprecated-text-input-bg: rgb(0, 0, 0, 0.1);
+	--deprecated-text-input-border: rgb(0, 0, 0, 0.3);
 	--deprecated-text-input-border-hover: #040405;
 	--deprecated-text-input-border-disabled: #202225;
 	--deprecated-text-input-prefix: #dcddde;
diff --git a/src/theme/app/_app.scss b/src/theme/app/_app.scss
@@ -14,7 +14,7 @@
 		position: absolute;
 		height: 5px;
 		width: 100%;
-		background: linear-gradient(rgba(0, 0, 0, 0.2), transparent);
+		background: linear-gradient(rgb(0, 0, 0, 0.2), transparent);
 		z-index: 1;
 		top: 48px;
 		pointer-events: none;
@@ -50,5 +50,5 @@
 	padding: 10px 0;
 	box-sizing: border-box;
 	background: rgb(var(--discord-blurple), 0.7);
-	text-shadow: 0 2px 3px rgba(0, 0, 0, var(--text-shadow));
+	text-shadow: 0 2px 3px rgb(0, 0, 0, var(--text-shadow));
 }
diff --git a/src/theme/app/_background.scss b/src/theme/app/_background.scss
@@ -37,7 +37,7 @@
 	.modalRoot-1Kx4Hb,
 	.container-3JTnYm.thin-1ybCId.scrollerBase-_bVAAt,
 	.popoutContainer-2wbmiM,
-	.root-1gCeng:not(.modal-3Crloo),
+	.userProfileModalOuter-1FYL8T,
 	.container-2O1UgZ,
 	.container-18GwIk,
 	.popout-TdhJ6Z {
@@ -51,7 +51,7 @@
 			background-size: var(--fb-popout-modal-size, cover);
 			background-attachment: var(--popout-modal-attachment, fixed);
 			background-repeat: var(--popout-modal-repeat, no-repeat);
-			box-shadow: inset 0 0 0 100vmax rgba(0, 0, 0, var(--overlay-brightness, var(--popout-modal-brightness)));
+			box-shadow: inset 0 0 0 100vmax rgb(0, 0, 0, var(--overlay-brightness, var(--popout-modal-brightness)));
 			height: calc(100% + var(--fb-popout-modal-blur) * 5);
 			width: calc(100% + var(--fb-popout-modal-blur) * 5);
 			top: calc(var(--fb-popout-modal-blur) / -1 * 2.5);
diff --git a/src/theme/app/_inputs.scss b/src/theme/app/_inputs.scss
@@ -18,7 +18,7 @@
 	}
 	.actionRed-gYn8D3,
 	.colorRed-1TFJan {
-		background: rgba(var(--discord-red), 0.5);
+		background: rgb(var(--discord-red), 0.5);
 		border: none;
 		color: #fff;
 		transition: 0.2s ease;
@@ -28,7 +28,7 @@
 		}
 	}
 	.lookFilled-1Gx00P.colorGreen-29iAKY {
-		background: rgba(var(--discord-green), 0.4);
+		background: rgb(var(--discord-green), 0.4);
 		transition: 0.2s ease;
 		&:active,
 		&:hover {
@@ -53,7 +53,7 @@
 		opacity: 1;
 	}
 	.lookOutlined-3sRXeN.colorBrand-3pXr91 {
-		background: rgba(var(--discord-blurple), 0.3);
+		background: rgb(var(--discord-blurple), 0.3);
 		border: transparent;
 		transition: 0.2s ease;
 		color: #fff;
@@ -69,11 +69,11 @@
 		border-color: transparent;
 		color: var(--text-normal);
 		&::placeholder {
-			color: rgba(255, 255, 255, 0.5);
+			color: rgb(255, 255, 255, 0.5);
 		}
 	}
 	.bd-search::placeholder {
-		color: rgba(255, 255, 255, 0.5);
+		color: rgb(255, 255, 255, 0.5);
 	}
 	// Radio buttons
 	.item-26Dhrx {
@@ -132,7 +132,7 @@
 		border-color: transparent;
 	}
 	[class*='css'][class*='placeholder'] {
-		color: rgba(255, 255, 255, 0.5);
+		color: rgb(255, 255, 255, 0.5);
 		opacity: 1;
 	}
 	// Range
diff --git a/src/theme/app/_notices.scss b/src/theme/app/_notices.scss
@@ -26,6 +26,6 @@
 		height: 48px;
 	}
 	.noticeStreamerMode-2TSQpg {
-		background: rgba(var(--discord-twitch), 0.6);
+		background: rgb(var(--discord-twitch), 0.6);
 	}
 }
diff --git a/src/theme/chat/_call.scss b/src/theme/chat/_call.scss
@@ -9,7 +9,7 @@
 		}
 	}
 	.controlButton-2PMNom.leaveButton-2YnTyt {
-		background: rgba(var(--discord-red), 0.5);
+		background: rgb(var(--discord-red), 0.5);
 		&:hover {
 			background: rgb(var(--discord-red));
 		}
diff --git a/src/theme/chat/_container.scss b/src/theme/chat/_container.scss
@@ -3,16 +3,16 @@
 		content: none;
 	}
 	.chat-2ZfjoI {
-		background: rgba(0, 0, 0, var(--middle-brightness));
+		background: rgb(0, 0, 0, var(--middle-brightness));
 	}
 	.messages-3amgkR {
 		background-color: transparent;
-		text-shadow: 0 2px 5px rgba(0, 0, 0, var(--text-shadow));
+		text-shadow: 0 2px 5px rgb(0, 0, 0, var(--text-shadow));
 	}
 	.newMessagesBar-1hF-9G {
 		background: var(--gradient);
 		opacity: 1;
-		box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
+		box-shadow: 0 2px 5px rgb(0, 0, 0, 0.5);
 	}
 	.jumpToPresentBar-1cEnH0 {
 		border-radius: 8px;
diff --git a/src/theme/guilds/_container.scss b/src/theme/guilds/_container.scss
@@ -1,7 +1,7 @@
 #app-mount .guilds-2JjMmN {
 	background-color: transparent;
 	.scrollerBase-_bVAAt {
-		background-color: rgba(0, 0, 0, var(--serverlist-brightness));
+		background-color: rgb(0, 0, 0, var(--serverlist-brightness));
 		&::-webkit-scrollbar {
 			display: none;
 		}
diff --git a/src/theme/members/_container.scss b/src/theme/members/_container.scss
@@ -1,6 +1,6 @@
 #app-mount {
 	.container-2o3qEW {
-		background-color: rgba(0, 0, 0, var(--right-brightness));
+		background-color: rgb(0, 0, 0, var(--right-brightness));
 	}
 	.members-3WRCEx {
 		background: transparent;
diff --git a/src/theme/modals/_modals.scss b/src/theme/modals/_modals.scss
@@ -7,7 +7,7 @@
 		background-color: transparent;
 		box-shadow: none;
 		.cardWarning-2yPNAa {
-			background-color: rgba(var(--discord-yellow), 0.2);
+			background-color: rgb(var(--discord-yellow), 0.2);
 			border: 2px solid rgb(var(--discord-yellow));
 		}
 		.footer-1Ip3Sd {
diff --git a/src/theme/modals/_upload.scss b/src/theme/modals/_upload.scss
@@ -32,7 +32,7 @@
 		width: 100%;
 		height: 100%;
 		border-radius: 3px;
-		background: rgba(0, 0, 0, var(--popout-modal-brightness));
+		background: rgb(0, 0, 0, var(--popout-modal-brightness));
 		box-shadow: var(--tint);
 		z-index: 1;
 		backdrop-filter: blur(var(--fb-popout-modal-image));
diff --git a/src/theme/modals/_usermodal.scss b/src/theme/modals/_usermodal.scss
@@ -1,19 +1,31 @@
-#app-mount .root-8LYsGj {
+#app-mount .userProfileModalOuter-1FYL8T {
 	background: transparent;
+
+	.userProfileInnerNonPremium-1XjSjn .body-_QAKrE {
+		background: var(--background-secondary);
+	}
+	.userProfileInnerWithBanner-3CJ1Og {
+		background: transparent;
+		&::before {
+			background: linear-gradient(var(--profile-gradient-primary-color), var(--profile-gradient-primary-color) 120px, var(--profile-gradient-secondary-color));
+			opacity: 0.25;
+		}
+	}
+
 	.topSectionNormal-2-vo2m {
 		background: var(--background-secondary);
 	}
 	.topSectionSpotify-1lI0-P {
-		background: rgba(var(--discord-spotify), 0.3);
+		background: hsl(var(--discord-spotify) / 0.3);
 	}
 	.topSectionPlaying-1J5E4n {
 		background: var(--gradient-50);
 	}
 	.topSectionStreaming-1Tpf5X {
-		background: rgba(var(--discord-twitch), 0.3);
+		background: rgb(var(--discord-twitch), 0.3);
 	}
 	.topSectionXbox-3fWLjS {
-		background: rgba(var(--discord-xbox), 0.3);
+		background: rgb(var(--discord-xbox), 0.3);
 	}
 	.svg-2azL_l {
 		z-index: 1;
diff --git a/src/theme/os/_mac.scss b/src/theme/os/_mac.scss
@@ -3,7 +3,7 @@ html.platform-osx {
 		position: absolute;
 		top: var(--window-padding);
 		left: var(--window-padding);
-		background: rgba(0, 0, 0, var(--serverlist-brightness));
+		background: rgb(0, 0, 0, var(--serverlist-brightness));
 		width: 72px;
 		border-top-left-radius: var(--window-roundness);
 	}
diff --git a/src/theme/pages/_discovery.scss b/src/theme/pages/_discovery.scss
@@ -12,7 +12,7 @@
 		}
 	}
 	.pageWrapper-2PwDoS {
-		background: rgba(0, 0, 0, var(--middle-brightness));
+		background: rgb(0, 0, 0, var(--middle-brightness));
 		.scrollerWrap-2lJEkd {
 			margin-top: 48px;
 			margin-bottom: 48px;
diff --git a/src/theme/pages/_friends.scss b/src/theme/pages/_friends.scss
@@ -1,12 +1,12 @@
 #app-mount .container-2cd8Mz {
-	background: rgba(0, 0, 0, var(--middle-brightness));
+	background: rgb(0, 0, 0, var(--middle-brightness));
 	.inset-SbsSFp {
 		background-color: var(--background-secondary);
 	}
 	.itemCard-3Etziu:hover {
 		background: var(--white);
 	}
 	.nowPlayingColumn-1eCBCN {
-		background: rgba(0, 0, 0, var(--right-brightness));
+		background: rgb(0, 0, 0, var(--right-brightness));
 	}
 }
diff --git a/src/theme/pages/_nitro.scss b/src/theme/pages/_nitro.scss
@@ -1,3 +1,3 @@
 #app-mount .applicationStore-2nk7Lo {
-	background: rgba(0, 0, 0, var(--middle-brightness));
+	background: rgb(0, 0, 0, var(--middle-brightness));
 }
diff --git a/src/theme/pages/_pages.scss b/src/theme/pages/_pages.scss
@@ -4,6 +4,6 @@
 		opacity: 0.5;
 	}
 	.container-36u7Lw {
-		background: rgba(0, 0, 0, var(--middle-brightness));
+		background: rgb(0, 0, 0, var(--middle-brightness));
 	}
 }
diff --git a/src/theme/pages/_serverboost.scss b/src/theme/pages/_serverboost.scss
@@ -1,6 +1,6 @@
 #app-mount {
 	.perksModal-fSYqOq {
-		background-color: rgba(0, 0, 0, var(--middle-brightness));
+		background-color: rgb(0, 0, 0, var(--middle-brightness));
 		background-image: none;
 		margin: var(--window-padding);
 		border-radius: var(--window-roundness);
diff --git a/src/theme/popouts/_userpopout.scss b/src/theme/popouts/_userpopout.scss
diff --git a/src/theme/settings/_container.scss b/src/theme/settings/_container.scss
diff --git a/src/theme/settings/_serversettings.scss b/src/theme/settings/_serversettings.scss
diff --git a/src/theme/sidebar/_container.scss b/src/theme/sidebar/_container.scss
diff --git a/src/theme/sidebar/_header.scss b/src/theme/sidebar/_header.scss

Original file line number	Diff line number	Diff line change
`@@ -18,7 +18,7 @@`
`18`	`18`	`}`
`19`	`19`	`.actionRed-gYn8D3,`
`20`	`20`	`.colorRed-1TFJan {`
`21`		`- background: rgba(var(--discord-red), 0.5);`
	`21`	`+ background: rgb(var(--discord-red), 0.5);`
`22`	`22`	`border: none;`
`23`	`23`	`color: #fff;`
`24`	`24`	`transition: 0.2s ease;`
`@@ -28,7 +28,7 @@`
`28`	`28`	`}`
`29`	`29`	`}`
`30`	`30`	`.lookFilled-1Gx00P.colorGreen-29iAKY {`
`31`		`- background: rgba(var(--discord-green), 0.4);`
	`31`	`+ background: rgb(var(--discord-green), 0.4);`
`32`	`32`	`transition: 0.2s ease;`
`33`	`33`	`&:active,`
`34`	`34`	`&:hover {`
`@@ -53,7 +53,7 @@`
`53`	`53`	`opacity: 1;`
`54`	`54`	`}`
`55`	`55`	`.lookOutlined-3sRXeN.colorBrand-3pXr91 {`
`56`		`- background: rgba(var(--discord-blurple), 0.3);`
	`56`	`+ background: rgb(var(--discord-blurple), 0.3);`
`57`	`57`	`border: transparent;`
`58`	`58`	`transition: 0.2s ease;`
`59`	`59`	`color: #fff;`
`@@ -69,11 +69,11 @@`
`69`	`69`	`border-color: transparent;`
`70`	`70`	`color: var(--text-normal);`
`71`	`71`	`&::placeholder {`
`72`		`- color: rgba(255, 255, 255, 0.5);`
	`72`	`+ color: rgb(255, 255, 255, 0.5);`
`73`	`73`	`}`
`74`	`74`	`}`
`75`	`75`	`.bd-search::placeholder {`
`76`		`- color: rgba(255, 255, 255, 0.5);`
	`76`	`+ color: rgb(255, 255, 255, 0.5);`
`77`	`77`	`}`
`78`	`78`	`// Radio buttons`
`79`	`79`	`.item-26Dhrx {`
`@@ -132,7 +132,7 @@`
`132`	`132`	`border-color: transparent;`
`133`	`133`	`}`
`134`	`134`	`[class='css'][class='placeholder'] {`
`135`		`- color: rgba(255, 255, 255, 0.5);`
	`135`	`+ color: rgb(255, 255, 255, 0.5);`
`136`	`136`	`opacity: 1;`
`137`	`137`	`}`
`138`	`138`	`// Range`
Original file line number	Diff line number	Diff line change
`@@ -26,6 +26,6 @@`
`26`	`26`	`height: 48px;`
`27`	`27`	`}`
`28`	`28`	`.noticeStreamerMode-2TSQpg {`
`29`		`- background: rgba(var(--discord-twitch), 0.6);`
	`29`	`+ background: rgb(var(--discord-twitch), 0.6);`
`30`	`30`	`}`
`31`	`31`	`}`
Original file line number	Diff line number	Diff line change
`@@ -9,7 +9,7 @@`
`9`	`9`	`}`
`10`	`10`	`}`
`11`	`11`	`.controlButton-2PMNom.leaveButton-2YnTyt {`
`12`		`- background: rgba(var(--discord-red), 0.5);`
	`12`	`+ background: rgb(var(--discord-red), 0.5);`
`13`	`13`	`&:hover {`
`14`	`14`	`background: rgb(var(--discord-red));`
`15`	`15`	`}`
Original file line number	Diff line number	Diff line change
`@@ -3,16 +3,16 @@`
`3`	`3`	`content: none;`
`4`	`4`	`}`
`5`	`5`	`.chat-2ZfjoI {`
`6`		`- background: rgba(0, 0, 0, var(--middle-brightness));`
	`6`	`+ background: rgb(0, 0, 0, var(--middle-brightness));`
`7`	`7`	`}`
`8`	`8`	`.messages-3amgkR {`
`9`	`9`	`background-color: transparent;`
`10`		`- text-shadow: 0 2px 5px rgba(0, 0, 0, var(--text-shadow));`
	`10`	`+ text-shadow: 0 2px 5px rgb(0, 0, 0, var(--text-shadow));`
`11`	`11`	`}`
`12`	`12`	`.newMessagesBar-1hF-9G {`
`13`	`13`	`background: var(--gradient);`
`14`	`14`	`opacity: 1;`
`15`		`- box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);`
	`15`	`+ box-shadow: 0 2px 5px rgb(0, 0, 0, 0.5);`
`16`	`16`	`}`
`17`	`17`	`.jumpToPresentBar-1cEnH0 {`
`18`	`18`	`border-radius: 8px;`
Original file line number	Diff line number	Diff line change
`@@ -1,7 +1,7 @@`
`1`	`1`	`#app-mount .guilds-2JjMmN {`
`2`	`2`	`background-color: transparent;`
`3`	`3`	`.scrollerBase-_bVAAt {`
`4`		`- background-color: rgba(0, 0, 0, var(--serverlist-brightness));`
	`4`	`+ background-color: rgb(0, 0, 0, var(--serverlist-brightness));`
`5`	`5`	`&::-webkit-scrollbar {`
`6`	`6`	`display: none;`
`7`	`7`	`}`
Original file line number	Diff line number	Diff line change
`@@ -1,6 +1,6 @@`
`1`	`1`	`#app-mount {`
`2`	`2`	`.container-2o3qEW {`
`3`		`- background-color: rgba(0, 0, 0, var(--right-brightness));`
	`3`	`+ background-color: rgb(0, 0, 0, var(--right-brightness));`
`4`	`4`	`}`
`5`	`5`	`.members-3WRCEx {`
`6`	`6`	`background: transparent;`