X-Git-Url: https://git-public.kairo.at/?p=themes.git;a=blobdiff_plain;f=LCARStrek%2Fbrowser%2Fdevtools%2Fwebconsole.css;h=84012a0537edbb4e4ee3070547edd5b2f1fb27bd;hp=dfd389714be60156471ee3356b81a9fd19950ac4;hb=2b5a514788884f7527ad59c3381c75a71d4dbeea;hpb=589b5528220a57ff70809bd8ef0eeaf51a0c8b2f diff --git a/LCARStrek/browser/devtools/webconsole.css b/LCARStrek/browser/devtools/webconsole.css index dfd38971..84012a05 100644 --- a/LCARStrek/browser/devtools/webconsole.css +++ b/LCARStrek/browser/devtools/webconsole.css @@ -49,16 +49,30 @@ a { } .message > .icon { - background: -moz-image-rect(url("chrome://browser/skin/devtools/webconsole.png"), 0, 1, 0, 0) no-repeat; - background-position: center; flex: 0 0 auto; margin: 3px 6px 0 0; padding: 0 4px; - width: 8px; height: 1em; align-self: flex-start; } +.message > .icon::before { + content: ""; + background-image: url("chrome://browser/skin/devtools/webconsole.png"); + background-position: 8px 8px; + background-repeat: no-repeat; + background-size: 48px 40px; + width: 8px; + height: 8px; + display: inline-block; +} + +@media (min-resolution: 2dppx) { + .message > .icon::before { + background-image: url("chrome://browser/skin/devtools/webconsole@2x.png"); + } +} + .message > .message-body-wrapper { flex: 1 1 100%; margin: 3px; @@ -185,10 +199,6 @@ a { -moz-user-focus: normal; } -.webconsole-filter-button[checked] { - /* color: white !important; */ -} - .webconsole-filter-button > .toolbarbutton-menubutton-button:before { content: ""; display: inline-block; @@ -227,8 +237,8 @@ a { -moz-border-end: solid #FF0000 6px; } -.message[category=network][severity=error] > .icon { - background-image: -moz-image-rect(url("chrome://browser/skin/devtools/webconsole.png"), 0, 16, 8, 8); +.message[category=network][severity=error] > .icon::before { + background-position: -8px 0; } .message[category=network] > .message-body { @@ -273,12 +283,12 @@ a { -moz-border-end: solid #9C9CFF 6px; } -.message[category=cssparser][severity=error] > .icon { - background-image: -moz-image-rect(url("chrome://browser/skin/devtools/webconsole.png"), 8, 16, 16, 8); +.message[category=cssparser][severity=error] > .icon::before { + background-position: -8px -8px; } -.message[category=cssparser][severity=warn] > .icon { - background-image: -moz-image-rect(url("chrome://browser/skin/devtools/webconsole.png"), 8, 24, 16, 16); +.message[category=cssparser][severity=warn] > .icon::before { + background-position: -16px -8px; } /* JS styles */ @@ -291,12 +301,12 @@ a { -moz-border-end: solid #FF9F00 6px; } -.message[category=exception][severity=error] > .icon { - background-image: -moz-image-rect(url("chrome://browser/skin/devtools/webconsole.png"), 16, 16, 24, 8); +.message[category=exception][severity=error] > .icon::before { + background-position: -8px -16px; } -.message[category=exception][severity=warn] > .icon { - background-image: -moz-image-rect(url("chrome://browser/skin/devtools/webconsole.png"), 16, 24, 24, 16); +.message[category=exception][severity=warn] > .icon::before { + background-position: -16px -16px; } /* Web Developer styles */ @@ -309,17 +319,17 @@ a { -moz-border-end: solid #8050B0 6px; } -.message[category=console][severity=error] > .icon, -.message[category=output][severity=error] > .icon { - background-image: -moz-image-rect(url("chrome://browser/skin/devtools/webconsole.png"), 24, 16, 32, 8); +.message[category=console][severity=error] > .icon::before, +.message[category=output][severity=error] > .icon::before { + background-position: -8px -24px; } -.message[category=console][severity=warn] > .icon { - background-image: -moz-image-rect(url("chrome://browser/skin/devtools/webconsole.png"), 24, 24, 32, 16); +.message[category=console][severity=warn] > .icon::before { + background-position: -16px -24px; } -.message[category=console][severity=info] > .icon { - background-image: -moz-image-rect(url("chrome://browser/skin/devtools/webconsole.png"), 24, 32, 32, 24); +.message[category=console][severity=info] > .icon::before { + background-position: -24px -24px; } /* Input and output styles */ @@ -328,12 +338,12 @@ a { -moz-border-end: solid #A09090 6px; } -.message[category=input] > .icon { - background-image: -moz-image-rect(url("chrome://browser/skin/devtools/webconsole.png"), 24, 40, 32, 32); +.message[category=input] > .icon::before { + background-position: -32px -24px; } -.message[category=output] > .icon { - background-image: -moz-image-rect(url("chrome://browser/skin/devtools/webconsole.png"), 24, 48, 32, 40); +.message[category=output] > .icon::before { + background-position: -40px -24px; } /* JSTerm Styles */ @@ -346,7 +356,15 @@ a { } .jsterm-input-node { - background: -moz-image-rect(url("chrome://browser/skin/devtools/commandline-icon.png"), 0, 32, 16, 16) no-repeat; + background-image: -moz-image-rect(url("chrome://browser/skin/devtools/commandline-icon.png"), 0, 32, 16, 16); + background-repeat: no-repeat; + background-size: 16px 16px; +} + +@media (min-resolution: 2dppx) { + .jsterm-input-node { + background-image: -moz-image-rect(url('chrome://browser/skin/devtools/commandline-icon@2x.png'), 0, 64, 32, 32); + } } :-moz-any(.jsterm-input-node, @@ -389,12 +407,12 @@ a { border-color: #FFCF00; } -.message[category=security][severity=error] > .icon { - background-image: -moz-image-rect(url("chrome://browser/skin/devtools/webconsole.png"), 32, 16, 40, 8); +.message[category=security][severity=error] > .icon::before { + background-position: -8px -32px; } -.message[category=security][severity=warn] > .icon { - background-image: -moz-image-rect(url("chrome://browser/skin/devtools/webconsole.png"), 32, 24, 40, 16); +.message[category=security][severity=warn] > .icon::before { + background-position: -16px -32px; } .navigation-marker { @@ -473,53 +491,28 @@ a { } /* Replace these values with CSS variables as available */ -.theme-dark .jsterm-input-container { - background-color: #000000; /* tabToolbarBackgroundColor */ - border-color: #9C9CFF; /* mainBackgroundColor */ -} - -.theme-dark .jsterm-input-node { - color: #E7ADE7; /* textColor */ -} - -.theme-dark .jsterm-complete-node { - color: #A09090; /* commentColor */ -} - -.theme-dark .navigation-marker .url { - background: #000000; /* mainBackgroundColor */ -} - -.theme-dark .inlined-variables-view iframe { - border-color: #A09090; -} - -.theme-dark .stacktrace { - border-color: #A09090; -} - -.theme-light .jsterm-input-container { +.jsterm-input-container { background-color: #000000; /* tabToolbarBackgroundColor */ border-color: #9C9CFF; /* mainBackgroundColor */ } -.theme-light .jsterm-input-node { +.jsterm-input-node { color: #E7ADE7; /* textColor */ } -.theme-light .jsterm-complete-node { +.jsterm-complete-node { color: #A09090; /* commentColor */ } -.theme-light .navigation-marker .url { +.navigation-marker .url { background: #000000; /* mainBackgroundColor */ } -.theme-light .inlined-variables-view iframe { +.inlined-variables-view iframe { border-color: #A09090; } -.theme-dark .stacktrace { +.stacktrace { border-color: #A09090; } @@ -527,7 +520,7 @@ a { .message > .timestamp { display: none; } - .toolbarbutton-text { + .hud-console-filter-toolbar .webconsole-filter-button .toolbarbutton-text { display: none; } .hud-console-filter-toolbar .webconsole-filter-button { @@ -537,8 +530,8 @@ a { min-width: 25px; } .webconsole-filter-button > .toolbarbutton-menubutton-button:before { - width: 16px; - height: 16px; + width: 12px; + height: 12x; margin-left: 1px; } .toolbarbutton-menubutton-dropmarker {