X-Git-Url: https://git-public.kairo.at/?p=themes.git;a=blobdiff_plain;f=LCARStrek%2Fbrowser%2Fdevtools%2Fdebugger.css;h=217e916b401a9259507228ad2723b16c00be830d;hp=20079ae2f2689e17a890e7dd97033d9800fa6a4f;hb=05148fedf8e9b1fa26d0ce0b22403289571a207b;hpb=82b4252f7e41007fc93fa3b94fd7418a07c03fd1 diff --git a/LCARStrek/browser/devtools/debugger.css b/LCARStrek/browser/devtools/debugger.css index 20079ae2..217e916b 100644 --- a/LCARStrek/browser/devtools/debugger.css +++ b/LCARStrek/browser/devtools/debugger.css @@ -6,80 +6,294 @@ 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-pane + .devtools-side-splitter { - -moz-border-start-color: transparent; +#sources-pane > tabs { + -moz-border-end-color: var(--theme-splitter-color); } -/* Watch expressions, variables and other instruments pane */ +.dbg-breakpoint-condition-thrown-message { + display: none; + color: var(--theme-highlight-red); +} -#instruments-pane { - min-width: 50px; - -moz-margin-start: 0px !important; - /* Unfortunately, transitions don't work properly with locale-aware properties, - so both the left and right margins are set via js, while the start margin - is always overridden here. */ +.dbg-breakpoint.dbg-breakpoint-condition-thrown .dbg-breakpoint-condition-thrown-message { + display: block; + -moz-padding-start: 0; } -#instruments-pane[animated] { - transition: margin 0.25s ease-in-out; +/* Sources toolbar */ + +#sources-toolbar > .devtools-toolbarbutton, +#sources-controls > .devtools-toolbarbutton { + min-width: 32px; } -/* ListWidget items */ +#black-box { + list-style-image: url("debugger-blackbox.png"); +} -.list-widget-item { - padding: 2px; +@media (min-resolution: 2dppx) { + #black-box { + list-style-image: url(debugger-blackbox@2x.png); + } } -.list-widget-item:not(.selected):not(.empty):hover { -/* background: linear-gradient(rgba(255,255,255,0.9), rgba(255,255,255,0.85)), Highlight;*/ +#pretty-print { + list-style-image: url(debugger-prettyprint.png); } -.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) { + #pretty-print { + list-style-image: url(debugger-prettyprint@2x.png); + } } -.list-widget-item.selected { - background: #008484; - color: #FFCF00; +#toggle-breakpoints { + list-style-image: url("debugger-toggleBreakpoints.png"); +} + +@media (min-resolution: 2dppx) { + #toggle-breakpoints { + list-style-image: url(debugger-toggleBreakpoints@2x.png); + } } -.list-widget-item.empty { +#sources-toolbar .devtools-toolbarbutton:not([label]) { + -moz-image-region: rect(0px, 16px, 16px, 0px); +} + +#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; - /* padding: 4px; */ } -/* Stack frames view */ +#sources .selected .black-boxed { + color: #000000; +} + +#sources .black-boxed ~ .dbg-breakpoint { + display: none; +} + +#sources .black-boxed + .side-menu-widget-item-arrow:-moz-locale-dir(ltr) { + background-image: none; +/* box-shadow: inset -1px 0 0 #222426; */ +} + +#sources .black-boxed + .side-menu-widget-item-arrow:-moz-locale-dir(rtl) { + background-image: none; +/* 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 size from this message. */ + min-width: 1px; + min-height: 1px; + color: #000000; +} + +#source-progress { + min-height: 2em; + min-width: 40em; +} + +#black-boxed-message-label, +#black-boxed-message-button { + text-align: center; + font-size: 120%; +} + +#black-boxed-message-button { + margin-top: 1em; + padding: .25em; +} + +/* Tracer */ + +#trace { + list-style-image: url("tracer-icon.png"); + -moz-image-region: rect(0px,16px,16px,0px); +} + +#trace:hover, +#trace[checked] { + -moz-image-region: rect(0px,32px,16px,16px); +} + +@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); + } +} + +#clear-tracer { + /* Make this button as narrow as the text inside it. */ + min-width: 1px; +} + +.trace-name { + -moz-padding-start: 4px !important; +} + +/* Tracer dark+light theme */ + +.trace-item { + color: var(--theme-content-color1); +} + +.trace-item.black-boxed { + color: #A09090; +} + +.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; +} .dbg-stackframe-details { -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-classic-stackframe-details:-moz-locale-dir(rtl) { + float: left; } -.dbg-stackframe-menuitem-details { - -moz-padding-start: 16px; +.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 */ .dbg-breakpoint { - font-family: "Liberation Mono", Consolas, "Courier New", monospace; + -moz-margin-start: 4px; } .dbg-breakpoint-line { @@ -89,6 +303,48 @@ window { .dbg-breakpoint-text { -moz-margin-start: 10px !important; font-style: italic; + font-size: 90%; +} + +.dbg-breakpoint-checkbox { + width: 16px; + height: 16px; + margin: 2px; +} + +/* 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. */ +} + +.devtools-tooltip-simple-text.token-boolean { + text-align: center; + color: #9C9CFF !important; +} + +.devtools-tooltip-simple-text.token-number { + text-align: center; + color: #E7ADE7 !important; +} + +.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 */ @@ -100,29 +356,75 @@ window { .dbg-expression { height: 20px; - -moz-padding-start: 8px; } .dbg-expression-arrow { - width: 10px; - height: auto; - background: url("chrome://browser/skin/devtools/commandline.png") 0px 4px no-repeat; + background-image: url("commandline-icon.png"); + background-position: -16px 0; + background-repeat: no-repeat; + background-size: 32px 16px; + width: 16px; + 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; - font-family: "Liberation Mono", Consolas, "Courier New", monospace; + 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: 0 8px; +} + +.dbg-event-listener-type { + font-weight: 600; +} + +.dbg-event-listener-separator { + color: var(--theme-body-color-alt); +} + +.dbg-event-listener-targets { + color: var(--theme-highlight-blue); +} + +.dbg-event-listener-location { + 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; } -#searchbox-panel-description { - margin-top: 0; +#filter-label { + -moz-margin-start: 2px; +} + +#searchbox-panel-operators { + margin-top: 5px; margin-bottom: 8px; -moz-margin-start: 2px; } @@ -134,7 +436,6 @@ window { -moz-margin-start: 2px; -moz-margin-end: 6px; text-align: center; - font-family: "Liberation Mono", Consolas, "Courier New", monospace; } .searchbox-panel-operator-label { @@ -171,20 +472,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; } @@ -192,10 +493,6 @@ window { #globalsearch { min-height: 10px; -} - -#globalsearch > vbox:not(:empty) { - min-height: 10px; max-height: 125px; } @@ -208,6 +505,10 @@ window { background: none !important; } +.dbg-source-results:not(.selected):hover { + background-color: #000000; /* Sidebar background */ +} + .dbg-results-header { -moz-padding-start: 6px; } @@ -218,34 +519,33 @@ 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; - font-family: "Liberation Mono", Consolas, "Courier New", monospace; - color: #FF9F00; + color: var(--theme-body-color); } .dbg-results-line-contents { -moz-padding-start: 4px; padding-top: 1px; padding-bottom: 1px; - font-family: "Liberation Mono", Consolas, "Courier New", monospace; } .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; @@ -261,7 +561,7 @@ window { transform: scale(1.75, 1.75); } -/* Toolbar Controls */ +/* Toolbar controls */ #toggle-panes { list-style-image: url("chrome://browser/skin/devtools/debugger-expand.png"); @@ -277,16 +577,48 @@ window { -moz-image-region: rect(0px, 32px, 16px, 16px); } +#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); @@ -311,28 +643,89 @@ window { -moz-image-region: rect(0px, 32px, 16px, 16px); } -#debugger-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 { -} + #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); + } -#debugger-controls { + #step-in:hover { + -moz-image-region: rect(0px, 64px, 32px, 32px); + } + + #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 { - background: none; +/* background: none; box-shadow: none; - border: none; - list-style-image: url("chrome://browser/skin/devtools/debugger-expand.png"); + border: none; */ + list-style-image: url("chrome://browser/skin/devtools/debugger-collapse.png"); -moz-image-region: rect(0px,16px,16px,0px); } -#instruments-pane-toggle:not([toggled]) { - list-style-image: url("chrome://browser/skin/devtools/debugger-collapse.png"); +#instruments-pane-toggle[pane-collapsed] { + 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 { + min-height: 35vh; + max-height: 80vh; +} + +#body[layout=vertical] #instruments-pane { + margin: 0 !important; + /* To prevent all the margin hacks to hide the sidebar. */ +} + +#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 === */