Zdánlivě každý web, dapp a aplikace nabízí preferenci tmavého režimu a díky bohu. Tmavý režim je zvláště užitečný, když kóduji pozdě v noci, nebo ještě hůř, obchoduji s altcoiny. V současné době pracuji na implementaci tmavého motivu na MetaMask a přivedlo mě to k přemýšlení:Existuje způsob, jak můžeme nastavit tmavý režim, pokud je na tmavý režim nastaven i operační systém uživatele?
Jedním rychlým řádkem kódu můžete určit, zda operační systém uživatele preferuje tmavý režim:
const prefersDarkMode = window.matchMedia("(prefers-color-scheme:dark)").matches; // true
Tento fragment kódu využívá CSS prefers-color-scheme mediální dotaz pomocí JavaScript matchMedia API.
Z hlediska uživatelského dojmu budete muset být při používání tohoto úryvku opatrní. Tato metoda je skvělá pro nastavení výchozího nastavení pro nové uživatele bez změny hodnoty pro stávající uživatele.