Flexbox Item pane: Dark mode colors

RESOLVED FIXED in Firefox 65

Status

defect
P2
normal
RESOLVED FIXED
5 months ago
5 months ago

People

(Reporter: victoria, Assigned: mtigley)

Tracking

unspecified
Firefox 65
Dependency tree / graph

Firefox Tracking Flags

(firefox65 fixed)

Details

Attachments

(1 attachment)

(Reporter)

Description

5 months ago
Dark mode diagram and sizing table colors

Mockup: https://mozilla.invisionapp.com/share/MZNA228P5WB#/328646784_flexbox_Item_Examples
Inspect (needs login) https://mozilla.invisionapp.com/d/#/console/14988591/328646784/inspect

Let me know if you see any issues with these colors!
(Reporter)

Comment 1

5 months ago
All colors used are existing in variables.css, but there are new opacity values.
(Reporter)

Updated

5 months ago
Blocks: 1503206, 1478396
(Reporter)

Comment 2

5 months ago
The colors are:

Basis bg: rgba(10,132,255,0.3)
Basis outline: rgba(10,132,255,0.85)

Grow: rgba(255,26,217,0.25)
Shrink (whoops, tbd on Monday)

Final outline: #939395

Magenta arrow, text - syntax red color
Blue text - syntax blue

All the gray text is Gray 40 or Gray 50, except h1 which is #939395
(Assignee)

Updated

5 months ago
Assignee: nobody → mtigley
Status: NEW → ASSIGNED
Priority: -- → P2
(Reporter)

Comment 3

5 months ago
Updated mockup with dark shrink example. The color is rgba(133,77,255,0.25)

Comment 5

5 months ago
Pushed by mtigley@mozilla.com:
https://hg.mozilla.org/integration/autoland/rev/88f8e61c7b04
Style flex outline to match new colour scheme. r=gl

Comment 6

5 months ago
bugherder
https://hg.mozilla.org/mozilla-central/rev/88f8e61c7b04
Status: ASSIGNED → RESOLVED
Last Resolved: 5 months ago
Resolution: --- → FIXED
Target Milestone: --- → Firefox 65
You need to log in before you can comment on or make changes to this bug.