Bug 1731678 - Add some generic dark system colors for Windows/Android/standins. r=dholbert

Eventually we should support all of them, but for now they are only used
by native code (unless you enable the color-scheme pref) and these will
be enough.

Differential Revision: https://phabricator.services.mozilla.com/D126737
This commit is contained in:
Emilio Cobos Álvarez 2021-09-29 10:20:56 +00:00
parent b2c03de0cc
commit d10188f9b4
10 changed files with 138 additions and 21 deletions

View File

@ -0,0 +1,8 @@
<!doctype html>
<style>
:root {
background-color: Window;
color: WindowText;
}
</style>
Some text

View File

@ -0,0 +1,9 @@
<!doctype html>
<style>
:root {
color-scheme: dark;
background-color: Window;
color: WindowText;
}
</style>
Some text

View File

@ -0,0 +1,3 @@
defaults pref(layout.css.color-scheme.enabled,true)
!= color-scheme-basic.html color-scheme-basic-notref.html

View File

@ -153,6 +153,9 @@ include css-variables/reftest.list
include cssom/reftest.list
# color-scheme
include color-scheme/reftest.list
# columns/
include columns/reftest.list

View File

@ -110,7 +110,13 @@
@media (-moz-toolbar-prefers-color-scheme: dark) {
:host,
:root {
/* Keep these in sync with layout/base/PresShell.cpp, and plaintext.css */
/* Keep these in sync with layout/base/PresShell.cpp, plaintext.css,
* and nsXPLookAndFeel::GenericDarkColor
*
* TODO (emilio): Once color-scheme support is complete, perhaps we can
* just replace most of these for system colors and remove all this
* duplication (assuming we honor the preferred color scheme for
* in-content privileged pages and plain-text documents). */
--in-content-page-background: rgb(28,27,34);
--in-content-page-color: rgb(251,251,254);
--in-content-deemphasized-text: rgb(191,191,201);

View File

@ -94,6 +94,34 @@ nsresult nsLookAndFeel::NativeGetColor(ColorID aID, ColorScheme aColorScheme,
return NS_ERROR_FAILURE;
}
// Highlight/Highlighttext have native equivalents that we can map to (on
// Android) which should work fine, regardless of the color-scheme.
switch (aID) {
case ColorID::Highlight: {
// Matched to action_accent in java codebase. This works fine with both
// light and dark color scheme.
nscolor accent =
Color(ColorID::MozAccentColor, aColorScheme, UseStandins::No);
aColor =
NS_RGBA(NS_GET_R(accent), NS_GET_G(accent), NS_GET_B(accent), 153);
return NS_OK;
}
case ColorID::Highlighttext:
// Selection background is transparent enough that any foreground color
// will do.
aColor = NS_SAME_AS_FOREGROUND_COLOR;
return NS_OK;
default:
break;
}
if (aColorScheme == ColorScheme::Dark) {
if (auto darkColor = GenericDarkColor(aID)) {
aColor = *darkColor;
return NS_OK;
}
}
// XXX we'll want to use context.obtainStyledAttributes on the java side to
// get all of these; see TextView.java for a good example.
auto UseNativeAccent = [this] {
@ -129,20 +157,6 @@ nsresult nsLookAndFeel::NativeGetColor(ColorID aID, ColorScheme aColorScheme,
aColor = NS_RGBA(119, 119, 119, 102);
break;
case ColorID::Highlight: {
// Matched to action_accent in java codebase. This works fine with both
// light and dark color scheme.
nscolor accent =
Color(ColorID::MozAccentColor, aColorScheme, UseStandins::No);
aColor =
NS_RGBA(NS_GET_R(accent), NS_GET_G(accent), NS_GET_B(accent), 153);
break;
}
case ColorID::Highlighttext:
// Selection background is transparent enough that any foreground color
// does.
aColor = NS_SAME_AS_FOREGROUND_COLOR;
break;
case ColorID::IMESelectedRawTextBackground:
case ColorID::IMESelectedConvertedTextBackground:
case ColorID::WidgetSelectBackground:

View File

@ -16,10 +16,13 @@ HeadlessLookAndFeel::HeadlessLookAndFeel() {}
HeadlessLookAndFeel::~HeadlessLookAndFeel() = default;
nsresult HeadlessLookAndFeel::NativeGetColor(ColorID aID, ColorScheme,
nsresult HeadlessLookAndFeel::NativeGetColor(ColorID aID, ColorScheme aScheme,
nscolor& aColor) {
// For headless mode, we use GetStandinForNativeColor for everything we can,
// and hardcoded values for everything else.
//
// TODO(emilio): We should probably just move these to
// GetStandinForNativeColor.
nsresult res = NS_OK;
@ -114,7 +117,7 @@ nsresult HeadlessLookAndFeel::NativeGetColor(ColorID aID, ColorScheme,
aColor = NS_RGB(0xff, 0xff, 0xff);
break;
default:
aColor = GetStandinForNativeColor(aID);
aColor = GetStandinForNativeColor(aID, aScheme);
break;
}

View File

@ -504,7 +504,14 @@ static bool IsSpecialColor(LookAndFeel::ColorID aID, nscolor aColor) {
return false;
}
nscolor nsXPLookAndFeel::GetStandinForNativeColor(ColorID aID) {
nscolor nsXPLookAndFeel::GetStandinForNativeColor(ColorID aID,
ColorScheme aScheme) {
if (aScheme == ColorScheme::Dark) {
if (auto color = GenericDarkColor(aID)) {
return *color;
}
}
// The stand-in colors are taken from the Windows 7 Aero theme
// except Mac-specific colors which are taken from Mac OS 10.7.
@ -593,6 +600,54 @@ nscolor nsXPLookAndFeel::GetStandinForNativeColor(ColorID aID) {
return NS_RGB(0xFF, 0xFF, 0xFF);
}
#undef COLOR
// Taken from in-content/common.inc.css's dark theme.
Maybe<nscolor> nsXPLookAndFeel::GenericDarkColor(ColorID aID) {
nscolor color = NS_RGB(0, 0, 0);
switch (aID) {
case ColorID::Window: // --in-content-page-background
case ColorID::WindowBackground:
case ColorID::Background:
case ColorID::TextBackground:
color = NS_RGB(28, 27, 34);
break;
case ColorID::MozDialog: // --in-content-box-background
color = NS_RGB(35, 34, 43);
break;
case ColorID::Windowtext: // --in-content-page-color
case ColorID::WindowForeground:
case ColorID::MozDialogtext:
case ColorID::TextForeground:
case ColorID::Fieldtext:
case ColorID::Buttontext: // --in-content-button-text-color (via
// --in-content-page-color)
color = NS_RGB(251, 251, 254);
break;
case ColorID::Graytext: // --in-content-deemphasized-text
color = NS_RGB(191, 191, 201);
break;
case ColorID::Selecteditem: // --in-content-primary-button-background /
// --in-content-item-selected
case ColorID::Highlight:
// TODO(emilio): Perhaps for selection (highlight / highlighttext) we want
// something more subtle like Android / macOS do.
color = NS_RGB(0, 221, 255);
break;
case ColorID::Field:
case ColorID::Buttonface: // --in-content-button-background
case ColorID::Selecteditemtext: // --in-content-primary-button-text-color /
// --in-content-item-selected-text
case ColorID::Highlighttext:
color = NS_RGB(43, 42, 51);
break;
default:
return Nothing();
}
return Some(color);
}
// Uncomment the #define below if you want to debug system color use in a skin
// that uses them. When set, it will make all system color pairs that are
// appropriate for foreground/background pairing the same. This means if the
@ -705,7 +760,7 @@ nsresult nsXPLookAndFeel::GetColorValue(ColorID aID, ColorScheme aScheme,
#endif
if (aUseStandins == UseStandins::Yes) {
aResult = GetStandinForNativeColor(aID);
aResult = GetStandinForNativeColor(aID, aScheme);
return NS_OK;
}

View File

@ -6,6 +6,7 @@
#ifndef __nsXPLookAndFeel
#define __nsXPLookAndFeel
#include "mozilla/Maybe.h"
#include "mozilla/LookAndFeel.h"
#include "mozilla/widget/LookAndFeelTypes.h"
#include "nsTArray.h"
@ -70,7 +71,15 @@ class nsXPLookAndFeel : public mozilla::LookAndFeel {
protected:
nsXPLookAndFeel() = default;
static nscolor GetStandinForNativeColor(ColorID);
static nscolor GetStandinForNativeColor(ColorID, ColorScheme);
// A platform-agnostic dark-color scheme, for platforms where we don't have
// "native" dark colors, like Windows and Android.
//
// TODO: In the future we should use this as well for standins (i.e.,
// resistFingerprinting, etc).
static mozilla::Maybe<nscolor> GenericDarkColor(ColorID);
void RecordTelemetry();
virtual void RecordLookAndFeelSpecificTelemetry() {}

View File

@ -112,10 +112,17 @@ void nsLookAndFeel::RefreshImpl() {
mInitialized = false; // Fetch system colors next time they're used.
}
nsresult nsLookAndFeel::NativeGetColor(ColorID aID, ColorScheme,
nsresult nsLookAndFeel::NativeGetColor(ColorID aID, ColorScheme aScheme,
nscolor& aColor) {
EnsureInit();
if (aScheme == ColorScheme::Dark) {
if (auto color = GenericDarkColor(aID)) {
aColor = *color;
return NS_OK;
}
}
nsresult res = NS_OK;
int idx;