X-Git-Url: https://git-public.kairo.at/?p=themes.git;a=blobdiff_plain;f=LCARStrek%2Fbrowser%2Fdevtools%2Fdebugger.css;h=89c6e02cbe4215fb978451aa9a8a009f92ebffab;hp=b44969bb8cd35280a543fe8f7cf91f76d107662d;hb=b3bf08b110943f4abc9642b613f0dcb078c22b0b;hpb=6568957a6c8bab01b38e271cec8661f148805538 diff --git a/LCARStrek/browser/devtools/debugger.css b/LCARStrek/browser/devtools/debugger.css index b44969bb..89c6e02c 100644 --- a/LCARStrek/browser/devtools/debugger.css +++ b/LCARStrek/browser/devtools/debugger.css @@ -6,43 +6,96 @@ window { padding: 0; } -#body { - background-color: #000000; -} +/* === BEGIN debugger.inc.css === */ /* Sources and breakpoints pane */ -#sources-pane { - min-width: 50px; +#sources-pane[selectedIndex="0"] + #sources-and-editor-splitter { + border-color: transparent; } -#sources-and-editor-splitter { - -moz-border-start-color: transparent; +#sources-pane > tabs { + -moz-border-end-color: var(--theme-splitter-color); } -#sources-toolbar .devtools-toolbarbutton { +#sources-toolbar > .devtools-toolbarbutton, +#sources-controls > .devtools-toolbarbutton { min-width: 32px; } +#black-box { + list-style-image: url("debugger-blackbox.png"); +} + +@media (min-resolution: 2dppx) { + #black-box { + list-style-image: url(debugger-blackbox@2x.png); + } +} + #pretty-print { - font-weight: bold; + list-style-image: url(debugger-prettyprint.png); } -#black-box { - list-style-image: url("debugger-blackbox.png"); +@media (min-resolution: 2dppx) { + #pretty-print { + list-style-image: url(debugger-prettyprint@2x.png); + } +} + +#toggle-breakpoints { + list-style-image: url("debugger-toggleBreakpoints.png"); +} + +@media (min-resolution: 2dppx) { + #toggle-breakpoints { + list-style-image: url(debugger-toggleBreakpoints@2x.png); + } +} + +#sources-toolbar .devtools-toolbarbutton:not([label]) { -moz-image-region: rect(0px, 16px, 16px, 0px); } -#black-box[checked], -#black-box:hover { +#sources-toolbar .devtools-toolbarbutton:not([label]):hover { + -moz-image-region: rect(16px, 16px, 32px, 0px); +} + +#sources-toolbar .devtools-toolbarbutton:not([label])[checked] { -moz-image-region: rect(0px, 32px, 16px, 16px); } +#sources-toolbar .devtools-toolbarbutton:not([label])[checked]:hover { + -moz-image-region: rect(16px, 32px, 32px, 16px); +} + +@media (min-resolution: 2dppx) { + #sources-toolbar .devtools-toolbarbutton:not([label]) { + -moz-image-region: rect(0px,32px,32px,0px); + } + + #sources-toolbar .devtools-toolbarbutton:not([label]):hover { + -moz-image-region: rect(32px,32px,64px,0px); + } + + #sources-toolbar .devtools-toolbarbutton:not([label])[checked] { + -moz-image-region: rect(0px,64px,32px,32px); + } + + #sources-toolbar .devtools-toolbarbutton:not([label])[checked]:hover { + -moz-image-region: rect(32px,64px,64px,32px); + } +} + #sources .black-boxed { color: #8050B0; } -#sources .black-boxed > .dbg-breakpoint { +#sources .selected .black-boxed { + color: #000000; +} + +#sources .black-boxed ~ .dbg-breakpoint { display: none; } @@ -56,12 +109,31 @@ window { /* box-shadow: inset 1px 0 0 #222426; */ } +/* Debugger unblackbox button */ + +#black-boxed-message-button > .button-box > .button-icon { + width: 16px; + height: 16px; + background-image: url("debugger-blackbox.png"); + background-position: -16px -16px; + background-size: 32px 32px; + background-repeat: no-repeat; + -moz-margin-end: 5px; +} + +@media (min-resolution: 2dppx) { + #black-boxed-message-button > .button-box > .button-icon { + background-image: url("debugger-blackbox@2x.png"); + } +} + /* Black box message and source progress meter */ #black-boxed-message, #source-progress-container { background-color: #A09090; - /* Prevent the container deck from aquiring the height from this message. */ + /* Prevent the container deck from aquiring the size from this message. */ + min-width: 1px; min-height: 1px; color: #000000; } @@ -82,32 +154,83 @@ window { padding: .25em; } -/* ListWidget items */ +/* Tracer */ -.list-widget-item { - padding: 2px; +#trace { + list-style-image: url("tracer-icon.png"); + -moz-image-region: rect(0px,16px,16px,0px); } -.list-widget-item:not(.selected):not(.empty):hover { -/* background: linear-gradient(rgba(255,255,255,0.9), rgba(255,255,255,0.85)), Highlight;*/ +#trace:hover, +#trace[checked] { + -moz-image-region: rect(0px,32px,16px,16px); } -.list-widget-item.selected.light { -/* background: linear-gradient(rgba(255,255,255,0.85), rgba(255,255,255,0.8)), Highlight; - color: #000;*/ +@media (min-resolution: 2dppx) { + #trace { + list-style-image: url(tracer-icon@2x.png); + -moz-image-region: rect(0px,32px,32px,0px); + } + + #trace:hover, + #trace[checked] { + -moz-image-region: rect(0px,64px,32px,32px); + } } -.list-widget-item.selected { - background: #008484; - color: #FFCF00; +#clear-tracer { + /* Make this button as narrow as the text inside it. */ + min-width: 1px; } -.list-widget-item.empty { - color: #8050B0; - /* padding: 4px; */ +.trace-name { + -moz-padding-start: 4px !important; +} + +/* Tracer dark+light theme */ + +.trace-item { + color: var(--theme-content-color1); +} + +.trace-item.black-boxed { + color: #A09090; } -/* Stack frames view */ +.trace-item.selected-matching { + background-color: #004242; /* Select highlight blue at 40% alpha */ +} + +.selected > .trace-item { + background-color: #004242; /* Select highlight blue at 75% alpha */ +} + +.trace-call { + color: var(--theme-highlight-blue); +} + +.trace-return, +.trace-yield { + color: var(--theme-highlight-green); +} + +.trace-throw { + color: var(--theme-highlight-red); +} + +.trace-param { + color: var(--theme-highlight-pink); +} + +.trace-syntax { + color: var(--theme-content-color2); +} + +/* Breadcrumbs stack frames view */ + +.breadcrumbs-widget-item { + max-width: none; +} #stackframes { min-height: 25px; @@ -117,15 +240,42 @@ window { -moz-padding-start: 4px; } -.dbg-stackframe-menuitem[checked] { - margin-top: 3px; - margin-bottom: 3px; - outline: 1px solid #008484; +/* Classic stack frames view */ + +.dbg-classic-stackframe { + display: block; + padding: 0 4px; +} + +.dbg-classic-stackframe-title { font-weight: 600; + color: #9C9CFF; +} + +.dbg-classic-stackframe-details:-moz-locale-dir(ltr) { + float: right; } -.dbg-stackframe-menuitem-details { - -moz-padding-start: 16px; +.dbg-classic-stackframe-details:-moz-locale-dir(rtl) { + float: left; +} + +.dbg-classic-stackframe-details-url { + max-width: 90%; + text-align: end; + color: var(--theme-text-blue); +} + +.dbg-classic-stackframe-details-sep { + color: var(--theme-body-color-alt) +} + +.dbg-classic-stackframe-details-line { + color: var(--theme-highlight-blue); +} + +#callstack-list .side-menu-widget-item.selected label { + color: #FFCF00; } /* Sources and breakpoints view */ @@ -150,15 +300,39 @@ window { margin: 2px; } -/* Instruments pane (watch expressions, variables, event listeners...) */ +/* Variable bubble view */ + +.devtools-tooltip-simple-text.token-undefined, +.devtools-tooltip-simple-text.token-null { + text-align: center; + color: #A09090 !important; /* Override the theme's color. */ +} -#instruments-pane > tabs > tab { - min-height: 25px !important; - padding: 0 !important; +.devtools-tooltip-simple-text.token-boolean { + text-align: center; + color: #9C9CFF !important; +} + +.devtools-tooltip-simple-text.token-number { + text-align: center; + color: #E7ADE7 !important; } -#instruments-pane > tabpanels > tabpanel { - background: #000000; +.devtools-tooltip-simple-text.token-string { + text-align: start; + color: #008484 !important; +} + +.devtools-tooltip-simple-text.token-other { + text-align: center; + color: #FF9F00 !important; +} + +/* Instruments pane (watch expressions, variables, event listeners...) */ + +#instruments-pane .side-menu-widget-container, +#instruments-pane .side-menu-widget-empty-text { +/* box-shadow: none !important; */ } /* Watch expressions view */ @@ -173,19 +347,37 @@ window { } .dbg-expression-arrow { + background-image: url("commandline-icon.png"); + background-position: -16px 0; + background-repeat: no-repeat; + background-size: 32px 16px; width: 16px; - height: auto; - background: -moz-image-rect(url("commandline-icon.png"), 0, 32, 16, 16); + height: 16px; + margin: 2px; +} + +@media (min-resolution: 2dppx) { + .dbg-expression-arrow { + background-image: url(commandline-icon@2x.png); + } } .dbg-expression-input { - -moz-padding-start: 2px !important; + color: inherit; +} + +.dbg-expression-button { + border: none; + background: none; + text-decoration: underline; + cursor: pointer; + color: var(--theme-highlight-blue); } /* Event listeners view */ .dbg-event-listener { - padding: 4px 8px; + padding: 0 8px; } .dbg-event-listener-type { @@ -193,20 +385,24 @@ window { } .dbg-event-listener-separator { - color: #A09090; + color: var(--theme-body-color-alt); } .dbg-event-listener-targets { - color: #9C9CFF; + color: var(--theme-highlight-blue); } .dbg-event-listener-location { - color: #E7ADE7; + color: var(--theme-highlight-pink); +} + +#event-listeners .side-menu-widget-item.selected { + background: none !important; } /* Searchbox and the search operations help panel */ -.devtools-searchinput { +#searchbox { min-width: 220px; -moz-margin-start: 1px; } @@ -264,20 +460,20 @@ window { /* text-shadow: 0 1px #fff;*/ } -.results-panel-item-pre { +.results-panel-item-label-before { -moz-margin-end: 5px !important; - color: #A09090; + color: var(--theme-content-color2); cursor: inherit; } -.results-panel-item-name { - color: #9C9CFF; +.results-panel-item-label { + color: var(--theme-highlight-blue); font-weight: 600; cursor: inherit; } -.results-panel-item-details { - color: #FF9F00; +.results-panel-item-label-below { + color: var(--theme-content-color3); cursor: inherit; } @@ -285,10 +481,6 @@ window { #globalsearch { min-height: 10px; -} - -#globalsearch > vbox:not(:empty) { - min-height: 10px; max-height: 125px; } @@ -301,6 +493,10 @@ window { background: none !important; } +.dbg-source-results:not(.selected):hover { + background-color: #000000; /* Sidebar background */ +} + .dbg-results-header { -moz-padding-start: 6px; } @@ -311,17 +507,17 @@ window { .dbg-results-header-match-count { -moz-padding-start: 6px; - color: #8050B0; + color: var(--theme-content-disabled); } .dbg-results-line-number { - background: #000000; + background-color: var(--theme-toolbar-background); min-width: 40px; -moz-border-end: 1px solid #9C9CFF; -moz-padding-end: 4px; padding-top: 2px; text-align: end; - color: #FF9F00; + color: var(--theme-body-color); } .dbg-results-line-contents { @@ -332,11 +528,12 @@ window { .dbg-results-line-contents-string { padding: 1px; +/* color: var(--theme-body-color-alt);*/ } .dbg-results-line-contents-string[match=true] { background: #E7ADE7; - color: #000000; + color: var(--theme-selection-color); padding: 0; border: 1px solid #9C9CFF; border-radius: 4px; @@ -368,24 +565,48 @@ window { -moz-image-region: rect(0px, 32px, 16px, 16px); } -#resumption-panel-desc { - width: 200px; -} - -#resumption-order-panel { - -moz-margin-start: -8px; +#debugger-toolbar .devtools-toolbarbutton:not([label]) > .toolbarbutton-icon, +#sources-toolbar .devtools-toolbarbutton:not([label]) > .toolbarbutton-icon { + width: 16px; + height: 16px; } #resume { - list-style-image: url("chrome://browser/skin/devtools/debugger-play.png"); + list-style-image: url("chrome://browser/skin/devtools/debugger-pause.png"); -moz-image-region: rect(0px, 16px, 16px, 0px); } -#resume[checked=true], #resume:hover { -moz-image-region: rect(0px, 32px, 16px, 16px); } +#resume[checked=true] { + list-style-image: url("chrome://browser/skin/devtools/debugger-play.png"); +} + +@media (min-resolution: 2dppx) { + #resume { + list-style-image: url(debugger-pause@2x.png); + -moz-image-region: rect(0px, 32px, 32px, 0px); + } + + #resume:hover { + -moz-image-region: rect(0px, 64px, 32px, 32px); + } + + #resume[checked=true] { + list-style-image: url(debugger-play@2x.png); + } +} + +#resume ~ toolbarbutton { +/* transition: opacity 0.15s ease-in-out; */ +} + +#resume:not([checked]) ~ toolbarbutton { +/* opacity: 0.5; */ +} + #step-over { list-style-image: url("chrome://browser/skin/devtools/debugger-step-over.png"); -moz-image-region: rect(0px, 16px, 16px, 0px); @@ -410,16 +631,33 @@ window { -moz-image-region: rect(0px, 32px, 16px, 16px); } -#debugger-controls > toolbarbutton, -#sources-controls > toolbarbutton { -} +@media (min-resolution: 2dppx) { + #step-over { + list-style-image: url(debugger-step-over@2x.png); + -moz-image-region: rect(0px, 32px, 32px, 0); + } -#debugger-controls > toolbarbutton:last-of-type, -#sources-controls > toolbarbutton:last-of-type { -} + #step-over:hover { + -moz-image-region: rect(0px, 64px, 32px, 32px); + } + + #step-in { + list-style-image: url(debugger-step-in@2x.png); + -moz-image-region: rect(0px, 32px, 32px, 0); + } + + #step-in:hover { + -moz-image-region: rect(0px, 64px, 32px, 32px); + } -#debugger-controls, -#sources-controls { + #step-out { + list-style-image: url(debugger-step-out@2x.png); + -moz-image-region: rect(0px, 32px, 32px, 0); + } + + #step-out:hover { + -moz-image-region: rect(0px, 64px, 32px, 32px); + } } #instruments-pane-toggle { @@ -434,11 +672,25 @@ window { list-style-image: url("chrome://browser/skin/devtools/debugger-expand.png"); } -#instruments-pane-toggle:hover, -#instruments-pane-toggle:hover:active { +#instruments-pane-toggle:hover { -moz-image-region: rect(0px,32px,16px,16px); } +@media (min-resolution: 2dppx) { + #instruments-pane-toggle { + list-style-image: url(debugger-collapse@2x.png); + -moz-image-region: rect(0px,32px,32px,0px); + } + + #instruments-pane-toggle[pane-collapsed] { + list-style-image: url(debugger-expand@2x.png); + } + + #instruments-pane-toggle:hover { + -moz-image-region: rect(0px,64px,32px,32px); + } +} + /* Horizontal vs. vertical layout */ #vertical-layout-panes-container { @@ -451,10 +703,17 @@ window { /* To prevent all the margin hacks to hide the sidebar. */ } -#body[layout=vertical] .side-menu-widget-container { +#body[layout=vertical] #sources-pane > tabs { + -moz-border-end: none; +} + +#body[layout=vertical] .side-menu-widget-container, +#body[layout=vertical] .side-menu-widget-empty-text { box-shadow: none !important; } #body[layout=vertical] .side-menu-widget-item-arrow { background-image: none !important; } + +/* === END debugger.inc.css === */