X-Git-Url: https://git-public.kairo.at/?p=themes.git;a=blobdiff_plain;f=LCARStrek%2Fdevtools%2Fdark-theme.css;h=956270f7a2d96f871d92cb82568d87cfd138b373;hp=818ce158acfbf71b39a506cc341691912ab32038;hb=f36031bd6c6a251a541cdf42956f5199adcd9cb8;hpb=85b6b932acaea413bd82e7db99fe1352ba36664f diff --git a/LCARStrek/devtools/dark-theme.css b/LCARStrek/devtools/dark-theme.css index 818ce158..956270f7 100644 --- a/LCARStrek/devtools/dark-theme.css +++ b/LCARStrek/devtools/dark-theme.css @@ -3,6 +3,8 @@ * 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/. */ +@import url(common.css); + /* Colors are taken from: * https://developer.mozilla.org/en-US/docs/Tools/DevToolsColors. * Changes should be kept in sync with commandline.css and commandline.inc.css. @@ -14,7 +16,7 @@ --theme-contrast-border: #A09090; --theme-contrast-background2: #795900; -/* --theme-tab-toolbar-background: #.252c33; */ + --theme-tab-toolbar-background: #402800; --theme-toolbar-background: #000000; --theme-hover-background: #FFCF00; --theme-hover-color: #000000; @@ -255,7 +257,8 @@ body, html { * Best effort to match the existing theme, some of the colors * are duplicated here to prevent weirdness in the main theme. */ -.CodeMirror { /* Inherit platform specific font sizing and styles */ +.CodeMirror, +.CodeMirror.cm-s-mozilla { /* Inherit platform specific font sizing and styles */ font-family: inherit; font-size: inherit; background: transparent; @@ -618,9 +621,9 @@ div.CodeMirror span.eval-text { border: 0 solid var(--theme-splitter-color); background: var(--theme-toolbar-background); color: var(--theme-body-color); - margin: 0; - padding: 0; - min-width: 32px; + margin: 0 1px; + padding: 0 6px; + min-width: 16px; min-height: 18px; /* The icon is absolutely positioned in the button using ::before */ position: relative; @@ -671,6 +674,18 @@ div.CodeMirror span.eval-text { } } +:root { + --clear-icon-url: url("chrome://devtools/skin/images/clear.svg"); +} + +.devtools-button.devtools-clear-icon::before { + background-image: var(--clear-icon-url); +} + +.devtools-toolbarbutton.devtools-clear-icon { + list-style-image: var(--clear-icon-url); +} + /* Text input */ .devtools-textinput, @@ -800,6 +815,10 @@ div.CodeMirror span.eval-text { display: none; } +#toolbox-close::before { + background-image: url("chrome://devtools/skin/close@2x.png"); +} + /* In-tools sidebar */ .devtools-sidebar-tabs { @@ -902,14 +921,17 @@ div.CodeMirror span.eval-text { background-position: -16px center; } +#toolbox-dock-bottom::before, #toolbox-dock-bottom > image { background-image: url("chrome://devtools/skin/dock-bottom@2x.png"); } +#toolbox-dock-side::before, #toolbox-dock-side > image { background-image: url("chrome://devtools/skin/dock-side@2x.png"); } +#toolbox-dock-window::before, #toolbox-dock-window > image { background-image: url("chrome://devtools/skin/undock@2x.png"); } @@ -950,6 +972,7 @@ div.CodeMirror span.eval-text { #toolbox-controls-separator { margin: 0; + width: 1px; } /* Command buttons */ @@ -964,6 +987,9 @@ div.CodeMirror span.eval-text { .command-button:hover:active { } +#toolbox-close::before, +.toolbox-dock-button::before, +.command-button::before, .command-button > image { width: 16px; height: 16px; @@ -972,6 +998,14 @@ div.CodeMirror span.eval-text { background-repeat: no-repeat; } +#toolbox-close:hover::before, +#toolbox-close:hover:active::before, +.toolbox-dock-button:hover::before, +.toolbox-dock-button:hover:active::before, +.command-button:hover::before, +.command-button:hover:active::before, +.command-button[checked=true]::before, +.command-button[open=true]::before, .command-button:hover > image, .command-button:hover:active > image, .command-button[checked=true] > image, @@ -979,46 +1013,57 @@ div.CodeMirror span.eval-text { background-position: -16px center; } +#command-button-paintflashing::before, #command-button-paintflashing > image { background-image: url("chrome://devtools/skin/command-paintflashing.png"); } +#command-button-screenshot::before, #command-button-screenshot > image { background-image: url("chrome://devtools/skin/command-screenshot.png"); } +#command-button-responsive::before, #command-button-responsive > image { background-image: url("chrome://devtools/skin/command-responsivemode.png"); } +#command-button-tilt::before, #command-button-tilt > image { background-image: url("chrome://devtools/skin/command-tilt.png"); } +#command-button-scratchpad::before, #command-button-scratchpad > image { background-image: url("chrome://devtools/skin/command-scratchpad.png"); } +#command-button-pick::before, #command-button-pick > image { background-image: url("chrome://devtools/skin/command-pick.png"); } +#command-button-frames::before, #command-button-frames > image { background-image: url("chrome://devtools/skin/command-frames.png"); } +#command-button-splitconsole::before, #command-button-splitconsole > image { background-image: url("chrome://devtools/skin/command-console.png"); } +#command-button-eyedropper::before, #command-button-eyedropper > image { background-image: url("chrome://devtools/skin/command-eyedropper.png"); } +#command-button-rulers::before, #command-button-rulers > image { background-image: url("chrome://devtools/skin/command-rulers.png"); } +#command-button-measure::before, #command-button-measure > image { background-image: url("chrome://devtools/skin/images/command-measure.png"); } @@ -1075,8 +1120,9 @@ div.CodeMirror span.eval-text { } #toolbox-tabs { - margin: 0 2px; - -moz-padding-start: 3px; + padding-inline-start: 3px; + margin-inline-start: 2px; /* this is only needed for the old button design */ + margin-inline-end: 3px; /* this is for the new ::before-based button design */ background-color: #000000; color: #FFCF00; } @@ -1087,6 +1133,7 @@ div.CodeMirror span.eval-text { visibility: collapse; } +#toolbox-deck[selectedIndex] > .toolbox-panel, /* workaround for Firefox 47 and older */ .toolbox-panel[selected] { visibility: visible; } @@ -1138,9 +1185,14 @@ div.CodeMirror span.eval-text { -moz-margin-start: 0; } +#toolbox-picker-container { + margin-inline-start: 1px; +} + #toolbox-option-container { background-color: #000000; - -moz-padding-start: 3px; + padding-inline-start: 3px; + margin-inline-end: 1px; } #toolbox-tab-options {