feat: better dark mode detection

Author: gregberge

packages/browser/src/global/media.ts

@@ -2,7 +2,10 @@
  * Get the current color scheme of the user.
  */
 export function getColorScheme() {
-  return window.matchMedia("(prefers-color-scheme: dark)").matches
+  const { colorScheme } = window.getComputedStyle(document.body);
+  return colorScheme === "dark" ||
+    colorScheme === "dark only" ||
+    window.matchMedia("(prefers-color-scheme: dark)").matches
     ? "dark"
     : "light";
 }

packages/storybook/stories/button.css

@@ -1,12 +1,14 @@
 :root {
   --button-bg: #1ea7fd;
   --button-text: #fff;
+  color-scheme: light;
 }
 
 .dark {
   --button-bg: #fff;
   --button-text: #333;
   background: #000;
+  color-scheme: dark;
 }
 
 .storybook-button {