From d2ce251d5603e79f6c56e5c46b711c8a85403418 Mon Sep 17 00:00:00 2001 From: Robert Kaiser Date: Fri, 14 Mar 2014 23:45:58 +0100 Subject: [PATCH] third part of synching LCARStrek with windows theme changes in Firefox 28 cycle --- LCARStrek/browser/browser.css | 4 + .../browser/devtools/app-manager/add.svg | 13 ++ LCARStrek/browser/devtools/common.css | 29 ++- LCARStrek/browser/devtools/dark-theme.css | 28 ++- LCARStrek/browser/devtools/debugger.css | 30 ++- ...n-breakpoint.png => editor-breakpoint.png} | Bin ...location.png => editor-debug-location.png} | Bin .../{orion-error.png => editor-error.png} | Bin .../browser/devtools/floating-scrollbars.css | 20 +- .../browser/devtools/orion-container.css | 39 ---- LCARStrek/browser/devtools/orion-task.png | Bin 212 -> 0 bytes LCARStrek/browser/devtools/orion.css | 200 ------------------ LCARStrek/browser/devtools/toolbox.css | 1 - LCARStrek/browser/devtools/webconsole.css | 49 ++++- LCARStrek/browser/devtools/widgets.css | 41 +++- 15 files changed, 183 insertions(+), 271 deletions(-) create mode 100644 LCARStrek/browser/devtools/app-manager/add.svg rename LCARStrek/browser/devtools/{orion-breakpoint.png => editor-breakpoint.png} (100%) rename LCARStrek/browser/devtools/{orion-debug-location.png => editor-debug-location.png} (100%) rename LCARStrek/browser/devtools/{orion-error.png => editor-error.png} (100%) delete mode 100644 LCARStrek/browser/devtools/orion-container.css delete mode 100644 LCARStrek/browser/devtools/orion-task.png delete mode 100644 LCARStrek/browser/devtools/orion.css diff --git a/LCARStrek/browser/browser.css b/LCARStrek/browser/browser.css index 6e02f342..c9415663 100644 --- a/LCARStrek/browser/browser.css +++ b/LCARStrek/browser/browser.css @@ -3778,6 +3778,10 @@ html|*#gcli-output-frame { .devtools-responsiveui-toolbar { background: transparent; + /* text color is textColor from dark theme, since no theme is applied to + * the responsive toolbar. + */ + color: #FF9F00; margin: 10px 0; padding: 0; box-shadow: none; diff --git a/LCARStrek/browser/devtools/app-manager/add.svg b/LCARStrek/browser/devtools/app-manager/add.svg new file mode 100644 index 00000000..89249149 --- /dev/null +++ b/LCARStrek/browser/devtools/app-manager/add.svg @@ -0,0 +1,13 @@ + + + + + + + + diff --git a/LCARStrek/browser/devtools/common.css b/LCARStrek/browser/devtools/common.css index b0e19b87..dedde43f 100644 --- a/LCARStrek/browser/devtools/common.css +++ b/LCARStrek/browser/devtools/common.css @@ -368,11 +368,30 @@ devtools-menulist:-moz-focusring, border-radius: 3px; } -.devtools-tooltip.devtools-tooltip-panel .panel-arrowcontent { +.devtools-tooltip .panel-arrowcontent { /* If the tooltip uses a XUL element instead */ padding: 4px; } +.devtools-tooltip .panel-arrowcontainer { + /* Reseting the transition used when panels are shown */ + transition: none; + /* Panels slide up/down/left/right when they appear using a transform. + Since we want to remove the transition, we don't need to transform anymore + plus it can interfeer by causing mouseleave events on the underlying nodes */ + transform: none; +} + +.devtools-tooltip[clamped-dimensions] { + max-height: 400px; + max-width: 400px; +} +.devtools-tooltip[clamped-dimensions] .panel-arrowcontent { + overflow: hidden; +} + +/* Tooltip: Simple Text */ + .devtools-tooltip-simple-text { background: #000000; max-width: 400px; @@ -405,6 +424,14 @@ devtools-menulist:-moz-focusring, margin-bottom: -4px; } +/* Tooltip: Variables View */ + +.devtools-tooltip-variables-view-box { + margin: -4px; /* Compensate for the .panel-arrowcontent padding. */ +} + +/* Tooltip: Tiles */ + .devtools-tooltip-tiles { background-color: #A09090; background-image: linear-gradient(45deg, #9C9CFF 25%, transparent 25%, transparent 75%, #9C9CFF 75%, #9C9CFF), diff --git a/LCARStrek/browser/devtools/dark-theme.css b/LCARStrek/browser/devtools/dark-theme.css index 55f99d80..9e40996a 100644 --- a/LCARStrek/browser/devtools/dark-theme.css +++ b/LCARStrek/browser/devtools/dark-theme.css @@ -49,8 +49,7 @@ background: #004242; } -.theme-bg-darker -.cm-s-mozilla .CodeMirror-gutters { +.theme-bg-darker { background-color: rgba(0,0,0,0.5); } @@ -189,13 +188,36 @@ div.cm-s-mozilla span.CodeMirror-matchingbracket { /* highlight brackets */ color: #FFCF00; } +/* Highlight for a line that contains an error. */ +div.CodeMirror div.error-line { + background: rgba(255,0,0,0.2); +} + +/* Highlight for a line that represents a stack frame's location. */ +div.CodeMirror div.debug-line { + background: rgba(156,156,255,0.1); +} + +/* Generic highlighted text */ +div.CodeMirror span.marked-text { + background: rgba(255,207,0,0.2); + border: 1px dashed rgba(156,156,255,0.6); + -moz-margin-start: -1px; + -moz-margin-end: -1px; +} + +/* Highlight for evaluating current statement. */ +div.CodeMirror span.eval-text { + background-color: #403800; +} + .cm-s-mozilla .CodeMirror-linenumber { /* line number text */ color: #A09090; } .cm-s-mozilla .CodeMirror-gutters { /* vertical line next to line numbers */ border-right-color: #A09090; - background: #402800; + background-color: #402800; } .cm-s-markup-view pre { diff --git a/LCARStrek/browser/devtools/debugger.css b/LCARStrek/browser/devtools/debugger.css index b0be73be..6476acf1 100644 --- a/LCARStrek/browser/devtools/debugger.css +++ b/LCARStrek/browser/devtools/debugger.css @@ -146,6 +146,34 @@ window { 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 > tabs > tab { @@ -202,7 +230,7 @@ window { /* Searchbox and the search operations help panel */ -.devtools-searchinput { +#searchbox { min-width: 220px; -moz-margin-start: 1px; } diff --git a/LCARStrek/browser/devtools/orion-breakpoint.png b/LCARStrek/browser/devtools/editor-breakpoint.png similarity index 100% rename from LCARStrek/browser/devtools/orion-breakpoint.png rename to LCARStrek/browser/devtools/editor-breakpoint.png diff --git a/LCARStrek/browser/devtools/orion-debug-location.png b/LCARStrek/browser/devtools/editor-debug-location.png similarity index 100% rename from LCARStrek/browser/devtools/orion-debug-location.png rename to LCARStrek/browser/devtools/editor-debug-location.png diff --git a/LCARStrek/browser/devtools/orion-error.png b/LCARStrek/browser/devtools/editor-error.png similarity index 100% rename from LCARStrek/browser/devtools/orion-error.png rename to LCARStrek/browser/devtools/editor-error.png diff --git a/LCARStrek/browser/devtools/floating-scrollbars.css b/LCARStrek/browser/devtools/floating-scrollbars.css index 4d11597e..9647e132 100644 --- a/LCARStrek/browser/devtools/floating-scrollbars.css +++ b/LCARStrek/browser/devtools/floating-scrollbars.css @@ -1,30 +1,34 @@ @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); scrollbar { - -moz-appearance: none !important; position: relative; background-color: transparent; background-image: none; z-index: 2147483647; - padding: 2px; + /*padding: 2px;*/ } scrollbar[orient="vertical"] { -moz-margin-start: -10px; - min-width: 10px; - max-width: 10px; + min-width: 6px; + max-width: 6px; } scrollbar[orient="horizontal"] { margin-top: -10px; - min-height: 10px; - max-height: 10px; + min-height: 6px; + max-height: 6px; +} + +scrollbar slider { +/* background-color: transparent; */ + border-radius: 3px; } scrollbar thumb { - -moz-appearance: none !important; border-width: 0px !important; - background-color: rgba(0,0,0,0.2) !important; +/* background-color: rgba(0,0,0,0.2) !important;*/ + background-image: none; border-radius: 3px !important; } diff --git a/LCARStrek/browser/devtools/orion-container.css b/LCARStrek/browser/devtools/orion-container.css deleted file mode 100644 index bb0efc9d..00000000 --- a/LCARStrek/browser/devtools/orion-container.css +++ /dev/null @@ -1,39 +0,0 @@ -/* This Source Code Form is subject to the terms of the Mozilla Public - * 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/. */ - -.viewTooltip { - display: none; /* TODO: add tooltips support, see bug 721752 */ - font-family: "Liberation Mono", Consolas, "Courier New", monospace; - font-size: 13px; - background-color: #9C9CFF; - color: #000000; - padding: 2px; - border-radius: 4px; - border: 1px solid #FFCF00; - z-index: 100; - position: fixed; - overflow: hidden; - white-space: pre; -} - -.viewTooltip em { - font-style: normal; - font-weight: bold; -} - -.annotationHTML { - cursor: pointer; - width: 16px; - height: 16px; - display: inline-block; - vertical-align: middle; - background-position: center; - background-repeat: no-repeat; -} -.annotationHTML.task { - background-image: url("chrome://browser/skin/devtools/orion-task.png"); -} -.annotationHTML.breakpoint { - background-image: url("chrome://browser/skin/devtools/orion-breakpoint.png"); -} diff --git a/LCARStrek/browser/devtools/orion-task.png b/LCARStrek/browser/devtools/orion-task.png deleted file mode 100644 index 26574e63ff799b035cdd0fc5da1406dd783d2a6f..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 212 zcmeAS@N?(olHy`uVBq!ia0vp^0wB!93?!50ihlx9jKx9jP7LeL$-D$|I0Jk_TzMEG z7+PBX|NkG{w?+e`q9n*Kn8D%MjWiG^$=lt9p@UV{1EjpbBeIx*fm;}a85w5HkpK#^ zmw5WRvfp9h5aQ!a>$&$0C}i&G;uyklJvo7a@z{j`cD8F5E-*+4nlXB~GgTe~DWM4fy*@YQ diff --git a/LCARStrek/browser/devtools/orion.css b/LCARStrek/browser/devtools/orion.css deleted file mode 100644 index bfacc960..00000000 --- a/LCARStrek/browser/devtools/orion.css +++ /dev/null @@ -1,200 +0,0 @@ -/* This Source Code Form is subject to the terms of the Mozilla Public - * 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/. */ - -.viewContainer { - background: #000000; /* This will be seen as the continuation of the ruler */ - font-family: "Liberation Mono", Consolas, "Courier New", monospace; - /* font-size: inherit; * inherit browser's default monospace font size */ - font-size: 11px; /* use typical LCARStrek font size */ -} - -.view { - color: #FF9F00; /* Default text color */ - background: #000000; /* Background of the editor */ - padding-left: 4px; -} - -.readonly > .view { - background: #000000; /* super light green */ -} - -.ruler { - background: #402800; - color: #E7ADE7; -} -.ruler.annotations { - width: 16px; - padding-left: 4px; -} -.ruler.lines { - border-right: 1px solid #794900; - min-width: 1.4em; - padding-left: 4px; - padding-right: 4px; - text-align: end; -} - -.ruler.linesWithAnnotations { - min-width: 0; - padding-left: 0; -} - -.ruler.overview { - border-left: 1px solid #794900; - width: 14px; - text-align: start; -} - -/* Styles for the annotation ruler (first line) */ -.annotationHTML { - cursor: pointer; - width: 16px; - height: 16px; - display: inline-block; - vertical-align: middle; - background-position: center; - background-repeat: no-repeat; -} -.annotation.task .annotationHTML { - background-image: url("chrome://browser/skin/devtools/orion-task.png"); -} -.annotation.breakpoint .annotationHTML { - background-image: url("chrome://browser/skin/devtools/orion-breakpoint.png"); -} -.annotation.debugLocation .annotationHTML { - background-image: url("chrome://browser/skin/devtools/orion-debug-location.png"); -} -.annotation.breakpoint.debugLocation .annotationHTML, -.annotation.task.debugLocation .annotationHTML { - background-position: center, center; - background-repeat: no-repeat, no-repeat; - background-size: 75%, 100%; -} -.annotation.breakpoint.debugLocation .annotationHTML { - background-image: url("chrome://browser/skin/devtools/orion-debug-location.png"), - url("chrome://browser/skin/devtools/orion-breakpoint.png"); -} - -.annotation.task.debugLocation .annotationHTML { - background-image: url("chrome://browser/skin/devtools/orion-debug-location.png"), - url("chrome://browser/skin/devtools/orion-task.png"); -} - -/* Styles for the overview ruler */ -.annotationOverview { - cursor: pointer; - border-radius: 2px; - left: 2px; - width: 8px; -} -.annotationOverview.task { - background-color: #004000; - border: 1px solid #33FF33; -} -.annotationOverview.breakpoint { - background-color: #262640; - border: 1px solid #9C9CFF; -} -.annotationOverview.debugLocation { - background-color: #404000; - border: 1px solid #33FF33; -} -.annotationOverview.currentBracket { - background-color: #808080; - border: 1px solid #FF0000; -} -.annotationOverview.matchingBracket { - background-color: #808080; - border: 1px solid #FF0000; -} - -/* Styles for text range */ -.annotationRange { - background-repeat: repeat-x; - background-position: left bottom; -} -.annotationRange.task { - outline: 1px dashed rgba(0, 255, 0, 0.5); -} -.annotationRange.matchingBracket { - outline: 1px solid #008484; -} - -.token_singleline_comment, -.token_multiline_comment, -.token_doc_comment { - color: #33CC33; /* grey */ -} - -.token_doc_html_markup { - color: #E7ADE7; /* purple */ -} - -.token_doc_tag { - color: #E7ADE7; /* purple */ -} - -.token_task_tag { /* "TODO" */ - color: black; - background: #FFCF00; -} - -.token_string { - color: #9C9CFF; /* green */ - font-style: italic; -} - -.token_keyword { - color: #E7ADE7; /* purple */ -} - -.token_space { - /* images/white_space.png */ - background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAIAAABv85FHAAAABnRSTlMA/wAAAACkwsAdAAAAIUlEQVR4nGP4z8CAC+GUIEXuABhgkTuABEiRw2cmae4EAH05X7xDolNRAAAAAElFTkSuQmCC"); - background-repeat: no-repeat; - background-position: center center; -} - -.token_tab { - /* images/white_tab.png */ - background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAJCAIAAACJ2loDAAAABnRSTlMA/wD/AP83WBt9AAAAMklEQVR4nGP4TwRgoK6i52c3bz5w6zMSA6tJn28d2Lx589nnCAYu63AaSLxJRLoJPwAAeNk0aG4opfMAAAAASUVORK5CYII="); - background-repeat: no-repeat; - background-position: left center; -} - -.line_caret, -.annotationLine.currentLine { /* Current line */ - background: #402800; -} - -.readonly .line_caret, -.readonly .annotationLine.currentLine { - background: #402800; -} - -/* Styling for html syntax highlighting */ -.entity-name-tag { - color: #E7ADE7; /* blue */ -} - -.entity-other-attribute-name { - color: #E7ADE7; /* blue */ -} - -.punctuation-definition-comment { - color: #33CC33; /* grey */ -} - -.comment { - color: #33CC33; /* grey */ -} - -.string-quoted { - color: #9C9CFF; /* orange */ -} - -.invalid { - color: red; - font-weight: bold; -} diff --git a/LCARStrek/browser/devtools/toolbox.css b/LCARStrek/browser/devtools/toolbox.css index dc9b191b..7006f26e 100644 --- a/LCARStrek/browser/devtools/toolbox.css +++ b/LCARStrek/browser/devtools/toolbox.css @@ -250,7 +250,6 @@ notification { /* !important is required otherwise font-size will still be 1.4rem */ font-style: italic; padding: 4px 0 0; /* To align it with the checkbox */ - color: #A09090; } .options-citation-label + label { diff --git a/LCARStrek/browser/devtools/webconsole.css b/LCARStrek/browser/devtools/webconsole.css index bc546f9c..dbdcd318 100644 --- a/LCARStrek/browser/devtools/webconsole.css +++ b/LCARStrek/browser/devtools/webconsole.css @@ -112,9 +112,13 @@ a { color: inherit; } +.jsterm-input-container { + border-top-width: 1px; + border-top-style: solid; +} + #output-wrapper { direction: ltr; - border-bottom: 1px solid #9C9CFF; overflow: auto; } @@ -297,11 +301,11 @@ a { .jsterm-complete-node { -moz-padding-start: 16px; margin: 3px 0 0 0; + background-color: transparent; } .jsterm-input-node { background: -moz-image-rect(url("chrome://browser/skin/devtools/commandline-icon.png"), 0, 32, 16, 16) no-repeat; - background-position: 0%; } :-moz-any(.jsterm-input-node, @@ -309,10 +313,6 @@ a { overflow-x: hidden; } -.jsterm-complete-node > .textbox-input-box > .textbox-textarea { - color: #8050B0; -} - .inlined-variables-view .body { display: flex; flex-direction: column; @@ -360,7 +360,42 @@ a { } .navigation-marker .url { - background-color: #000000; -moz-padding-end: 9px; text-decoration: none; } + +/* 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 */ +} + +/* Replace these values with CSS variables as available */ +.theme-light .jsterm-input-container { + background-color: #000000; /* tabToolbarBackgroundColor */ + border-color: #9C9CFF; /* mainBackgroundColor */ +} + +.theme-light .jsterm-input-node { + color: #E7ADE7; /* textColor */ +} + +.theme-light .jsterm-complete-node { + color: #A09090; /* commentColor */ +} + +.theme-light .navigation-marker .url { + background: #000000; /* mainBackgroundColor */ +} diff --git a/LCARStrek/browser/devtools/widgets.css b/LCARStrek/browser/devtools/widgets.css index 394d7323..15436e88 100644 --- a/LCARStrek/browser/devtools/widgets.css +++ b/LCARStrek/browser/devtools/widgets.css @@ -455,6 +455,7 @@ } .variable-or-property > .title > .value { + -moz-box-flex: 1; -moz-padding-start: 6px; -moz-padding-end: 4px; } @@ -478,6 +479,9 @@ .variables-view-variable { -moz-margin-start: 1px; -moz-margin-end: 1px; +} + +.variables-view-variable:not(:last-child) { border-bottom: 1px solid #A09090; } @@ -585,6 +589,7 @@ } .variables-view-container[aligned-values] .title > .value { + -moz-box-flex: 0; width: 70vw; } @@ -594,10 +599,15 @@ /* Actions first */ -.variables-view-container[actions-first] .variables-view-delete { +.variables-view-container[actions-first] .variables-view-delete, +.variables-view-container[actions-first] .variables-view-add-property { -moz-box-ordinal-group: 0; } +.variables-view-container[actions-first] [invisible] { + visibility: hidden; +} + /* Variables and properties tooltips */ .variable-or-property > tooltip > label { @@ -633,10 +643,6 @@ -moz-image-region: rect(0, 48px, 16px, 32px); } -.variables-view-delete > .toolbarbutton-text { - display: none; -} - .variables-view-edit { background: url("chrome://browser/skin/devtools/vview-edit.png") center no-repeat; width: 20px; @@ -710,7 +716,7 @@ .variables-view-container.manifest-editor { background-color: #000000; - padding: 20px 13px; + padding: 20px 2px; } .manifest-editor .variable-or-property:focus > .title { @@ -723,7 +729,8 @@ /* color: #27406A; */ } -.manifest-editor .variable-or-property > .title > label { +.manifest-editor .variable-or-property > .title > label, +.manifest-editor textbox { font-family: monospace; } @@ -756,18 +763,30 @@ .manifest-editor .variables-view-delete, .manifest-editor .variables-view-delete:hover, -.manifest-editor .variables-view-delete:active { +.manifest-editor .variables-view-delete:active, +.manifest-editor .variables-view-add-property:hover, +.manifest-editor .variables-view-add-property:active { list-style-image: none; -moz-image-region: initial; } -.manifest-editor .variables-view-delete::before { - width: 12px; - height: 12px; +.manifest-editor .variables-view-delete::before, +.manifest-editor .variables-view-add-property::before { + width: 11px; + height: 11px; content: ""; display: inline-block; + background-size: 11px auto; +} + +.manifest-editor .variables-view-delete::before { background-image: url("app-manager/remove.svg"); background-size: 12px auto; } +.manifest-editor .variables-view-add-property::before { + background-image: url("app-manager/add.svg"); + -moz-margin-end: 2px; +} + /* === END manifest-editor.inc.css === */ -- 2.43.0