Open
Bug 1498737
Opened 6 years ago
Updated 2 years ago
[HighContrast Mode][Mac OS] Toggles are no longer visible if display contrast is increased
Categories
(DevTools :: Inspector, defect, P3)
Tracking
(Not tracked)
NEW
People
(Reporter: paul.boiciuc, Unassigned)
References
(Blocks 1 open bug)
Details
Attachments
(3 files)
STR:
1. Navigate to System Preferences -> Access and locate the Display Contrast controller.
2. Move the Display Contrast indicator towards the middle.
3. Launch Firefox and navigate to a random page (e.g. nytimes.com)
4. Enable the element inspector and select a flex element.
5. Navigate to the Flexbox Inspector and observe the overlay toggle.
Actual result:
The overlay toggle is not visible anymore after the high contrast has been modified.
I have attached a screenshot for better understanding. If the high-contrast indicator is moved towards the middle of the scale the toggle is no longer visible.
Expected result:
All elements of the FlexBox Inspector are properly visible even with HighContrast Mode on, as it does on Windows or Ubuntu.
I apologize. For some reason, when the screenshot was captured the toggle was visible again, but I'll make sure I'll attach a better example of the issue.
Summary: [Flexbox Inspector][HighContrast Mode][Mac OS] The overlay toggle is no longer visible if display contrast is increased → [Flexbox Inspector][HighContrast Mode][Mac OS] The disabled overlay toggle is no longer visible if display contrast is increasedd
Comment 3•6 years ago
|
||
(Setting needinfo per comment 2 - sounds like you were intending to attach an updated screenshot, I think?)
Also, two questions:
(1): By "overlay toggle", I suspect you're talking about the little gray slider button that looks kinda like "(o )" -- is that right?
(2) If so, would you mind testing other DevTools panes that have the same widget & see if they're affected too? For example: I found one other similar-looking slider on the "Fonts" devtools pane (Fonts is one of the tab-titles at the rightmost pane of three-pane-devtools). That Fonts pane has a similar slider labeled "Italic" there, at least in most cases (e.g. for any node that I pick at nytimes.com). It'd be useful to know if that button is affected by this bug as well (I'm guessing it probably is...)
Flags: needinfo?(paul.boiciuc)
Summary: [Flexbox Inspector][HighContrast Mode][Mac OS] The disabled overlay toggle is no longer visible if display contrast is increasedd → [Flexbox Inspector][HighContrast Mode][Mac OS] The disabled overlay toggle is no longer visible if display contrast is increased
Hi Daniel,
I apologize for not adding the attachment. I've tried to catch it in a screen recording, but whenever I play back the video, the issue is not visible. ( although it was during the recording - as it happened with the screenshot).
1. Yes, I'm talking about the toggle from the far right side of the Inspector, present in the Layout section, when a flex container is selected.
2. I've navigated to Fonts - and it seems that all the toggles present on the page are affected ( the ones for Size / Line Height / Wight and Italic ).
Based on this, I'll edit the title and remove the [Flexbox Inspector] tag, as it is not limited to this feature.
Flags: needinfo?(paul.boiciuc)
Summary: [Flexbox Inspector][HighContrast Mode][Mac OS] The disabled overlay toggle is no longer visible if display contrast is increased → [HighContrast Mode][Mac OS] Toggles are no longer visible if display contrast is increased
Comment 5•6 years ago
|
||
(In reply to Paul_B from comment #4)
> I apologize for not adding the attachment. I've tried to catch it in a
> screen recording, but whenever I play back the video, the issue is not
> visible. ( although it was during the recording - as it happened with the
> screenshot).
Odd! Maybe the video/screen-capture tools bypass some piece of the "high contrast" feature, or something.
Just for documentation/demonstration purposes, you might consider taking a photo or video of the screen when reproducing the bug -- presumably the issue would be visible there. (Though maybe that's not necessary. *shrug*)
Here is a photo of the issue taken with a phone.
@Victoria: What do you think we should do here? Maybe add a light grey border to the background?
Flags: needinfo?(victoria)
Priority: -- → P3
I've added a short video of the issue captured with the phone.
Updated•6 years ago
|
Attachment #9016843 -
Attachment description: High Contrast → screenshot of high-contrast config dialog (doesn't show the bug b/c bug isn't visible in screenshots)
Updated•6 years ago
|
Attachment #9017535 -
Attachment description: Contrast Issue.jpg → photo showing the missing widget (white circle visible in upper right corner, but its "track" isn't shown)
Comment 8•6 years ago
|
||
Thanks all for the info - I'm not sure there's a great solution to this for now. We've discussed creating a separate high contrast theme, which would be ideal, but for now I don't think we want to deepen all the sleek gray areas which get lost (I feel a gray outline on the toggle track would just get lost like all the other grays). In trying this out, I noticed that even the MacOS system panel itself gets pretty unusable at high contrast (especially the checkboxes).
Flags: needinfo?(victoria)
Comment 9•6 years ago
|
||
(The main Firefox content blocking toggle (in the hamburger menu) also disappears at high contrast, and we're patterning ours after theirs.)
Updated•2 years ago
|
Severity: normal → S3
You need to log in
before you can comment on or make changes to this bug.
Description
•