From 5f8de423f190bbb79a62f804151bc24824fa32d8 Mon Sep 17 00:00:00 2001
From: "Matt A. Tobin" <mattatobin@localhost.localdomain>
Date: Fri, 2 Feb 2018 04:16:08 -0500
Subject: Add m-esr52 at 52.6.0

---
 devtools/client/debugger/new/styles.css | 1724 +++++++++++++++++++++++++++++++
 1 file changed, 1724 insertions(+)
 create mode 100644 devtools/client/debugger/new/styles.css

(limited to 'devtools/client/debugger/new/styles.css')

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
-- 
cgit v1.2.3