second part of syncing LCARStrek with Firefox 45-48 devtools theme changes

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

diff --git a/LCARStrek/devtools/widgets.css b/LCARStrek/devtools/widgets.css
index 0647496f1d18ac50818dd81f9a7a08d40fbd2e04..beee41d15cfce7c7932ba867dc07d5781287cf84 100644 (file)
--- a/LCARStrek/devtools/widgets.css
+++ b/LCARStrek/devtools/widgets.css
@@ -9,6 +9,9 @@
 .theme-light {
   --table-splitter-color: #A09090;
   --table-zebra-background: rgba(255,159,0,0.1);
+  --smw-margin: #9C9CFF;
+  --smw-item-top-border: #A09090;
+  --smw-item-bottom-border: #008484;
 }
 
 /* Generic pane helpers */
@@ -237,6 +240,10 @@
   padding-bottom: 0;
 }
 
+:root[platform="win"] .breadcrumbs-widget-item:-moz-focusring > .button-box {
+  border-width: 0;
+}
+
 .breadcrumbs-widget-item:not([checked]) {
   background-image: -moz-element(#breadcrumb-separator-normal);
   background-repeat: no-repeat;
@@ -354,11 +361,6 @@
 
 /* SideMenuWidget container */
 
-.side-menu-widget-container {
-  /* Hack: force hardware acceleration */
-  transform: translateZ(1px);
-}
-
 .side-menu-widget-container:-moz-locale-dir(ltr),
 .side-menu-widget-empty-text:-moz-locale-dir(ltr) {
 }
@@ -388,17 +390,22 @@
 /* SideMenuWidget items */
 
 .side-menu-widget-item {
-  border-top: 1px solid #9C9CFF;
+  border-top: 1px solid var(--smw-item-top-border);
+/*  border-bottom: 1px solid var(--smw-item-bottom-border);*/
+}
+
+.side-menu-widget-item:last-of-type {
+/*  box-shadow: inset 0 -1px 0 var(--smw-item-top-border);*/
+  border-bottom: 1px solid var(--smw-item-top-border);
+}
+
+.side-menu-widget-item {
   /* To compensate for the top and bottom borders */
   margin-top: -1px;
   margin-bottom: -1px;
   background-clip: padding-box;
 }
 
-.side-menu-widget-item:last-of-type {
-  border-bottom: 1px solid #9C9CFF;
-}
-
 .side-menu-widget-item.selected {
   background-color: var(--theme-selection-background);
   color: var(--theme-selection-color);
@@ -1084,48 +1091,48 @@ table-widget-body,
 
 .table-widget-column-header,
 .table-widget-cell {
-  -moz-border-end: 1px solid var(--table-splitter-color) !important;
+  border-inline-end: 1px solid var(--table-splitter-color) !important;
 }
 
 /* Table widget column header colors are taken from netmonitor.inc.css to match
-   the look of both the tables. This needs to be updated along with netmonitor
-   header colors in bug 951714 */
+   the look of both the tables. */
 
 .table-widget-column-header {
-  background: rgba(0,0,0,0);
   position: sticky;
   top: 0;
   width: 100%;
+  margin: 0;
   padding: 5px 0 0 !important;
   color: inherit;
   text-align: center;
   font-weight: inherit !important;
-  transition: background-color 0.1s ease-in-out;
+  border-bottom-width: 0 !important;
+  border-image: linear-gradient(transparent 15%, var(--theme-splitter-color) 15%, var(--theme-splitter-color) 85%, transparent 85%) 1 1;
+  background-repeat: no-repeat;
 }
 
-.table-widget-column-header:hover {
-  background: var(--theme-hover-background);
+table-widget-column-header:not([sorted]):hover {
+/*  background-image: linear-gradient(rgba(0,0,0,0.1),rgba(0,0,0,0.1));*/
 }
 
-.table-widget-column-header:hover:active {
-  background: var(--theme-active-background);
+.table-widget-column-header[sorted] {
+  background-color: var(--theme-selection-background);
+  color: var(--theme-selection-color);
+  border-image: linear-gradient(var(--theme-splitter-color), var(--theme-splitter-color)) 1 1;
+/*  box-shadow: -0.5px 0 0 0.5px var(--theme-splitter-color);*/
+  background-position: right 6px center;
 }
 
-.table-widget-column-header:not(:active)[sorted] {
-  background: var(--theme-selection-background);
+.table-widget-column-header[sorted]:-moz-locale-dir(rtl) {
+  background-position: 6px center;
 }
 
-.table-widget-column-header:not(:active)[sorted=ascending] {
-  background-image: radial-gradient(farthest-side at center top, hsla(0,0%,0%,.7), hsla(0,0%,0%,0.3));
-  background-size: 100% 1px;
-  background-repeat: no-repeat;
+.table-widget-column-header[sorted=ascending] {
+  background-image: url("chrome://devtools/skin/images/sort-arrows.svg#ascending");
 }
 
-.table-widget-column-header:not(:active)[sorted=descending] {
-  background-image: radial-gradient(farthest-side at center bottom, hsla(0,0%,0%,.7), hsla(0,0%,0%,0.3));
-  background-size: 100% 1px;
-  background-repeat: no-repeat;
-  background-position: bottom;
+.table-widget-column-header[sorted=descending] {
+  background-image: url("chrome://devtools/skin/images/sort-arrows.svg#descending");
 }
 
 /* Cells */
@@ -1133,13 +1140,13 @@ table-widget-body,
 .table-widget-cell {
   width: 100%;
   padding: 3px 4px;
-  background-clip: padding-box;
   min-width: 100px;
   -moz-user-focus: normal;
+  color: var(--theme-body-color);
+}
 
-  margin-bottom: -1px !important;
-  border-bottom: 1px solid transparent;
-   color: var(--theme-body-color);
+.table-widget-column-header + .table-widget-cell {
+  border-top: 1px solid var(--theme-splitter-color);
 }
 
 .table-widget-cell:last-child {
@@ -1151,7 +1158,7 @@ table-widget-body,
   background: var(--table-zebra-background);
 }
 
-.table-widget-cell.flash-out {
+:root:not(.no-animate) .table-widget-cell.flash-out {
   animation: flash-out 0.5s ease-in;
 }