diff --git a/README.md b/README.md index ce9119e..73c62c9 100644 --- a/README.md +++ b/README.md @@ -59,11 +59,11 @@ Just stick this in your `
`: #### Enforce a theme and ignore `(prefers-color-scheme)` -For the main `water.css` file, dark is only treated as a _default theme_: if a user has a preference for either dark or light mode on their device, the stylesheet will respect this. This detection is made possible through a recent CSS media query called `prefers-color-scheme`. If you want to avoid this behavior and enforce dark or light theme, use either `dark.css` or `light.css`. +For the main `water.css` file, light is only treated as a _default theme_: if a user has a preference for either dark or light mode on their device, the stylesheet will respect this. This detection is made possible through a CSS media query called `prefers-color-scheme`. If you want to avoid this behavior and enforce a theme, use either `dark.css` or `light.css`. #### Want to support Internet Explorer? -All three distributions of Water.css support Internet Explorer 11, but the main `water.css` file **doesn't respect the user's color scheme** and will be locked to dark mode due to lack of `prefers-color-scheme` support. +All three distributions of Water.css support Internet Explorer 11, but the main `water.css` file **doesn't respect the user's color scheme** and will be locked to light mode due to lack of `prefers-color-scheme` support. Be aware that IE also doesn't support [runtime theming](#theming), and fixed fallback values will be used. If you want to override the Water.css theme, we recommend that you [compile your own theme](#compiling-your-own-theme). @@ -101,12 +101,12 @@ If you want to change a value for dark or light mode only, use a media query lik ```html diff --git a/src/builds/water.css b/src/builds/water.css index 709f313..32d2d02 100644 --- a/src/builds/water.css +++ b/src/builds/water.css @@ -4,6 +4,6 @@ * if a system-wide theme preference is set on the user's device. */ -@import '../variables-dark.css'; -@import '../variables-light.css' (prefers-color-scheme: light); +@import '../variables-light.css'; +@import '../variables-dark.css' (prefers-color-scheme: dark); @import '../parts/_core.css';