Style change

src/pages/homepage/components/SettingsButton.tsx

@@ -110,7 +110,15 @@ function SettingsButton() {
 						<FiMenu />
 					</Button>
 				</Menu.Target>
-				<Menu.Dropdown>
+				<Menu.Dropdown
+					style={{
+						backgroundColor:
+							theme.backgroundImage.toLowerCase() !== 'none' &&
+							theme.backgroundImage !== undefined
+								? 'transparent'
+								: theme.backgroundColor,
+					}}
+				>
 					<Stack gap={0} display={'flex'} pb={'1rem'} pt={'2rem'} align='center'>
 						<Tooltip label='Settings' color={theme.primaryColor} withArrow>
 							<FiSettings

src/styles/Menu.module.css

@@ -1,6 +1,7 @@
 .dropdown {
 	color: var(--color-text-pri);
 	border-color: var(--color-text-pri) !important;
+	backdrop-filter: blur(10px) brightness(3) !important;
 }
 .item {
 	&:hover {