fix advanced rendering toggle on web with NewModal Closes #2284 (#4733)

apps/frontend/src/layouts/default.vue

@@ -26,7 +26,14 @@
 			</div>
 		</div>
 	</div>
-	<div ref="main_page" class="layout" :class="{ 'expanded-mobile-nav': isBrowseMenuOpen }">
+	<div
+		ref="main_page"
+		class="layout"
+		:class="{
+			'expanded-mobile-nav': isBrowseMenuOpen,
+			'modrinth-parent__no-modal-blurs': !cosmetics.advancedRendering,
+		}"
+	>
 		<PagewideBanner v-if="isRussia && !flags.hideRussiaCensorshipBanner" variant="error">
 			<template #title>
 				<div class="flex flex-col gap-1 text-contrast">

packages/ui/src/components/modal/NewModal.vue

@@ -266,6 +266,12 @@ function handleKeyDown(event: KeyboardEvent) {
 	}
 }
 
+.modrinth-parent__no-modal-blurs {
+	.modal-overlay {
+		backdrop-filter: none;
+	}
+}
+
 .modal-container {
 	position: fixed;
 	top: 0;