diff --git a/__tests__/accent_color.test.scss b/__tests__/accent_color.test.scss index 206760e..ce85923 100644 --- a/__tests__/accent_color.test.scss +++ b/__tests__/accent_color.test.scss @@ -7,6 +7,7 @@ @include output { @include AccentColor { body { + border-color: $accentBorder; background-color: $accentColor; color: $accentTextColor; } @@ -14,11 +15,13 @@ } @include expect { body { + border-color: ActiveBorder; background-color: AccentColor; color: AccentColorText; } @supports -moz-bool-pref("userChrome.compatibility.accent_color") { body { + border-color: -moz-accent-color; background-color: -moz-accent-color; color: -moz-accent-color-foreground; } @@ -32,10 +35,12 @@ :root { @include AccentColor { // Don't use like this!! + --uc-accent-border: $accentBorder; --uc-accent-color: $accentColor; --uc-accent-text-color: $accentTextColor; // Use like this + --uc-accent-border: #{$accentBorder}; --uc-accent-color: #{$accentColor}; --uc-accent-text-color: #{$accentTextColor}; } @@ -43,15 +48,19 @@ } @include expect { :root { + --uc-accent-border: $accentBorder; --uc-accent-color: $accentColor; --uc-accent-text-color: $accentTextColor; + --uc-accent-border: ActiveBorder; --uc-accent-color: AccentColor; --uc-accent-text-color: AccentColorText; } @supports -moz-bool-pref("userChrome.compatibility.accent_color") { :root { + --uc-accent-border: $accentBorder; --uc-accent-color: $accentColor; --uc-accent-text-color: $accentTextColor; + --uc-accent-border: -moz-accent-color; --uc-accent-color: -moz-accent-color; --uc-accent-text-color: -moz-accent-color-foreground; } @@ -64,6 +73,7 @@ @include output { @include AccentColor("Highlight") { body { + border-color: $accentBorder; background-color: $accentColor; color: $accentTextColor; } @@ -71,11 +81,13 @@ } @include expect { body { + border-color: ActiveBorder; background-color: AccentColor; color: AccentColorText; } @supports -moz-bool-pref("userChrome.compatibility.accent_color") { body { + border-color: -moz-accent-color; background-color: Highlight; color: HighlightText; } diff --git a/src/theme/system_default_theme/_win10.scss b/src/theme/system_default_theme/_win10.scss index 1bd608e..0473583 100644 --- a/src/theme/system_default_theme/_win10.scss +++ b/src/theme/system_default_theme/_win10.scss @@ -320,7 +320,7 @@ .titlebar-color { @include AccentColor { color: $accentTextColor; - background-color: $accentColor; + background-color: $accentColor; // TODO: Use $accentBorder } } diff --git a/src/utils/_accent_color.scss b/src/utils/_accent_color.scss index 9da9896..abe12b1 100644 --- a/src/utils/_accent_color.scss +++ b/src/utils/_accent_color.scss @@ -4,6 +4,7 @@ // https://github.com/mozilla/gecko-dev/commit/4c5f20179e8d3b963dc588efb9dc2c7b49e7bb31 // // Need to hard coded #437 +$accentBorder: ActiveBorder; $accentColor: AccentColor; $accentTextColor: AccentColorText; @@ -11,6 +12,8 @@ $accentTextColor: AccentColorText; @content; @include Option("userChrome.compatibility.accent_color") { + $accentBorder: -moz-accent-color !global; + @if $mode == "Highlight" { $accentColor: Highlight !global; $accentTextColor: HighlightText !global; @@ -22,6 +25,7 @@ $accentTextColor: AccentColorText; @content; } + $accentBorder: ActiveBorder !global; $accentColor: AccentColor !global; $accentTextColor: AccentColorText !global; }