Having blurry background on Desktop and not only on mobile

StarCitizenTools / mediawiki-skins-Citizen

A beautiful, usable, responsive MediaWiki skin with in-depth extension support. Originally developed for the Star Citizen Wiki.

https://www.mediawiki.org/wiki/Skin:Citizen

GNU General Public License v3.0

211 stars 53 forks source link

Having blurry background on Desktop and not only on mobile #892

Open ratte1303 opened 3 weeks ago

ratte1303 commented 3 weeks ago

The Problem

The blur effect does a great job focussing the popup menus on mobile. The dekstop version could also profit from this, especially on bigger screens.

The Solution

Remove the @media query on line 88 in resources/skins.citizen.styles/components/Menu.less

Live demo: arbeit.wiki

alistair3149 commented 3 weeks ago

It can be an undesired behavior on desktop.

Unlike modals, the backdrop used on the dropdown menus are not for focus, since the dropdown button is already next to the opened menu. On mobile, users are more likely to misclick an unintended element, that's why a backdrop is added to prevent doing that. On desktop, it is less likely to happen. Not having a backdrop allows the user to interact with the background element without an extra click.