X-Git-Url: https://git-public.kairo.at/?p=themes.git;a=blobdiff_plain;f=LCARStrek%2Fbrowser%2Fdevtools%2Fdark-theme.css;h=acb0cb5269bffc6405ca413d98917b6d4eaeab5e;hp=0d34733637be4fb911d9cd5a47e5b89f701e44d0;hb=368d0b7ff30fae6bb74e895e6fb8d1a182a1cb1c;hpb=6f5a7408a1bd6d680d581fdf88469481da91aa72 diff --git a/LCARStrek/browser/devtools/dark-theme.css b/LCARStrek/browser/devtools/dark-theme.css index 0d347336..acb0cb52 100644 --- a/LCARStrek/browser/devtools/dark-theme.css +++ b/LCARStrek/browser/devtools/dark-theme.css @@ -17,10 +17,13 @@ --theme-toolbar-background: #000000; --theme-hover-background: #FFCF00; --theme-hover-color: #000000; + --theme-active-background: #FFCF00; + --theme-active-color: #000000; --theme-selection-background: #008484; --theme-selection-color: #000000; --theme-selection-background2: #004242; --theme-selection-color2: #FF9F00; + --theme-selection-background-semitransparent: rgba(0, 132, 132, .5); --theme-splitter-color: #9C9CFF; --theme-comment: #A09090; @@ -63,7 +66,7 @@ } .theme-bg-darker { - background-color: rgba(0,0,0,0.5); + background: var(--theme-selection-background-semitransparent); } .theme-selected, @@ -203,7 +206,8 @@ .theme-toolbar, .devtools-toolbar, -.devtools-sidebar-tabs > tabs, +.devtools-sidebar-tabs tabs, +.devtools-sidebar-alltabs, .CodeMirror-dialog { /* General toolbar styling */ /* color: var(--theme-body-color-alt); background-color: var(--theme-toolbar-background);*/ @@ -401,15 +405,6 @@ div.CodeMirror span.eval-text { border-bottom: 0; } -.devtools-horizontal-splitter { -/* border-bottom: 1px solid var(--theme-splitter-color); */ -} - -.devtools-side-splitter { -/* -moz-border-end: 1px solid var(--theme-splitter-color); - border-color: var(--theme-splitter-color); / Needed for responsive container at low width. */ -} - .devtools-textinput, .devtools-searchinput { background-color: #000000; @@ -430,7 +425,8 @@ div.CodeMirror span.eval-text { /* Toolbars */ .devtools-toolbar, -.devtools-sidebar-tabs > tabs { +.devtools-sidebar-tabs tabs, +.devtools-sidebar-alltabs { } .devtools-toolbar { @@ -489,6 +485,7 @@ div.CodeMirror span.eval-text { } .devtools-toolbar .devtools-toolbarbutton { + -moz-margin-start: 2px; } .devtools-toolbarbutton > .toolbarbutton-icon { @@ -522,15 +519,15 @@ div.CodeMirror span.eval-text { } /* Button States */ -.devtools-toolbarbutton:hover, -#toolbox-buttons .devtools-toolbarbutton[text-as-image]:hover, -.devtools-toolbarbutton[label]:not([text-as-image]):not([type=menu-button]):hover { +.devtools-toolbarbutton:not([disabled]):hover, +#toolbox-buttons .devtools-toolbarbutton:not([disabled])[text-as-image]:hover, +.devtools-toolbarbutton:not([disabled])[label]:not([text-as-image]):not([type=menu-button]):hover { /* background: rgba(0, 0, 0, .3); / Splitters */ } -.devtools-toolbarbutton:hover:active, -#toolbox-buttons .devtools-toolbarbutton[text-as-image]:hover:active, -.devtools-toolbarbutton[label]:not([text-as-image]):not([type=menu-button]):hover:active { +.devtools-toolbarbutton:not([disabled]):hover:active, +#toolbox-buttons .devtools-toolbarbutton:not([disabled])[text-as-image]:hover:active, +.devtools-toolbarbutton:not([disabled])[label]:not([text-as-image]):not([type=menu-button]):hover:active { /* background: rgba(0, 0, 0, .4); / Splitters */ } @@ -579,6 +576,59 @@ div.CodeMirror span.eval-text { .devtools-separator + .devtools-toolbarbutton { } +/* HTML buttons, similar to toolbar buttons, but work in HTML documents */ + +.devtools-button { + border: 0 solid var(--theme-splitter-color); + background: var(--theme-toolbar-background); + margin: 0; + padding: 0; + min-width: 32px; + min-height: 18px; + /* The icon is absolutely positioned in the button using ::before */ + position: relative; +} + +.devtools-button[standalone] { + min-height: 32px; + border-width: 1px; +} + +/* Button States */ +.devtools-button:not([disabled]):hover { + background: var(--theme-hover-background); + color: var(--theme-hover-color); +} + +.devtools-button:not([disabled]):hover:active { + background: var(--theme-active-background); + color: var(--theme-active-color); +} + +/* Menu type buttons and checked states */ +.devtools-button[checked] { + background: var(--theme-selection-background); + color: var(--theme-selection-color); +} + +.devtools-button::before { + content: ""; + display: block; + width: 16px; + height: 16px; + position: absolute; + left: 50%; + top: 50%; + margin: -8px 0 0 -8px; + background-repeat: no-repeat; +} + +@media (min-resolution: 2dppx) { + .devtools-button::before { + background-size: 32px; + } +} + /* Text input */ .devtools-textinput, @@ -660,17 +710,28 @@ div.CodeMirror span.eval-text { border: 0; } -.devtools-sidebar-tabs > tabs { +.devtools-sidebar-tabs tabs { position: static; overflow: hidden; } -.devtools-sidebar-tabs > tabs > .tabs-right, -.devtools-sidebar-tabs > tabs > .tabs-left { +.devtools-sidebar-alltabs { +/* margin: 0; + border-width: 0 0 1px 0; + -moz-border-start-width: 1px; + border-style: solid;*/ +} + +.devtools-sidebar-alltabs dropmarker { display: none; } -.devtools-sidebar-tabs > tabs > tab { +.devtools-sidebar-tabs tabs > .tabs-right, +.devtools-sidebar-tabs tabs > .tabs-left { + display: none; +} + +.devtools-sidebar-tabs tabs > tab { min-width: 78px; text-align: center; -moz-box-flex: 1; @@ -678,34 +739,34 @@ div.CodeMirror span.eval-text { margin-top: 0; } -.devtools-sidebar-tabs > tabs > tab:-moz-focusring { +.devtools-sidebar-tabs tabs > tab:-moz-focusring { position: static; } -.devtools-sidebar-tabs > tabs > tab:last-of-type { +.devtools-sidebar-tabs tabs > tab:last-of-type { -moz-border-end-width: 0; } -.devtools-sidebar-tabs > tabs > tab:first-child { +.devtools-sidebar-tabs tabs > tab:first-child { } -.devtools-sidebar-tabs > tabs > tab:hover { +.devtools-sidebar-tabs tabs > tab:hover { } -.devtools-sidebar-tabs > tabs > tab:hover:active { +.devtools-sidebar-tabs tabs > tab:hover:active { } -.devtools-sidebar-tabs > tabs > tab[selected] + tab { +.devtools-sidebar-tabs tabs > tab[selected] + tab { } -.devtools-sidebar-tabs > tabs > tab[selected] + tab:hover { +.devtools-sidebar-tabs tabs > tab[selected] + tab:hover { } -.devtools-sidebar-tabs > tabs > tab[selected] + tab:hover:active { +.devtools-sidebar-tabs tabs > tab[selected] + tab:hover:active { } -.devtools-sidebar-tabs > tabs > tab[selected], -.devtools-sidebar-tabs > tabs > tab[selected]:hover:active { +.devtools-sidebar-tabs tabs > tab[selected], +.devtools-sidebar-tabs tabs > tab[selected]:hover:active { } /* Toolbox - moved from toolbox.css. @@ -974,4 +1035,13 @@ div.CodeMirror span.eval-text { display: none; } +.devtools-horizontal-splitter { +/* border-bottom: 1px solid var(--theme-splitter-color); */ +} + +.devtools-side-splitter { +/* -moz-border-end: 1px solid var(--theme-splitter-color); + border-color: var(--theme-splitter-color); / Needed for responsive container at low width. */ +} + /* === END toolbars.inc.css === */