diff options
author | Matt A. Tobin <mattatobin@localhost.localdomain> | 2018-02-02 04:16:08 -0500 |
---|---|---|
committer | Matt A. Tobin <mattatobin@localhost.localdomain> | 2018-02-02 04:16:08 -0500 |
commit | 5f8de423f190bbb79a62f804151bc24824fa32d8 (patch) | |
tree | 10027f336435511475e392454359edea8e25895d /devtools/client/debugger/new/styles.css | |
parent | 49ee0794b5d912db1f95dce6eb52d781dc210db5 (diff) | |
download | UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.gz UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.lz UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.xz UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.zip |
Add m-esr52 at 52.6.0
Diffstat (limited to 'devtools/client/debugger/new/styles.css')
-rw-r--r-- | devtools/client/debugger/new/styles.css | 1724 |
1 files changed, 1724 insertions, 0 deletions
diff --git a/devtools/client/debugger/new/styles.css b/devtools/client/debugger/new/styles.css new file mode 100644 index 000000000..479bee363 --- /dev/null +++ b/devtools/client/debugger/new/styles.css @@ -0,0 +1,1724 @@ +:root.theme-light, +:root .theme-light { + --theme-search-overlays-semitransparent: rgba(221, 225, 228, 0.66); +} + +* { + box-sizing: border-box; +} + +html, +body { + height: 100%; + margin: 0; + padding: 0; + width: 100%; +} + +#mount { + display: flex; + height: 100%; +} + + +::-webkit-scrollbar { + width: 8px; + height: 8px; + background: transparent; +} + +::-webkit-scrollbar-track { + border-radius: 8px; + background: transparent; +} + +::-webkit-scrollbar-thumb { + border-radius: 8px; + background: rgba(113,113,113,0.5); +} + +:root.theme-dark .CodeMirror-scrollbar-filler { + background: transparent; +} +.landing-page { + flex: 1; + display: flex; + width: 100%; + height: 100%; + flex-direction: row; +} + +.landing-page .sidebar { + display: flex; + background-color: var(--theme-tab-toolbar-background); + width: 200px; + height: 100%; + flex-direction: column; +} + +.landing-page .sidebar h1 { + color: var(--theme-body-color); + font-size: 24px; + margin: 0; + line-height: 30px; + font-weight: normal; + padding: 40px 20px; +} + +.landing-page .sidebar ul { + list-style: none; + padding: 0; + line-height: 30px; + font-size: 18px; +} + +.landing-page .sidebar li { + padding: 5px 20px; +} + +.landing-page .sidebar li.selected { + background: var(--theme-search-overlays-semitransparent); + transition: all 0.25s ease; +} + +.landing-page .sidebar li:hover { + background: var(--theme-selection-background); + cursor: pointer; +} + +.landing-page .sidebar li a { + color: var(--theme-body-color); +} + +.landing-page .sidebar li:hover a { + color: var(--theme-selection-color); +} + +.landing-page .panel { + display: flex; + flex: 1; + height: 100%; + overflow: auto; + flex-direction: column; +} + +.landing-page .panel .title { + margin: 20px 40px; + width: calc(100% - 80px); + font-size: 16px; + border-bottom: 1px solid var(--theme-splitter-color); + height: 54px; +} + +.landing-page .panel h2 { + color: var(--theme-body-color); + font-weight: normal; +} + +.landing-page .panel .center { + flex: 1; + display: flex; + flex-direction: column; +} + +.landing-page .panel .center .center-message { + margin: 40px; + font-size: 16px; + line-height: 25px; + padding: 10px; +} + +.landing-page .center a { + color: var(--theme-highlight-bluegrey); + text-decoration: none; +} + +.landing-page .tab-group { + margin: 40px; +} + +.landing-page .tab-list { + list-style: none; + padding: 0px; + margin: 0px; +} + +.landing-page .tab { + border-bottom: 1px solid var(--theme-splitter-color); + padding: 10px; + font-family: sans-serif; +} + +.landing-page .tab:hover { + background-color: var(--theme-toolbar-background); + cursor: pointer; +} + +.landing-page .tab-title { + line-height: 25px; + font-size: 16px; + color: var(--theme-highlight-bluegrey); +} + +.landing-page .tab-url { + color: var(--theme-comment); +} + +.landing-page .panel .center .footer-note { + flex: 1; + padding: 50px; + font-size: 14px; + color: var(--theme-comment); + bottom: 0; + position: absolute; +} +/* vim:set ts=2 sw=2 sts=2 et: */ + +/* 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/. */ + +:root.theme-light, +:root .theme-light { + --theme-search-overlays-semitransparent: rgba(221, 225, 228, 0.66); + --theme-faded-tab-color: #7e7e7e; +} + +:root.theme-dark, +:root .theme-dark { + --theme-faded-tab-color: #6e7d8c; +} + +* { + box-sizing: border-box; +} + +html, +body { + height: 100%; + margin: 0; + padding: 0; + width: 100%; +} + +#mount { + display: flex; + height: 100%; +} + +.debugger { + display: flex; + flex: 1; + height: 100%; +} + +.center-pane { + display: flex; + position: relative; + flex: 1; + background-color: var(--theme-tab-toolbar-background); + overflow: hidden; +} + +.editor-container { + display: flex; + flex: 1; +} + +.subsettings:hover { + cursor: pointer; +} + +.search-container { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + display: flex; + z-index: 200; + background-color: var(--theme-search-overlays-semitransparent); +} + +.search-container .autocomplete { + flex: 1; +} + +.search-container .close-button { + width: 16px; + margin-top: 25px; + margin-right: 20px; +} + +.welcomebox { + width: calc(100% - 1px); + + /* Offsetting it by 30px for the sources-header area */ + height: calc(100% - 30px); + position: absolute; + top: 30px; + left: 0; + padding: 50px 0; + text-align: center; + font-size: 1.25em; + color: var(--theme-comment-alt); + background-color: var(--theme-tab-toolbar-background); + font-weight: lighter; + z-index: 100; +} +menupopup { + position: fixed; + z-index: 10000; + background: white; + border: 1px solid #cccccc; + padding: 5px 0; + background: #f2f2f2; + border-radius: 5px; + color: #585858; + box-shadow: 0 0 4px 0 rgba(190, 190, 190, 0.8); + min-width: 130px; +} + +menuitem { + display: block; + padding: 0 20px; + line-height: 20px; + font-weight: 500; + font-size: 13px; +} + +menuitem:hover { + background: #3780fb; + color: white; + cursor: pointer; +} + +menuseparator { + border-bottom: 1px solid #cacdd3; + width: 100%; + height: 5px; + display: block; + margin-bottom: 5px; +} + +#contextmenu-mask.show { + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + z-index: 999; +} +/* vim:set ts=2 sw=2 sts=2 et: */ +/* 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/. */ + +.split-box { + display: flex; + flex: 1; + min-width: 0; + height: 100%; + width: 100%; +} + +.split-box.vert { + flex-direction: row; +} + +.split-box.horz { + flex-direction: column; +} + +.split-box > .uncontrolled { + display: flex; + flex: 1; + min-width: 0; + overflow: auto; +} + +.split-box > .controlled { + display: flex; + overflow: auto; +} + +.split-box > .splitter { + background-image: none; + border: 0; + border-style: solid; + border-color: transparent; + background-color: var(--theme-splitter-color); + background-clip: content-box; + position: relative; + + box-sizing: border-box; + + /* Positive z-index positions the splitter on top of its siblings and makes + it clickable on both sides. */ + z-index: 1; +} + +.split-box.vert > .splitter { + min-width: calc(var(--devtools-splitter-inline-start-width) + + var(--devtools-splitter-inline-end-width) + 1px); + + border-left-width: var(--devtools-splitter-inline-start-width); + border-right-width: var(--devtools-splitter-inline-end-width); + + margin-left: calc(-1 * var(--devtools-splitter-inline-start-width) - 1px); + margin-right: calc(-1 * var(--devtools-splitter-inline-end-width)); + + cursor: ew-resize; +} + +.split-box.horz > .splitter { + min-height: calc(var(--devtools-splitter-top-width) + + var(--devtools-splitter-bottom-width) + 1px); + + border-top-width: var(--devtools-splitter-top-width); + border-bottom-width: var(--devtools-splitter-bottom-width); + + margin-top: calc(-1 * var(--devtools-splitter-top-width) - 1px); + margin-bottom: calc(-1 * var(--devtools-splitter-bottom-width)); + + cursor: ns-resize; +} + +.split-box.disabled { + pointer-events: none; +} + +/** + * Make sure splitter panels are not processing any mouse + * events. This is good for performance during splitter + * bar dragging. + */ +.split-box.dragging > .controlled, +.split-box.dragging > .uncontrolled { + pointer-events: none; +} +/* vim:set ts=2 sw=2 sts=2 et: */ +/* 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/. */ + +.theme-dark, +.theme-light { + --number-color: var(--theme-highlight-green); + --string-color: var(--theme-highlight-orange); + --null-color: var(--theme-comment); + --object-color: var(--theme-body-color); + --caption-color: var(--theme-highlight-blue); + --location-color: var(--theme-content-color1); + --source-link-color: var(--theme-highlight-blue); + --node-color: var(--theme-highlight-bluegrey); + --reference-color: var(--theme-highlight-purple); +} + +.theme-firebug { + --number-color: #000088; + --string-color: #FF0000; + --null-color: #787878; + --object-color: DarkGreen; + --caption-color: #444444; + --location-color: #555555; + --source-link-color: blue; + --node-color: rgb(0, 0, 136); + --reference-color: rgb(102, 102, 255); +} + +/******************************************************************************/ + +.objectLink:hover { + cursor: pointer; + text-decoration: underline; +} + +.inline { + display: inline; + white-space: normal; +} + +.objectBox-object { + font-weight: bold; + color: var(--object-color); + white-space: pre-wrap; +} + +.objectBox-string, +.objectBox-text, +.objectLink-textNode, +.objectBox-table { + white-space: pre-wrap; +} + +.objectBox-number, +.objectLink-styleRule, +.objectLink-element, +.objectLink-textNode, +.objectBox-array > .length { + color: var(--number-color); +} + +.objectBox-string { + color: var(--string-color); +} + +.objectLink-function, +.objectBox-stackTrace, +.objectLink-profile { + color: var(--object-color); +} + +.objectLink-Location { + font-style: italic; + color: var(--location-color); +} + +.objectBox-null, +.objectBox-undefined, +.objectBox-hint, +.logRowHint { + font-style: italic; + color: var(--null-color); +} + +.objectLink-sourceLink { + position: absolute; + right: 4px; + top: 2px; + padding-left: 8px; + font-weight: bold; + color: var(--source-link-color); +} + +/******************************************************************************/ + +.objectLink-event, +.objectLink-eventLog, +.objectLink-regexp, +.objectLink-object, +.objectLink-Date { + font-weight: bold; + color: var(--object-color); + white-space: pre-wrap; +} + +/******************************************************************************/ + +.objectLink-object .nodeName, +.objectLink-NamedNodeMap .nodeName, +.objectLink-NamedNodeMap .objectEqual, +.objectLink-NamedNodeMap .arrayLeftBracket, +.objectLink-NamedNodeMap .arrayRightBracket, +.objectLink-Attr .attrEqual, +.objectLink-Attr .attrTitle { + color: var(--node-color); +} + +.objectLink-object .nodeName { + font-weight: normal; +} + +/******************************************************************************/ + +.objectLeftBrace, +.objectRightBrace, +.arrayLeftBracket, +.arrayRightBracket { + cursor: pointer; + font-weight: bold; +} + +.objectLeftBrace, +.arrayLeftBracket { + margin-right: 4px; +} + +.objectRightBrace, +.arrayRightBracket { + margin-left: 4px; +} + +/******************************************************************************/ +/* Cycle reference*/ + +.objectLink-Reference { + font-weight: bold; + color: var(--reference-color); +} + +.objectBox-array > .objectTitle { + font-weight: bold; + color: var(--object-color); +} + +.caption { + font-weight: bold; + color: var(--caption-color); +} + +/******************************************************************************/ +/* Themes */ + +.theme-dark .objectBox-null, +.theme-dark .objectBox-undefined, +.theme-light .objectBox-null, +.theme-light .objectBox-undefined { + font-style: normal; +} + +.theme-dark .objectBox-object, +.theme-light .objectBox-object { + font-weight: normal; + white-space: pre-wrap; +} + +.theme-dark .caption, +.theme-light .caption { + font-weight: normal; +} +/* vim:set ts=2 sw=2 sts=2 et: */ + +/* 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/. */ + +.search-container { + position: absolute; + top: 30px; + left: 0; + width: calc(100% - 1px); + height: calc(100% - 31px); + display: flex; + z-index: 200; + background-color: var(--theme-body-background); +} + +.search-container .autocomplete { + flex: 1; +} + +.searchinput-container { + display: flex; +} + +.searchinput-container .close-btn-big { + border-bottom: 1px solid var(--theme-splitter-color); +} + +.autocomplete { + width: 100%; +} + +.autocomplete .results * { + -moz-user-select: none; + user-select: none; +} + +.autocomplete .results-summary { + margin: 10px; +} + +.autocomplete ul { + list-style: none; + width: 100%; + max-height: calc(100% - 32px); + margin: 0px; + padding: 0px; + overflow: auto; +} + +.autocomplete li { + border: 2px solid var(--theme-splitter-color); + background-color: var(--theme-tab-toolbar-background); + padding: 10px; + margin: 10px; +} + +.autocomplete li:hover { + background: var(--theme-tab-toolbar-background); + cursor: pointer; +} + +.autocomplete li.selected { + border: 2px solid var(--theme-selection-background); +} + +.autocomplete li .title { + line-height: 1.5em; + word-break: break-all; +} + +.autocomplete li .subtitle { + line-height: 1.5em; + color: grey; + word-break: break-all; +} + +.autocomplete input { + width: 100%; + border: none; + background-color: var(--theme-body-background); + color: var(--theme-comment); + border-bottom: 1px solid var(--theme-splitter-color); + outline: none; + line-height: 30px; + font-size: 14px; + height: 40px; + padding-left: 30px; +} + +.autocomplete input::placeholder { + color: var(--theme-body-color-inactive); +} + +.autocomplete .magnifying-glass svg { + width: 16px; + position: absolute; + top: 12px; + left: 10px; +} + +.autocomplete.focused .magnifying-glass path, +.autocomplete.focused .magnifying-glass ellipse { + stroke: var(--theme-highlight-blue); +} + +.autocomplete .magnifying-glass path, +.autocomplete .magnifying-glass ellipse { + stroke: var(--theme-splitter-color); +} + +.autocomplete .no-result-msg { + display: flex; + align-items: center; + justify-content: center; + width: 100%; + height: 100%; + color: var(--theme-graphs-full-red); + font-size: 24px; +} + +.autocomplete .no-result-msg .sad-face { + width: 24px; + margin-right: 4px; + line-height: 0; +} + +.autocomplete .no-result-msg .sad-face svg { + fill: var(--theme-graphs-full-red); +} +.close-btn path { + fill: var(--theme-body-color); +} + +.close-btn .close { + cursor: pointer; + width: 12px; + height: 12px; + padding: 2px; + text-align: center; + margin-top: 2px; + line-height: 5px; + transition: all 0.25s easeinout; +} + +.close-btn .close svg { + width: 6px; +} + +.close-btn .close:hover { + background: var(--theme-selection-background); + border-radius: 2px; +} + +.close-btn .close:hover path { + fill: white; +} + +.close-btn-big { + padding: 13px; + width: 40px; + height: 40px; +} + +.close-btn-big path { + fill: var(--theme-body-color); +} + +.close-btn-big .close { + cursor: pointer; + display: inline-block; + padding: 2px; + text-align: center; + transition: all 0.25s easeinout; + line-height: 100%; + width: 16px; + height: 16px; +} + +.close-btn-big .close svg { + width: 9px; + height: 9px; +} + +.close-btn-big .close:hover { + background: var(--theme-selection-background); + border-radius: 2px; +} + +.close-btn-big .close:hover path { + fill: white; +} +.tree { + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + -o-user-select: none; + user-select: none; + + flex: 1; + white-space: nowrap; + overflow: auto; +} + +.tree button { + display: block; +} + +.tree .node { + padding: 2px 5px; + position: relative; +} + +.tree .node.focused { + color: white; + background-color: var(--theme-selection-background); +} + +html:not([dir="rtl"]) .tree .node > div { + margin-left: 10px; +} + +html[dir="rtl"] .tree .node > div { + margin-right: 10px; +} + +.tree .node.focused svg { + fill: white; +} + +.tree-node button { + position: fixed; +} +.sources-panel { + flex: 1; + display: flex; + flex-direction: column; + overflow: hidden; +} + +.sources-panel * { + -moz-user-select: none; + user-select: none; +} + +.sources-header { + height: 30px; + border-bottom: 1px solid var(--theme-splitter-color); + padding-top: 0px; + padding-bottom: 0px; + line-height: 30px; + font-size: 1.2em; + display: flex; + align-items: baseline; + justify-content: space-between; + -moz-user-select: none; + user-select: none; +} + +html:not([dir="rtl"]) .sources-header { + padding-left: 10px; +} + +html[dir="rtl"] .sources-header { + padding-right: 10px; +} + +.sources-header-info { + font-size: 12px; + color: var(--theme-comment-alt); + font-weight: lighter; + white-space: nowrap; +} + +html:not([dir="rtl"]) .sources-header-info { + padding-right: 10px; + float: right; +} + +html[dir="rtl"] .sources-header-info { + padding-left: 10px; + float: left; +} + +.sources-list { + flex: 1; + display: flex; + overflow: hidden; +} + +.arrow, +.folder, +.domain, +.file, +.worker { + fill: var(--theme-splitter-color); +} + +.domain, +.file, +.worker { + position: relative; + top: 1px; +} + +.worker, +.folder { + position: relative; + top: 2px; +} + +.domain svg, +.folder svg, +.worker svg { + width: 15px; +} + +.file svg { + width: 13px; +} + +html:not([dir="rtl"]) .file svg, +html:not([dir="rtl"]) .domain svg, +html:not([dir="rtl"]) .folder svg, +html:not([dir="rtl"]) .worker svg { + margin-right: 5px; +} + +html[dir="rtl"] .file svg, +html[dir="rtl"] .domain svg, +html[dir="rtl"] .folder svg, +html[dir="rtl"] .worker svg { + margin-left: 5px; +} + +.tree { + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + -o-user-select: none; + user-select: none; + + flex: 1; + white-space: nowrap; + overflow: auto; +} + +.tree button { + display: block; +} + +.tree .node { + padding: 2px 5px; + position: relative; + cursor: pointer; +} + +.tree .node:hover { + background: var(--theme-tab-toolbar-background); +} + +.tree .node.focused { + color: white; + background-color: var(--theme-selection-background); +} + +.tree .node > div { + margin-left: 10px; +} + +.tree .node.focused svg { + fill: white; +} + +.sources-list .tree-node button { + position: fixed; +} + +.source-footer { + background: var(--theme-body-background); + border-top: 1px solid var(--theme-splitter-color); + position: absolute; + bottom: 0; + left: 0; + right: 1px; + opacity: 1; + z-index: 100; + -moz-user-select: none; + user-select: none; +} + +html:not([dir="rtl"]) .source-footer .command-bar { + float: right; +} + +html[dir="rtl"] .source-footer .command-bar { + float: left; +} + +.source-footer .command-bar * { + -moz-user-select: none; + user-select: none; +} + +.command-bar > span { + cursor: pointer; + width: 1em; + height: 1.1em; + display: inline-block; + text-align: center; + transition: opacity 200ms; +} + +html:not([dir="rtl"]) .command-bar > span { + margin-right: 0.7em; +} + +html[dir="rtl"] .command-bar > span { + margin-left: 0.7em; +} + +.source-footer .prettyPrint.pretty { + stroke: var(--theme-highlight-blue); +} + +.source-footer input:focus { + border-color: var(--theme-highlight-blue); + outline: none; +} + +.source-footer input { + line-height: 16px; + margin: 7px; + border-radius: 2px; + border: 1px solid var(--theme-splitter-color); + padding-left: 4px; + font-size: 10px; +} +.search-bar { + width: calc(100% - 1px); + height: 40px; + background: white; + border-bottom: 1px solid var(--theme-splitter-color); + display: flex; +} + +.search-bar i { + display: block; + padding: 13px 0 0 13px; + width: 40px; +} + +.search-bar i svg { + width: 16px; +} + +.search-bar input { + border: none; + line-height: 30px; + font-size: 14px; + background-color: var(--theme-body-background); + color: var(--theme-comment); + width: calc(100% - 38px); + flex: 1; +} + +.search-bar .magnifying-glass { + background-color: var(--theme-body-background); + width: 40px; +} + +.search-bar .magnifying-glass path, +.search-bar .magnifying-glass ellipse { + stroke: var(--theme-splitter-color); +} + +.search-bar input::placeholder { + color: var(--theme-body-color-inactive); +} + +.search-bar input:focus { + outline-width: 0; +} + +.search-bar input.empty { + color: var(--theme-highlight-orange); +} + +.search-bar .summary { + line-height: 40px; + padding-right: 10px; + color: var(--theme-body-color-inactive); +} +/* vim:set ts=2 sw=2 sts=2 et: */ + +/* 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/. */ + +/** + * There's a known codemirror flex issue with chrome that this addresses. + * BUG https://github.com/devtools-html/debugger.html/issues/63 + */ +.editor-wrapper { + position: absolute; + height: calc(100% - 31px); + width: 100%; + top: 30px; + left: 0px; +} + +html[dir="rtl"] .editor-mount { + direction: ltr; +} + +.editor-wrapper .breakpoints { + position: absolute; + top: 0; + left: 0; +} + +.editor.new-breakpoint svg { + fill: var(--theme-selection-background); + width: 60px; + height: 14px; + position: absolute; + top: 0px; + right: -4px; +} + +.new-breakpoint.has-condition svg { + fill: var(--theme-graphs-yellow); +} + +.editor.new-breakpoint.breakpoint-disabled svg { + opacity: 0.3; +} + +.CodeMirror { + width: 100%; + height: 100%; +} + +.editor-wrapper .editor-mount { + width: 100%; + height: calc(100% - 32px); + background-color: var(--theme-body-background); +} + +.search-bar ~ .editor-mount { + height: calc(100% - 72px); +} + +.CodeMirror-linenumber { + font-size: 11px; + line-height: 14px; +} + +/* set the linenumber white when there is a breakpoint */ +.new-breakpoint .CodeMirror-gutter-wrapper .CodeMirror-linenumber { + color: white; +} + +/* move the breakpoint below the linenumber */ +.new-breakpoint .CodeMirror-gutter-elt:last-child { + z-index: 0; +} + +.editor-wrapper .CodeMirror-line { + font-size: 11px; + line-height: 14px; +} + +.debug-line .CodeMirror-line { + background-color: var(--breakpoint-active-color) !important; +} + +/* Don't display the highlight color since the debug line + is already highlighted */ +.debug-line .CodeMirror-activeline-background { + display: none; +} + +.highlight-line .CodeMirror-line { + animation: fade-highlight-out 1.5s normal forwards; +} + +@keyframes fade-highlight-out { + 0% { background-color: var(--theme-highlight-gray); } + 100% { background-color: transparent; } +} + +.welcomebox { + width: calc(100% - 1px); + + /* Offsetting it by 30px for the sources-header area */ + height: calc(100% - 30px); + position: absolute; + top: 30px; + left: 0; + padding: 50px 0; + text-align: center; + font-size: 1.25em; + color: var(--theme-comment-alt); + background-color: var(--theme-tab-toolbar-background); + font-weight: lighter; + z-index: 100; + -moz-user-select: none; + user-select: none; +} + +.conditional-breakpoint-panel { + cursor: initial; + margin: 1em 0; + position: relative; + background: var(--theme-toolbar-background); + border-top: 1px solid var(--theme-splitter-color); + border-bottom: 1px solid var(--theme-splitter-color); +} + +.conditional-breakpoint-panel input { + margin: 5px 10px; + width: calc(100% - 2em); + border: none; + background: var(--theme-toolbar-background); + font-size: 14px; + color: var(--theme-comment); + line-height: 30px; +} + +.conditional-breakpoint-panel input:focus { + outline-width: 0; +} +.breakpoints-list * { + -moz-user-select: none; + user-select: none; +} + +.breakpoints-list .breakpoint { + font-size: 12px; + color: var(--theme-content-color1); + padding: 0.5em 1px; + line-height: 1em; + position: relative; + border-left: 4px solid transparent; + transition: all 0.25s ease; +} + +.breakpoints-list .breakpoint:last-of-type { + padding-bottom: 0.45em; +} + +.breakpoints-list .breakpoint.paused { + background-color: var(--theme-toolbar-background-alt); + border-color: var(--breakpoint-active-color); +} + +.breakpoints-list .breakpoint.disabled .breakpoint-label { + color: var(--theme-content-color3); + transition: color 0.5s linear; +} + +.breakpoints-list .breakpoint:hover { + cursor: pointer; + background-color: var(--theme-search-overlays-semitransparent); +} + +.breakpoints-list .breakpoint.paused:hover { + border-color: var(--breakpoint-active-color-hover); +} + +.breakpoints-list .breakpoint-checkbox { + margin-left: 0; +} + +.breakpoints-list .breakpoint-label { + display: inline-block; + padding-left: 2px; + padding-bottom: 4px; +} + +.breakpoints-list .pause-indicator { + flex: 0 1 content; + order: 3; +} + +.breakpoint-snippet { + color: var(--theme-comment); + padding-left: 18px; +} + +.breakpoint .close-btn { + position: absolute; + right: 6px; + top: 12px; +} + +.breakpoint .close { + display: none; +} + +.breakpoint:hover .close { + display: block; +} +.input-expression { + width: 100%; + padding: 5px; + margin: 0px; + border: none; + cursor: hand; +} + +.expression-container { + border: 1px; + padding: 5px 2px 5px 5px; + margin: 1px; + width: 100%; + color: var(--theme-body-color) !important; + background-color: var(--theme-tab-toolbar-background); +} + +.expression-container:hover { + background-color: var(--theme-selection-background); + color: var(--theme-body-background) !important; +} + +.expression-output-container .close-btn { + width: 6px; + height: 6px; + float: right; + margin-right: 6px; + display: block; + cursor: pointer; +} + +.expression-input { + cursor: pointer; + max-width: 50%; +} + +.expression-value { + overflow-x: scroll; + color: var(--theme-content-color2); + max-width: 50% !important; +} + +.expression-error { + color: var(--theme-highlight-red); +} +.arrow svg { + fill: var(--theme-splitter-color); + margin-top: 3px; + transition: transform 0.25s ease; + width: 10px; +} + +html:not([dir="rtl"]) .arrow svg { + margin-right: 5px; + transform: rotate(-90deg); +} + +html[dir="rtl"] .arrow svg { + margin-left: 5px; + transform: rotate(90deg); +} + +/* TODO (Amit): html is just for specificity. keep it like this? */ +html .arrow.expanded svg { + transform: rotate(0deg); +} + +.arrow.hidden { + visibility: hidden; +} + +.object-label { + color: var(--theme-highlight-blue); +} + +.objectBox-object, +.objectBox-string, +.objectBox-text, +.objectBox-table, +.objectLink-textNode, +.objectLink-event, +.objectLink-eventLog, +.objectLink-regexp, +.objectLink-object, +.objectLink-Date, +.theme-dark .objectBox-object, +.theme-light .objectBox-object { + white-space: nowrap; +} + +.scopes-list .tree-node { + overflow: hidden; +} +.frames ul { + list-style: none; + margin: 0; + padding: 0; +} + +.frames ul li { + cursor: pointer; + padding: 7px 10px 7px 21px; + clear: both; + overflow: hidden; +} + +/* Style the focused call frame like so: +.frames ul li:focus { + border: 3px solid red; +} +*/ + +.frames ul li * { + -moz-user-select: none; + user-select: none; +} + +.frames ul li:nth-of-type(2n) { + background-color: var(--theme-tab-toolbar-background); +} + +.frames .location { + float: right; + color: var(--theme-comment); + font-weight: lighter; +} + +.frames .title { + float: left; + text-overflow: ellipsis; + overflow: hidden; + margin-right: 1em; +} + +.frames ul li.selected, +.frames ul li.selected .location { + background-color: var(--theme-selection-background); + color: white; +} + +.show-more { + cursor: pointer; + text-align: center; + padding: 8px 0px; + border-top: 1px solid var(--theme-splitter-color); + background-color: var(--theme-tab-toolbar-background); +} + +.show-more:hover { + background-color: var(--theme-search-overlays-semitransparent); +} +.accordion { + background-color: var(--theme-body-background); + width: 100%; +} + +.accordion ._header { + background-color: var(--theme-toolbar-background); + border-bottom: 1px solid var(--theme-splitter-color); + cursor: pointer; + font-size: 12px; + padding: 5px; + transition: all 0.25s ease; + width: 100%; + + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + -o-user-select: none; + user-select: none; +} + +.accordion ._header:hover { + background-color: var(--theme-search-overlays-semitransparent); +} + +.accordion ._header:hover svg { + fill: var(--theme-comment-alt); +} + +.accordion ._content { + border-bottom: 1px solid var(--theme-splitter-color); + font-size: 12px; +} +.right-sidebar { + display: flex; + flex-direction: column; + flex: 1; + white-space: nowrap; +} + +.right-siderbar * { + -moz-user-select: none; + user-select: none; +} + +.right-sidebar .accordion { + overflow-y: auto; + overflow-x: hidden; +} + +.right-sidebar .command-bar { + border-bottom: 1px solid var(--theme-splitter-color); +} + +.command-bar { + height: 30px; +} + +html:not([dir="rtl"]) .command-bar { + padding: 8px 5px 10px 1px; +} + +html[dir="rtl"] .command-bar { + padding: 8px 1px 10px 5px; +} + +.command-bar > span { + cursor: pointer; + width: 16px; + height: 17px; + display: inline-block; + text-align: center; + transition: all 0.25s ease; +} + +:root.theme-dark .command-bar > span { + fill: var(--theme-body-color); +} + +:root.theme-dark .command-bar > span:hover { + fill: var(--theme-selection-color); +} + +html:not([dir="rtl"]) .command-bar > span { + margin-right: 0.7em; +} + +html[dir="rtl"] .command-bar > span { + margin-left: 0.7em; +} + +.command-bar > span.disabled { + opacity: 0.3; + cursor: default; +} + +html:not([dir="rtl"]) .command-bar .stepOut { + margin-right: 2em; +} + +html[dir="rtl"] .command-bar .stepOut { + margin-left: 2em; +} + +.command-bar .subSettings { + float: right; +} + +.pane { + color: var(--theme-body-color); +} + +.pane .pane-info { + font-style: italic; + text-align: center; + padding: 0.5em; + -moz-user-select: none; + user-select: none; +} + +.toggleBreakpoints.breakpoints-disabled path { + stroke: var(--theme-highlight-blue); +} + +span.pause-exceptions.uncaught { + stroke: var(--theme-highlight-purple); +} + +span.pause-exceptions.all { + stroke: var(--theme-highlight-blue); +} +.source-header { + border-bottom: 1px solid var(--theme-splitter-color); + height: 30px; + flex: 1; +} + +.source-header * { + -moz-user-select: none; + user-select: none; +} + +.source-tabs { + min-width: 50px; + max-width: calc(100% - 60px); + overflow: hidden; + float: left; +} + +.source-header .new-tab-btn { + width: 16px; + display: inline-block; + position: relative; + top: 4px; + margin: 4px; + line-height: 0; +} + +.source-header .new-tab-btn path { + fill: var(--theme-splitter-color); +} + +.source-header .new-tab-btn:hover path { + fill: var(--theme-comment); +} + +.source-tab { + background-color: var(--theme-toolbar-background-alt); + color: var(--theme-faded-tab-color); + border: 1px solid var(--theme-splitter-color); + border-top-left-radius: 2px; + border-top-right-radius: 2px; + height: 23px; + line-height: 20px; + display: inline-block; + border-bottom: none; + position: relative; + transition: all 0.25s ease; + min-width: 40px; + overflow: hidden; +} + +html:not([dir="rtl"]) .source-tab { + padding: 2px 20px 2px 12px; + margin: 6px 0 0 8px; +} + +html[dir="rtl"] .source-tab { + padding: 2px 12px 2px 20px; + margin: 6px 8px 0 0; +} + +.source-tab:hover { + background: var(--theme-toolbar-background); + cursor: pointer; +} + +.source-tab.active { + color: var(--theme-body-color); + background-color: var(--theme-body-background); +} + +.source-tab path { + fill: var(--theme-faded-tab-color); +} + +.source-tab.active path { + fill: var(--theme-body-color); +} + +.source-tab .close-btn { + position: absolute; + top: 3px; +} + +.source-tab .filename { + text-overflow: ellipsis; + overflow: hidden; +} + +html:not([dir="rtl"]) .source-tab .close-btn { + right: 4px; +} + +html[dir="rtl"] .source-tab .close-btn { + left: 4px; +} + +.source-tab .close { + display: none; +} + +.source-tab:hover .close { + display: block; +} +.dropdown { + background: var(--theme-body-background); + border: 1px solid var(--theme-splitter-color); + box-shadow: 0 4px 4px 0 var(--theme-search-overlays-semitransparent); + max-height: 300px; + position: absolute; + right: 8px; + top: 35px; + width: 150px; + z-index: 1000; +} + +.dropdown-button { + position: absolute; + right: 12px; + top: 5px; + font-size: 16px; + color: var(--theme-body-color); + cursor: pointer; +} + +.dropdown li { + transition: all 0.25s ease; + padding: 2px 10px 10px 5px; + overflow: hidden; + height: 30px; + text-overflow: ellipsis; +} + +.dropdown li:hover { + background-color: var(--theme-search-overlays-semitransparent); + cursor: pointer; +} + +.dropdown ul { + list-style: none; + line-height: 2em; + font-size: 1em; + margin: 0; + padding: 0; +} + +.dropdown-mask { + position: fixed; + width: 100%; + height: 100%; + background: transparent; + z-index: 999; + left: 0; + top: 0; +} + +/*# sourceMappingURL=styles.css.map*/
\ No newline at end of file |