From e531b2b7fdccd073fbba0d58b3a5b648e8f6ab85 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Emilio=20Cobos=20=C3=81lvarez?= Date: Fri, 5 Feb 2021 16:25:57 +0000 Subject: [PATCH] Bug 1689615 - Only paint one outline for outline-style:auto with nnt. r=mstange outline-style: auto might show up in non-themed controls and such, and the double-outline there might look ugly. Following border-radius would be an extra improvement for the reddit case, but no platform does it currently (Safari on macOS does it), so let's consider that in a follow-up. Differential Revision: https://phabricator.services.mozilla.com/D104214 --- widget/nsNativeBasicTheme.cpp | 14 ++++++++++---- widget/nsNativeBasicTheme.h | 6 +++--- 2 files changed, 13 insertions(+), 7 deletions(-) diff --git a/widget/nsNativeBasicTheme.cpp b/widget/nsNativeBasicTheme.cpp index bf4a808c0ff0..a17cb8c2cb5f 100644 --- a/widget/nsNativeBasicTheme.cpp +++ b/widget/nsNativeBasicTheme.cpp @@ -483,7 +483,8 @@ void nsNativeBasicTheme::PaintRoundedFocusRect(DrawTarget* aDrawTarget, const LayoutDeviceRect& aRect, DPIRatio aDpiRatio, CSSCoord aRadius, - CSSCoord aOffset) { + CSSCoord aOffset, + bool aInnerOnly) { // NOTE(emilio): If the widths or offsets here change, make sure to tweak // the GetWidgetOverflow path for FocusOutline. auto [innerColor, middleColor, outerColor] = ComputeFocusRectColors(); @@ -507,6 +508,10 @@ void nsNativeBasicTheme::PaintRoundedFocusRect(DrawTarget* aDrawTarget, aDrawTarget->Stroke(roundedRect, ColorPattern(ToDeviceColor(innerColor)), StrokeOptions(strokeWidth)); + if (aInnerOnly) { + return; + } + offset = CSSCoord(1.0f) * aDpiRatio; strokeRadius += offset; strokeWidth = CSSCoord(1.0f) * aDpiRatio; @@ -1272,7 +1277,8 @@ nsNativeBasicTheme::DrawWidgetBackground(gfxContext* aContext, nsIFrame* aFrame, break; case StyleAppearance::FocusOutline: // TODO(emilio): Consider supporting outline-radius / outline-offset? - PaintRoundedFocusRect(dt, devPxRect, dpiRatio, 0.0f, 0.0f); + PaintRoundedFocusRect(dt, devPxRect, dpiRatio, 0.0f, 0.0f, + /* aInnerOnly = */ true); break; default: // Various appearance values are used for XUL elements. Normally these @@ -1359,8 +1365,8 @@ bool nsNativeBasicTheme::GetWidgetOverflow(nsDeviceContext* aContext, nsIntMargin overflow; switch (aAppearance) { case StyleAppearance::FocusOutline: - // 2px * each of the segments + 1 px for the separation between them. - overflow.SizeTo(5, 5, 5, 5); + // 2px * one segment + overflow.SizeTo(2, 2, 2, 2); break; case StyleAppearance::Radio: case StyleAppearance::Checkbox: diff --git a/widget/nsNativeBasicTheme.h b/widget/nsNativeBasicTheme.h index 80c99d52dc70..82b09bba2c99 100644 --- a/widget/nsNativeBasicTheme.h +++ b/widget/nsNativeBasicTheme.h @@ -186,8 +186,7 @@ class nsNativeBasicTheme : protected nsNativeTheme, public nsITheme { bool WidgetIsContainer(StyleAppearance aAppearance) override; bool ThemeDrawsFocusForWidget(StyleAppearance aAppearance) override; bool ThemeNeedsComboboxDropmarker() override; - ScrollbarSizes GetScrollbarSizes(nsPresContext*, - StyleScrollbarWidth, + ScrollbarSizes GetScrollbarSizes(nsPresContext*, StyleScrollbarWidth, Overlay) override; static nscolor AdjustUnthemedScrollbarThumbColor(nscolor, EventStates); @@ -239,7 +238,8 @@ class nsNativeBasicTheme : protected nsNativeTheme, public nsITheme { void PaintRoundedFocusRect(DrawTarget* aDrawTarget, const LayoutDeviceRect& aRect, DPIRatio aDpiRatio, - CSSCoord aRadius, CSSCoord aOffset); + CSSCoord aRadius, CSSCoord aOffset, + bool aInnerOnly = false); void PaintRoundedRectWithRadius(DrawTarget* aDrawTarget, const LayoutDeviceRect& aRect, const sRGBColor& aBackgroundColor,