Dark mode CSS can be imported twice on WNPs.

[alexgibson]

Description

Minor foot-gun here:

See: https://github.com/mozilla/bedrock/blob/main/media/css/firefox/whatsnew/whatsnew-135beta.scss#L8-L9

@import 'includes/dark-mode';
@import 'includes/mofo-donate-cta';

Note that _mofo_donate-cta.scss also imports dark-mode directly: https://github.com/mozilla/bedrock/blob/main/media/css/firefox/whatsnew/includes/_mofo-donate-cta.scss#L6

We should probably remove the dark_mode import from the donate scss, and make both explicit.

[janbrasna]

TBH the real issue actually seems to be the other way around — when dark-mode not specified and included, but silently smuggled in via mofo-donate-cta, there are dark-mode-enabled WNP pages now that only work in dark mode due to this issue. Once the issue above is resolved, all the WNP 132-135b without explicit dark-mode partial that now adapt to color schemes will be light only. (Bug or feature? A change/regression nonetheless. Any update needs to be made along with any fixes needed for the cases below, as demonstrated in #15857 (review) …)

Quickly glancing the rules:

• http://localhost:8000/en-GB/firefox/130.0/whatsnew/ is light only as it doesn't have the CTA at all. (as designed)
• http://localhost:8000/en-CA/firefox/131.0/whatsnew/ is light only with CTA, but no CTA dark mode partial to turn it all dark. (as designed)
• http://localhost:8000/en-GB/firefox/131.0/whatsnew/ has explicit color schemes (as designed)
• http://localhost:8000/en-CA/firefox/132.0/whatsnew/ is not explicit to be dark themed; but thanks the imported CTA partial it is. (here's where it gets interesting, cuz it might be intended to have color scheme support, but it's not coded that way, or the theming is actually a bug from the duplicated import… And 133 below are even more interesting as every variant/region is coded with different color scheme support…)
• http://localhost:8000/en-CA/firefox/133.0/whatsnew/?v=4 [-fakespot] doesn't import dark-mode, but imports CTA partial so effectively responds to theming (compared to [-vpn] that I don't know the variant URL, which imports dark-mode explicitly for comparison…)
  http://localhost:8000/en-CA/firefox/133.0/whatsnew/?v=2 [-donation] doesn’t have the include at all so it's light only (as designed)
• http://localhost:8000/en-US/firefox/134.0/whatsnew/ is light even with CTA included cuz it doesn’t import the partial (as designed)
• http://localhost:8000/en-US/firefox/135.0beta/whatsnew/ is explicit to be themed by color schemes.

Thinking aloud:

• _mofo-donate-cta.scss doesn't actually include any special CTA styles, only dark mode tweaks; so loading it on pages that are not dark mode is superfluous, only now it serves as an equivalent to importing _dark-mode.scss when not otherwise loaded;D
• it can be either merged to _dark-mode.scss to not have to think about it again, with the caveat of serving the extra lines even in pages not including the CTA… (most currently are)
• … or it can be renamed to something like _dark-mode-mofo-donate-cta.scss to be obviously apparent what purpose it serves, and that it only needs to accompany dark-mode import, but the actual dark-mode import has to be made explicitly too.
• In any case some of the pages need either removing this CTA import, adding the dark-more import, or a decision where the theming was intended to be a feature and should be coded to stay, and where it was merely a coincidence/bug and it should be coded out explicitly.

[maureenlholland]

@janbrasna @alexgibson My thinking is that wnp-footer section should be part of the base.html template now and the donate CTA dark mode styles merged into _dark-mode.scss

We seem to be including that footer section with the donate CTA in most of the current templates (19 out of 25). We would still need the ability to make that block empty for 6 past templates, but overall, I think that section is part of the standard WNP template now. If we don't want to mess with the template for this issue, my vote is to merge CTA dark mode styles into existing dark mode partial to address this issue (with expectation we'll update template later)