зеркало из https://github.com/mozilla/gecko-dev.git
Bug 1507632 - Use Photon colors for console icons; r=nchevobbe
Differential Revision: https://phabricator.services.mozilla.com/D12068 --HG-- extra : moz-landing-system : lando
This commit is contained in:
Florens Verschelde
Родитель
c545e40742
Коммит
86e747a2ad
|
|
@ -237,6 +237,7 @@
|
|||
--purple-50: #9400ff;
|
||||
--purple-60: #8000d7;
|
||||
|
||||
--blue-30: #75baff;
|
||||
--blue-40: #45a1ff;
|
||||
--blue-50: #0a84ff;
|
||||
--blue-55: #0074e8;
|
||||
|
|
@ -247,6 +248,7 @@
|
|||
--teal-70: #008ea4;
|
||||
|
||||
--red-20: #ffb3d2;
|
||||
--red-40: #ff3b6b;
|
||||
--red-50: #ff0039;
|
||||
--red-60: #d70022;
|
||||
--red-70: #a4000f;
|
||||
|
|
@ -257,6 +259,7 @@
|
|||
|
||||
--yellow-50: #ffe900;
|
||||
--yellow-60: #d7b600;
|
||||
--yellow-65: #be9b00;
|
||||
--yellow-80: #715100;
|
||||
|
||||
--grey-10: #f9f9fa;
|
||||
|
|
|
|||
|
|
@ -18,15 +18,15 @@
|
|||
}
|
||||
|
||||
.theme-dark {
|
||||
--console-input-icon-color: hsl(0, 0%, 50%, 0.5);
|
||||
--console-input-icon-focused: hsl(210, 100%, 73%);
|
||||
--console-output-icon-info: hsl(210, 6%, 52%);
|
||||
--console-output-icon-input: hsl(210, 6%, 76%);
|
||||
--console-output-icon-error: hsl(0, 100%, 65%);
|
||||
--console-output-icon-warning: hsl(36, 100%, 60%);
|
||||
--console-input-icon-color: var(--grey-60);
|
||||
--console-input-icon-focused: var(--blue-30);
|
||||
--console-output-icon-medium-color: var(--grey-50);
|
||||
--console-output-icon-strong-color: var(--grey-30);
|
||||
--console-output-icon-error-color: var(--red-40);
|
||||
--console-output-icon-warning-color: var(--yellow-60);
|
||||
--console-output-indent-border-color: var(--theme-highlight-blue);
|
||||
--error-color: var(--red-20);
|
||||
--error-background-color: hsl(352, 79%, 62%, 0.17);
|
||||
--error-background-color: hsl(345, 23%, 24%);
|
||||
--warning-color: hsl(43, 94%, 81%);
|
||||
--warning-background-color: hsl(42, 37%, 19%);
|
||||
--console-output-color: white;
|
||||
|
|
@ -34,12 +34,12 @@
|
|||
}
|
||||
|
||||
.theme-light {
|
||||
--console-input-icon-color: hsl(210, 6%, 75%);
|
||||
--console-input-icon-focused: hsl(210, 100%, 44%);
|
||||
--console-output-icon-info: hsl(210, 6%, 67%);
|
||||
--console-output-icon-input: hsl(210, 0%, 34%);
|
||||
--console-output-icon-error: hsl(0, 90%, 45%);
|
||||
--console-output-icon-warning: hsl(36, 100%, 45%);
|
||||
--console-input-icon-color: var(--grey-40);
|
||||
--console-input-icon-focused: var(--blue-55);
|
||||
--console-output-icon-medium-color: var(--grey-40);
|
||||
--console-output-icon-strong-color: var(--grey-60);
|
||||
--console-output-icon-error-color: var(--red-60);
|
||||
--console-output-icon-warning-color: var(--yellow-65);
|
||||
--console-output-indent-border-color: var(--theme-highlight-blue);
|
||||
--error-color: var(--red-70);
|
||||
--error-background-color: hsl(344, 73%, 97%);
|
||||
|
|
@ -185,27 +185,27 @@ a {
|
|||
}
|
||||
|
||||
.message.command > .icon {
|
||||
color: var(--console-output-icon-input);
|
||||
color: var(--console-output-icon-strong-color);
|
||||
background-image: url(chrome://devtools/skin/images/webconsole/input.svg);
|
||||
}
|
||||
|
||||
.message.result > .icon {
|
||||
color: var(--console-output-icon-info);
|
||||
color: var(--console-output-icon-medium-color);
|
||||
background-image: url(chrome://devtools/skin/images/webconsole/return.svg);
|
||||
}
|
||||
|
||||
.message.info > .icon {
|
||||
color: var(--console-output-icon-info);
|
||||
color: var(--console-output-icon-medium-color);
|
||||
background-image: url(chrome://devtools/skin/images/webconsole/info.svg);
|
||||
}
|
||||
|
||||
.message.error > .icon {
|
||||
color: var(--console-output-icon-error);
|
||||
color: var(--console-output-icon-error-color);
|
||||
background-image: url(chrome://devtools/skin/images/alert.svg);
|
||||
}
|
||||
|
||||
.message.warn > .icon {
|
||||
color: var(--console-output-icon-warning);
|
||||
color: var(--console-output-icon-warning-color);
|
||||
background-image: url(chrome://devtools/skin/images/alert.svg);
|
||||
}
|
||||
|
||||
|
|
@ -651,36 +651,31 @@ a.learn-more-link.webconsole-learn-more-link {
|
|||
margin-inline-start: 0.5em;
|
||||
}
|
||||
|
||||
/* Special casing String reps so they are legible */
|
||||
.webconsole-output-wrapper .message .message-body > .objectBox-string {
|
||||
color: currentColor;
|
||||
}
|
||||
|
||||
/* Special casing warning and error string colors so they are legible */
|
||||
.theme-dark .message.error .objectBox-string,
|
||||
.theme-light .message.error .objectBox-string,
|
||||
.theme-dark .message.warn .objectBox-string,
|
||||
.theme-light .message.warn .objectBox-string {
|
||||
color: var(--error-color);
|
||||
/* Special casing String reps, and warning/error string colors
|
||||
* so they are legible */
|
||||
.message .message-body > .objectBox-string,
|
||||
.message.error .objectBox-string,
|
||||
.message.warn .objectBox-string {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
/* Special casing dark-theme error and warning ObjectInspector colors */
|
||||
.theme-dark .webconsole-output-wrapper .message.error .tree.object-inspector .object-label,
|
||||
.theme-dark .webconsole-output-wrapper .message.error .tree.object-inspector .object-label *,
|
||||
.theme-dark .webconsole-output-wrapper .message.warn .tree.object-inspector .object-label,
|
||||
.theme-dark .webconsole-output-wrapper .message.warn .tree.object-inspector .object-label *,
|
||||
.theme-dark .webconsole-output-wrapper .message.error .objectLeftBrace,
|
||||
.theme-dark .webconsole-output-wrapper .message.error .objectRightBrace,
|
||||
.theme-dark .webconsole-output-wrapper .message.error .arrayLeftBracket,
|
||||
.theme-dark .webconsole-output-wrapper .message.error .arrayRightBracket,
|
||||
.theme-dark .webconsole-output-wrapper .message.warn .objectLeftBrace,
|
||||
.theme-dark .webconsole-output-wrapper .message.warn .objectRightBrace,
|
||||
.theme-dark .webconsole-output-wrapper .message.warn .arrayLeftBracket,
|
||||
.theme-dark .webconsole-output-wrapper .message.warn .arrayRightBracket {
|
||||
.theme-dark .message.error .tree.object-inspector .object-label,
|
||||
.theme-dark .message.error .tree.object-inspector .object-label *,
|
||||
.theme-dark .message.warn .tree.object-inspector .object-label,
|
||||
.theme-dark .message.warn .tree.object-inspector .object-label *,
|
||||
.theme-dark .message.error .objectLeftBrace,
|
||||
.theme-dark .message.error .objectRightBrace,
|
||||
.theme-dark .message.error .arrayLeftBracket,
|
||||
.theme-dark .message.error .arrayRightBracket,
|
||||
.theme-dark .message.warn .objectLeftBrace,
|
||||
.theme-dark .message.warn .objectRightBrace,
|
||||
.theme-dark .message.warn .arrayLeftBracket,
|
||||
.theme-dark .message.warn .arrayRightBracket {
|
||||
color: var(--theme-body-color);
|
||||
}
|
||||
.theme-dark .webconsole-output-wrapper .message.error .tree.object-inspector,
|
||||
.theme-dark .webconsole-output-wrapper .message.warn .tree.object-inspector {
|
||||
.theme-dark .message.error .tree.object-inspector,
|
||||
.theme-dark .message.warn .tree.object-inspector {
|
||||
--console-output-indent-border-color: var(--theme-body-color);
|
||||
}
|
||||
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче