Skip to content

Draft: Resolve #2972667 "Dark mode"

Stefan Auditor requested to merge issue/bluecheese-2972667:2972667-dark-mode into 1.x

Add a sass mixin for prefers-color-scheme media feature to seamlessly switch dark and light themes based on the user's system preferences.

This allows to use the following code to adjust any element to dark-mode

@include darkMode {}

For example, to add a dark-mode to H1 do

h1 {
  color: black;
  background-color: white;

  @include darkMode {
    color: white;
    background-color: black;
  }
}

Also see https://userstyles.world/style/13629/drupal-org-dark-mode

Closes #2972667

Edited by Stefan Auditor

Merge request reports