Bug 1490491 - Part 1: replace alerticon-warning.png with console alert icon; r=pbro,ntim
Differential Revision: https://phabricator.services.mozilla.com/D5952 --HG-- rename : devtools/client/themes/images/webconsole/alert.svg => devtools/client/themes/images/alert.svg extra : moz-landing-system : lando
@ -182,25 +182,23 @@ button {
|
||||
}
|
||||
|
||||
.warning {
|
||||
background-image: url(chrome://devtools/skin/images/alerticon-warning.png);
|
||||
background-size: 13px 12px;
|
||||
display: inline-block;
|
||||
width: 13px;
|
||||
height: 12px;
|
||||
margin-inline-end: 10px;
|
||||
}
|
||||
|
||||
@media (min-resolution: 1.1dppx) {
|
||||
.warning {
|
||||
background-image: url(chrome://devtools/skin/images/alerticon-warning@2x.png);
|
||||
}
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
vertical-align: -2px;
|
||||
margin-inline-end: 6px;
|
||||
background-image: url(chrome://devtools/skin/images/alert.svg);
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
-moz-context-properties: fill;
|
||||
fill: #d7b600;
|
||||
}
|
||||
|
||||
.addons-install-error .warning,
|
||||
.service-worker-multi-process .warning {
|
||||
/* The warning icon can be hard to see on red / yellow backgrounds, this turns the icon
|
||||
to a black icon. */
|
||||
filter: brightness(0%);
|
||||
fill: #0c0c0d;
|
||||
}
|
||||
|
||||
.addons-options {
|
||||
|
@ -106,6 +106,7 @@ devtools.jar:
|
||||
skin/tooltips.css (themes/tooltips.css)
|
||||
skin/images/accessibility.svg (themes/images/accessibility.svg)
|
||||
skin/images/add.svg (themes/images/add.svg)
|
||||
skin/images/alert.svg (themes/images/alert.svg)
|
||||
skin/images/arrowhead-left.svg (themes/images/arrowhead-left.svg)
|
||||
skin/images/arrowhead-down.svg (themes/images/arrowhead-down.svg)
|
||||
skin/images/arrowhead-up.svg (themes/images/arrowhead-up.svg)
|
||||
@ -139,8 +140,6 @@ devtools.jar:
|
||||
skin/images/filetypes/dir-close.svg (themes/images/filetypes/dir-close.svg)
|
||||
skin/images/filetypes/dir-open.svg (themes/images/filetypes/dir-open.svg)
|
||||
skin/images/filetypes/globe.svg (themes/images/filetypes/globe.svg)
|
||||
skin/images/alerticon-warning.png (themes/images/alerticon-warning.png)
|
||||
skin/images/alerticon-warning@2x.png (themes/images/alerticon-warning@2x.png)
|
||||
skin/rules.css (themes/rules.css)
|
||||
skin/images/command-paintflashing.svg (themes/images/command-paintflashing.svg)
|
||||
skin/images/command-screenshot.svg (themes/images/command-screenshot.svg)
|
||||
@ -160,7 +159,6 @@ devtools.jar:
|
||||
skin/images/webconsole/globe.svg (themes/images/webconsole/globe.svg)
|
||||
skin/images/breakpoint.svg (themes/images/breakpoint.svg)
|
||||
skin/webconsole.css (themes/webconsole.css)
|
||||
skin/images/webconsole/alert.svg (themes/images/webconsole/alert.svg)
|
||||
skin/images/webconsole/info.svg (themes/images/webconsole/info.svg)
|
||||
skin/images/webconsole/input.svg (themes/images/webconsole/input.svg)
|
||||
skin/images/webconsole/return.svg (themes/images/webconsole/return.svg)
|
||||
|
@ -378,18 +378,14 @@
|
||||
}
|
||||
|
||||
.network-monitor .security-warning-icon {
|
||||
background-image: url(chrome://devtools/skin/images/alerticon-warning.png);
|
||||
background-size: 13px 12px;
|
||||
margin-inline-start: 5px;
|
||||
vertical-align: top;
|
||||
width: 13px;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
}
|
||||
|
||||
@media (min-resolution: 1.1dppx) {
|
||||
.network-monitor .security-warning-icon {
|
||||
background-image: url(chrome://devtools/skin/images/alerticon-warning@2x.png);
|
||||
}
|
||||
vertical-align: -1px;
|
||||
margin-inline-start: 5px;
|
||||
background-image: url(chrome://devtools/skin/images/alert.svg);
|
||||
background-size: cover;
|
||||
-moz-context-properties: fill;
|
||||
fill: var(--yellow-60);
|
||||
}
|
||||
|
||||
/* Custom request panel */
|
||||
|
@ -37,11 +37,11 @@
|
||||
margin-inline-start: -15px;
|
||||
margin-top: 3px;
|
||||
/* show warning icon */
|
||||
background-image: var(--theme-console-alert-image);
|
||||
background-image: url(chrome://devtools/skin/images/alert.svg);
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
-moz-context-properties: fill;
|
||||
fill: #ec8633;
|
||||
fill: var(--yellow-60);
|
||||
}
|
||||
|
||||
.dbg-breakpoint-line {
|
||||
@ -286,7 +286,7 @@
|
||||
}
|
||||
|
||||
.dbg-expression-arrow {
|
||||
background-image: var(--theme-console-input-image);
|
||||
background-image: url(chrome://devtools/skin/images/webconsole/input.svg);
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
margin: 4px;
|
||||
|
@ -1,4 +1,3 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<!-- This Source Code Form is subject to the terms of the Mozilla Public
|
||||
- License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
|
Before Width: | Height: | Size: 550 B After Width: | Height: | Size: 511 B |
Before Width: | Height: | Size: 541 B |
Before Width: | Height: | Size: 429 B |
@ -1,4 +1,3 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<!-- This Source Code Form is subject to the terms of the Mozilla Public
|
||||
- License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
|
||||
|
Before Width: | Height: | Size: 486 B After Width: | Height: | Size: 447 B |
@ -1,4 +1,3 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<!-- This Source Code Form is subject to the terms of the Mozilla Public
|
||||
- License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
|
||||
|
Before Width: | Height: | Size: 604 B After Width: | Height: | Size: 565 B |
@ -1,4 +1,3 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<!-- This Source Code Form is subject to the terms of the Mozilla Public
|
||||
- License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
|
||||
|
Before Width: | Height: | Size: 508 B After Width: | Height: | Size: 469 B |
@ -83,7 +83,7 @@
|
||||
height: 12px;
|
||||
max-height: 12px;
|
||||
margin-inline-end: 5px;
|
||||
background-image: var(--theme-console-info-image);
|
||||
background-image: url(chrome://devtools/skin/images/webconsole/info.svg);
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
-moz-context-properties: fill;
|
||||
@ -91,8 +91,8 @@
|
||||
}
|
||||
|
||||
.opt-icon.warning::before {
|
||||
background-image: var(--theme-console-alert-image);
|
||||
fill: #ec8633;
|
||||
background-image: url(chrome://devtools/skin/images/alert.svg);
|
||||
fill: var(--yellow-60);
|
||||
}
|
||||
|
||||
/* Frame Component */
|
||||
|
@ -562,11 +562,11 @@ html, body, #app, #memory-tool {
|
||||
height: 12px;
|
||||
max-height: 12px;
|
||||
margin-inline-end: 5px;
|
||||
background-image: var(--theme-console-alert-image);
|
||||
background-image: url(chrome://devtools/skin/images/alert.svg);
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
-moz-context-properties: fill;
|
||||
fill: #ec8633;
|
||||
fill: var(--yellow-60);
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -767,7 +767,7 @@ menuitem.experimental-option::before {
|
||||
max-height: 12px;
|
||||
margin-top: 2px;
|
||||
margin-inline-end: 5px;
|
||||
background-image: var(--theme-console-alert-image);
|
||||
background-image: url(chrome://devtools/skin/images/alert.svg);
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
-moz-context-properties: fill;
|
||||
|
@ -323,18 +323,14 @@
|
||||
}
|
||||
|
||||
.ruleview-warning {
|
||||
background-image: url(images/alerticon-warning.png);
|
||||
background-size: 13px 12px;
|
||||
margin-inline-start: 5px;
|
||||
display: inline-block;
|
||||
width: 13px;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
}
|
||||
|
||||
@media (min-resolution: 1.1dppx) {
|
||||
.ruleview-warning {
|
||||
background-image: url(images/alerticon-warning@2x.png);
|
||||
}
|
||||
margin-inline-start: 5px;
|
||||
background-image: url(chrome://devtools/skin/images/alert.svg);
|
||||
background-size: cover;
|
||||
-moz-context-properties: fill;
|
||||
fill: var(--yellow-60);
|
||||
}
|
||||
|
||||
.ruleview-rule:not(:hover) .ruleview-enableproperty {
|
||||
|
@ -217,12 +217,6 @@
|
||||
--select-arrow-image: url(chrome://devtools/skin/images/select-arrow.svg);
|
||||
--theme-pane-collapse-image: url(chrome://devtools/skin/images/pane-collapse.svg);
|
||||
--theme-pane-expand-image: url(chrome://devtools/skin/images/pane-expand.svg);
|
||||
--theme-console-alert-image: url(chrome://devtools/skin/images/webconsole/alert.svg);
|
||||
--theme-console-navigation-image: url(chrome://devtools/skin/images/webconsole/globe.svg);
|
||||
--theme-console-info-image: url(chrome://devtools/skin/images/webconsole/info.svg);
|
||||
--theme-console-input-image: url(chrome://devtools/skin/images/webconsole/input.svg);
|
||||
--theme-console-return-image: url(chrome://devtools/skin/images/webconsole/return.svg);
|
||||
--theme-console-jump-image: url(chrome://devtools/skin/images/webconsole/jump.svg);
|
||||
|
||||
/* Firefox Colors CSS Variables v1.0.3
|
||||
* Colors are taken from: https://github.com/FirefoxUX/design-tokens
|
||||
|
@ -124,8 +124,10 @@ text {
|
||||
}
|
||||
|
||||
.web-audio-inspector .error {
|
||||
background-image: url(images/alerticon-warning.png);
|
||||
background-size: 13px 12px;
|
||||
background-image: url(chrome://devtools/skin/images/alert.svg);
|
||||
background-size: 12px 12px;
|
||||
-moz-context-properties: fill;
|
||||
fill: var(--yellow-60);
|
||||
-moz-appearance: none;
|
||||
opacity: 0;
|
||||
transition: opacity .5s ease-out 0s;
|
||||
@ -161,12 +163,6 @@ text {
|
||||
-moz-box-flex: 1;
|
||||
}
|
||||
|
||||
@media (min-resolution: 1.1dppx) {
|
||||
.web-audio-inspector .error {
|
||||
background-image: url(images/alerticon-warning@2x.png);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Inspector toolbar
|
||||
*/
|
||||
|
@ -188,37 +188,36 @@ a {
|
||||
|
||||
.message.command > .icon {
|
||||
color: var(--console-output-icon-input);
|
||||
background-image: var(--theme-console-input-image);
|
||||
background-image: url(chrome://devtools/skin/images/webconsole/input.svg);
|
||||
}
|
||||
|
||||
.message.result > .icon {
|
||||
color: var(--console-output-icon-info);
|
||||
background-image: var(--theme-console-return-image);
|
||||
background-image: url(chrome://devtools/skin/images/webconsole/return.svg);
|
||||
}
|
||||
|
||||
.message.info > .icon {
|
||||
color: var(--console-output-icon-info);
|
||||
background-image: var(--theme-console-info-image);
|
||||
background-image: url(chrome://devtools/skin/images/webconsole/info.svg);
|
||||
}
|
||||
|
||||
.message.error > .icon {
|
||||
color: var(--console-output-icon-error);
|
||||
background-image: var(--theme-console-alert-image);
|
||||
background-image: url(chrome://devtools/skin/images/alert.svg);
|
||||
}
|
||||
|
||||
.message.warn > .icon {
|
||||
color: var(--console-output-icon-warning);
|
||||
background-image: var(--theme-console-alert-image);
|
||||
background-image: url(chrome://devtools/skin/images/alert.svg);
|
||||
}
|
||||
|
||||
.message.navigationMarker > .icon {
|
||||
color: var(--object-color);
|
||||
background-image: var(--theme-console-navigation-image);
|
||||
background-image: url(chrome://devtools/skin/images/webconsole/globe.svg);
|
||||
}
|
||||
|
||||
|
||||
.message:hover > .icon.rewindable {
|
||||
background-image:var(--theme-console-jump-image);
|
||||
background-image: url(chrome://devtools/skin/images/webconsole/jump.svg);
|
||||
background-size: 14px 14px;
|
||||
cursor: pointer;
|
||||
}
|
||||
@ -382,7 +381,7 @@ html #webconsole-notificationbox {
|
||||
min-height: 100%;
|
||||
color: var(--theme-content-color1);
|
||||
/* input icon */
|
||||
background-image: var(--theme-console-input-image);
|
||||
background-image: url(chrome://devtools/skin/images/webconsole/input.svg);
|
||||
background-position-x: calc(10px + var(--console-icon-horizontal-offset));
|
||||
background-position-y: 7px;
|
||||
background-repeat: no-repeat;
|
||||
@ -437,7 +436,7 @@ textarea.jsterm-input-node:focus {
|
||||
/* aim for a 32px left space (a descendent has 4px padding) */
|
||||
padding-inline-start: calc(var(--console-inline-start-gutter) - 4px);
|
||||
/* input icon */
|
||||
background-image: var(--theme-console-input-image);
|
||||
background-image: url(chrome://devtools/skin/images/webconsole/input.svg);
|
||||
background-position-x: calc(10px + var(--console-icon-horizontal-offset));
|
||||
background-position-y: 5px;
|
||||
background-repeat: no-repeat;
|
||||
|