fourth and final part of syncing LCARStrek with Firefox 31 windows theme changes

[themes.git] / LCARStrek / browser / devtools / widgets.css

diff --git a/LCARStrek/browser/devtools/widgets.css b/LCARStrek/browser/devtools/widgets.css
index 95d314603f37dad2a0dbee498355eab1862061ec..b699b78e67dcc700d9a9aa30b3b7683aed801338 100644 (file)
--- a/LCARStrek/browser/devtools/widgets.css
+++ b/LCARStrek/browser/devtools/widgets.css
@@ -18,10 +18,38 @@
   transition: margin 0.25s ease-in-out;
 }
 
+/* Responsive container */
+
+.devtools-responsive-container {
+  -moz-box-orient: horizontal;
+}
+
+@media (max-width: 700px) {
+  .devtools-responsive-container {
+    -moz-box-orient: vertical;
+  }
+
+  .devtools-responsive-container > .devtools-side-splitter {
+    border: 0;
+    margin: 0;
+    min-height: 3px;
+    height: 3px;
+    margin-bottom: -3px;
+    /* In some edge case the cursor is not changed to n-resize */
+    cursor: n-resize;
+  }
+
+  .devtools-responsive-container > .devtools-sidebar-tabs {
+    min-height: 35vh;
+    max-height: 75vh;
+  }
+}
+
 /* BreacrumbsWidget */
 
 .breadcrumbs-widget-container {
-  -moz-margin-end: 3px;
+  -moz-margin-start: 2px;
+  -moz-margin-start: 2px;
   max-height: 25px; /* Set max-height for proper sizing on linux */
   height: 25px; /* Set height to prevent starting small waiting for content */
   /* A fake 1px-shadow is included in the border-images of the
@@ -129,12 +157,12 @@
 
 #breadcrumb-separator-before,
 #breadcrumb-separator-after:after {
-  background: #9C9CFF; /* Select Highlight Blue */
+  background: #008484; /* Select Highlight Blue */
 }
 
 #breadcrumb-separator-after,
 #breadcrumb-separator-before:after {
-  background: #9C9CFF; /* Toolbars */
+  background: #000000; /* Toolbars */
 }
 
 /* This chevron arrow cannot be replicated easily in CSS, so we are using
@@ -154,7 +182,7 @@
   width: 25px;
   height: 25px;
   transform: translateX(-18px) rotate(45deg);
-  -moz-box-sizing: border-box;
+  box-sizing: border-box;
 }
 
 .breadcrumbs-widget-item {
@@ -164,6 +192,7 @@
   margin: 0;
   padding: 0 8px 0 20px;
   border: none;
+  border-radius: 0;
   outline: none;
   color: #FF9F00;
 }
@@ -185,15 +214,21 @@
 }
 
 .breadcrumbs-widget-item:not([checked]) {
-  background: -moz-element(#breadcrumb-separator-normal) no-repeat center left;
- }
- 
+  background-image: -moz-element(#breadcrumb-separator-normal);
+  background-repeat: no-repeat;
+  background-position: center left;
+}
+
 .breadcrumbs-widget-item[checked] + .breadcrumbs-widget-item {
-  background: -moz-element(#breadcrumb-separator-after) no-repeat 0 0;
+  background-image: -moz-element(#breadcrumb-separator-after);
+  background-repeat: no-repeat;
+  background-position: 0 0;
 }
 
 .breadcrumbs-widget-item[checked] {
-  background: -moz-element(#breadcrumb-separator-before) no-repeat 0 0;
+  background-image: -moz-element(#breadcrumb-separator-before);
+  background-repeat: no-repeat;
+  background-position: 0 0;
   background-color: #008484; /* Select Highlight Blue */
 }
 
@@ -231,8 +266,15 @@
   color: #FF9F00; /* Foreground (Text) - Light */
 }
 
+.breadcrumbs-widget-item:not([checked]):hover .breadcrumbs-widget-item-id,
+.breadcrumbs-widget-item:not([checked]):hover .breadcrumbs-widget-item-tag,
+.breadcrumbs-widget-item:not([checked]):hover .breadcrumbs-widget-item-pseudo-classes,
+.breadcrumbs-widget-item:not([checked]):hover .breadcrumbs-widget-item-classes {
+  color: #000000 !important;
+}
+
 .breadcrumbs-widget-item {
-  color: #FF9F00; /* Foreground (Text) - Light */
+  color: #FFCF00; /* Foreground (Text) - Light */
 }
 
 .breadcrumbs-widget-item-id {
@@ -363,11 +405,11 @@
   background-position: center left;
 }
 
-.theme-light .side-menu-widget-item.selected > .side-menu-widget-item-arrow:-moz-locale-dir(ltr) {
+.side-menu-widget-item.selected > .side-menu-widget-item-arrow:-moz-locale-dir(ltr) {
   background-image: url("itemArrow-ltr.svg");
 }
 
-.theme-light .side-menu-widget-item.selected > .side-menu-widget-item-arrow:-moz-locale-dir(rtl) {
+.side-menu-widget-item.selected > .side-menu-widget-item-arrow:-moz-locale-dir(rtl) {
   background-image: url("itemArrow-rtl.svg");
 }
 
@@ -442,6 +484,12 @@
   padding: 2px;
 }
 
+.variables-view-scope:focus > .title,
+.theme-dark .variable-or-property:focus > .title {
+  background-color: #008484; /* Selection colors */
+  color: #FFCF00;
+}
+
 .variables-view-scope > .title {
   background-color: #A09090;
   color: #000000;
@@ -463,10 +511,6 @@
   color: inherit !important;
 }
 
-.variable-or-property > .title > .value {
-  -moz-box-flex: 1;
-}
-
 .variable-or-property > .title > .arrow {
   -moz-margin-start: 3px;
 }
@@ -730,11 +774,11 @@
   transform: translateZ(1px);
 }
 
-.theme-dark .generic-chart-container {
+.generic-chart-container {
   color: #A09090; /* Light foreground text */
 }
 
-.theme-dark .chart-colored-blob {
+.chart-colored-blob {
   fill: #9C9CFF; /* Light content text */
   background: #9C9CFF;
 }
@@ -746,11 +790,11 @@
   cursor: pointer;
 }
 
-.theme-dark .pie-chart-slice {
+.pie-chart-slice {
   stroke: #A09090;
 }
 
-.theme-dark .pie-chart-slice[largest] {
+.pie-chart-slice[largest] {
   stroke-width: 2px;
   stroke: #9C9CFF;
 }
@@ -761,7 +805,7 @@
   pointer-events: none;
 }
 
-.theme-dark .pie-chart-label {
+.pie-chart-label {
   fill: #000;
 }
 
@@ -890,6 +934,7 @@
 .manifest-editor .variables-view-delete:hover,
 .manifest-editor .variables-view-delete:active,
 .manifest-editor .variable-or-property:focus .variables-view-delete,
+.manifest-editor .variables-view-add-property,
 .manifest-editor .variables-view-add-property:hover,
 .manifest-editor .variables-view-add-property:active,
 .manifest-editor .variable-or-property:focus .variables-view-add-property {