Make css style dependent of dark mode

[papanito]

I have some custom css which is different for the dark mode. How do I activate them when switching to dark theme. In pervious version of the theme I had something like

[data-dark-mode] body {
  background: $body-bg-dark;
  color: $body-color-dark;
}

[data-dark-mode] body a {
  color: $link-color-dark;
}

[h-enk]

Use the Bootstrap Sass mixin color-mode(). For example:

// Put your custom SCSS code here
h1 {
  background-color: yellow;
}

@include color-mode(dark) {
  h1 {
    background-color: lime;
  }
}

See also the Boostrap docs: Building with Sass

[papanito]

Many thanks as always for your quick response.