Closed
Bug 1399028
Opened 7 years ago
Closed 7 years ago
Photon update - DevTools tabs colors
Categories
(DevTools :: General, defect, P1)
DevTools
General
Tracking
(firefox57 fixed)
RESOLVED
FIXED
Firefox 57
Tracking | Status | |
---|---|---|
firefox57 | --- | fixed |
People
(Reporter: jdescottes, Assigned: jdescottes)
References
(Depends on 1 open bug, Blocks 1 open bug)
Details
Attachments
(2 files)
Should match https://docs.google.com/document/d/1AJ7oHC7akXJiliheHjhFc4fTonaN31Eo_P2M8gssL8s/edit
- change the icon color when selected
- change the text color when selected
- on hover should only change the background color + have a top border
Assignee | ||
Updated•7 years ago
|
Summary: DevTools tabs photon colors → Photon update - DevTools tabs colors
Comment hidden (mozreview-request) |
Comment hidden (mozreview-request) |
Assignee | ||
Comment 4•7 years ago
|
||
For the record, just stumbled upon https://developer.mozilla.org/en-US/docs/Web/CSS/-moz-context-properties
We could use this instead of filters to assign opacity and fill colors to our SVGs.
Comment hidden (mozreview-request) |
Comment hidden (mozreview-request) |
Comment 7•7 years ago
|
||
mozreview-review |
Comment on attachment 8907061 [details]
Bug 1399028 - fix assert messages in browser_theme.js test;
https://reviewboard.mozilla.org/r/178782/#review183990
Attachment #8907061 -
Flags: review+
Comment 8•7 years ago
|
||
mozreview-review |
Comment on attachment 8906936 [details]
Bug 1399028 - photon update - devtools icon, tab and accordion colors;
https://reviewboard.mozilla.org/r/178682/#review184022
::: devtools/client/themes/toolbars.css:19
(Diff revision 3)
> - --icon-filter: none;
> - --checked-icon-filter: url(chrome://devtools/skin/images/filters.svg#checked-icon-state);
> -
> --separator-border-image: linear-gradient(transparent 4px, rgba(0,0,0,.1) 4px, rgba(0,0,0,.1) calc(100% - 4px), transparent calc(100% - 4px));
> +
> + --toolbar-selected-color: var(--blue-60);
This should be moved below --searchbox color variables with a new line separating them.
::: devtools/client/themes/toolbars.css:19
(Diff revision 3)
> - --icon-filter: none;
> - --checked-icon-filter: url(chrome://devtools/skin/images/filters.svg#checked-icon-state);
> -
> --separator-border-image: linear-gradient(transparent 4px, rgba(0,0,0,.1) 4px, rgba(0,0,0,.1) calc(100% - 4px), transparent calc(100% - 4px));
> +
> + --toolbar-selected-color: var(--blue-60);
I think we should after all just have these be a theme variables like in revision 2. Since we have --theme-toolbar-color in variables.css, we should also have the --theme-toolbar-selected-color there as well. I realized that I defined --theme-toolbar-color without adding it to the browser_theme.js test.
::: devtools/client/themes/variables.css:24
(Diff revision 3)
> :root.theme-light {
> --theme-body-background: white;
> --theme-sidebar-background: white;
> --theme-contrast-background: #e6b064;
>
> + /* Icon filters */
Let's move these Icon filters after Images. It's current placement hinders the flow of looking at the color variables.
Comment hidden (mozreview-request) |
Comment hidden (mozreview-request) |
Comment 11•7 years ago
|
||
mozreview-review |
Comment on attachment 8906936 [details]
Bug 1399028 - photon update - devtools icon, tab and accordion colors;
https://reviewboard.mozilla.org/r/178682/#review184092
Attachment #8906936 -
Flags: review?(gl) → review+
Comment 12•7 years ago
|
||
Pushed by gabriel.luong@gmail.com:
https://hg.mozilla.org/integration/mozilla-inbound/rev/d7af29b83ac3
photon update - devtools icon, tab and accordion colors;r=gl
https://hg.mozilla.org/integration/mozilla-inbound/rev/c5aedf62e0af
fix assert messages in browser_theme.js test;r=gl
![]() |
||
Comment 13•7 years ago
|
||
bugherder |
https://hg.mozilla.org/mozilla-central/rev/d7af29b83ac3
https://hg.mozilla.org/mozilla-central/rev/c5aedf62e0af
Status: ASSIGNED → RESOLVED
Closed: 7 years ago
status-firefox57:
--- → fixed
Resolution: --- → FIXED
Target Milestone: --- → Firefox 57
Comment 14•7 years ago
|
||
Updated•7 years ago
|
Product: Firefox → DevTools
You need to log in
before you can comment on or make changes to this bug.
Description
•