Bug 931003 - Have a consistent border color on the end of the sources list and the bottom sources toolbar, r=paul

browser/themes/linux/devtools/debugger.css

@@ -17,6 +17,13 @@
   -moz-border-start-color: transparent;
 }
 
+/* Sources toolbar */
+
+#sources-toolbar {
+  border: none; /* Remove the devtools-toolbar's black bottom border. */
+  -moz-border-end: 1px solid #222426; /* Match the sources list's dark margin. */
+}
+
 #pretty-print {
   min-width: 0;
   font-weight: bold;
@@ -435,3 +442,8 @@
 #body[layout=vertical] .side-menu-widget-item-arrow {
   background-image: none !important;
 }
+
+#body[layout=vertical] .side-menu-widget-group,
+#body[layout=vertical] .side-menu-widget-item {
+  -moz-margin-end: 0;
+}

browser/themes/linux/devtools/widgets.css

@@ -279,6 +279,8 @@
   color: #000;
 }
 
+/* SideMenuWidget container */
+
 .side-menu-widget-container[with-arrows=true]:-moz-locale-dir(ltr) {
   box-shadow: inset -1px 0 0 #222426;
 }
@@ -287,6 +289,18 @@
   box-shadow: inset 1px 0 0 #222426;
 }
 
+.side-menu-widget-container[with-arrows=true] .side-menu-widget-group {
+  /* To allow visibility of the dark margin shadow. */
+  -moz-margin-end: 1px;
+}
+
+.side-menu-widget-container[with-arrows=true] .side-menu-widget-item {
+  /* To compensate for the arrow image's dark margin. */
+  -moz-margin-end: -1px;
+}
+
+/* SideMenuWidget groups */
+
 .side-menu-widget-group-title {
   padding: 4px;
 }
@@ -308,6 +322,8 @@
   padding: 0;
 }
 
+/* SideMenuWidget items */
+
 .side-menu-widget-item[theme="dark"] {
   border-top: 1px solid hsla(210,8%,5%,.25);
   border-bottom: 1px solid hsla(210,16%,76%,.1);
@@ -343,15 +359,17 @@
 }
 
 .side-menu-widget-item.selected > .side-menu-widget-item-arrow:-moz-locale-dir(ltr) {
-  background-image: url(itemArrow-ltr.png), linear-gradient(to right, black, black);
+  background-image: url(itemArrow-ltr.png), linear-gradient(to right, #222426, #222426);
   background-position: center right, top right;
 }
 
 .side-menu-widget-item.selected > .side-menu-widget-item-arrow:-moz-locale-dir(rtl) {
-  background-image: url(itemArrow-rtl.png), linear-gradient(to right, black, black);
+  background-image: url(itemArrow-rtl.png), linear-gradient(to right, #222426, #222426);
   background-position: center left, top left;
 }
 
+/* SideMenuWidget items contents */
+
 .side-menu-widget-item-label {
   padding: 4px 0px;
 }
@@ -385,6 +403,8 @@
   text-shadow: 0 1px 1px #111;
 }
 
+/* SideMenuWidget misc */
+
 .side-menu-widget-empty-notice-container {
   padding: 12px;
 }

browser/themes/osx/devtools/debugger.css

@@ -19,6 +19,13 @@
   -moz-border-start-color: transparent;
 }
 
+/* Sources toolbar */
+
+#sources-toolbar {
+  border: none; /* Remove the devtools-toolbar's black bottom border. */
+  -moz-border-end: 1px solid #222426; /* Match the sources list's dark margin. */
+}
+
 #pretty-print {
   min-width: 0;
   font-weight: bold;
@@ -437,3 +444,8 @@
 #body[layout=vertical] .side-menu-widget-item-arrow {
   background-image: none !important;
 }
+
+#body[layout=vertical] .side-menu-widget-group,
+#body[layout=vertical] .side-menu-widget-item {
+  -moz-margin-end: 0;
+}

browser/themes/osx/devtools/widgets.css

@@ -279,6 +279,8 @@
   color: #000;
 }
 
+/* SideMenuWidget container */
+
 .side-menu-widget-container[with-arrows=true]:-moz-locale-dir(ltr) {
   box-shadow: inset -1px 0 0 #222426;
 }
@@ -287,6 +289,18 @@
   box-shadow: inset 1px 0 0 #222426;
 }
 
+.side-menu-widget-container[with-arrows=true] .side-menu-widget-group {
+  /* To allow visibility of the dark margin shadow. */
+  -moz-margin-end: 1px;
+}
+
+.side-menu-widget-container[with-arrows=true] .side-menu-widget-item {
+  /* To compensate for the arrow image's dark margin. */
+  -moz-margin-end: -1px;
+}
+
+/* SideMenuWidget groups */
+
 .side-menu-widget-group-title {
   padding: 4px;
 }
@@ -308,6 +322,8 @@
   padding: 0;
 }
 
+/* SideMenuWidget items */
+
 .side-menu-widget-item[theme="dark"] {
   border-top: 1px solid hsla(210,8%,5%,.25);
   border-bottom: 1px solid hsla(210,16%,76%,.1);
@@ -343,15 +359,17 @@
 }
 
 .side-menu-widget-item.selected > .side-menu-widget-item-arrow:-moz-locale-dir(ltr) {
-  background-image: url(itemArrow-ltr.png), linear-gradient(to right, black, black);
+  background-image: url(itemArrow-ltr.png), linear-gradient(to right, #222426, #222426);
   background-position: center right, top right;
 }
 
 .side-menu-widget-item.selected > .side-menu-widget-item-arrow:-moz-locale-dir(rtl) {
-  background-image: url(itemArrow-rtl.png), linear-gradient(to right, black, black);
+  background-image: url(itemArrow-rtl.png), linear-gradient(to right, #222426, #222426);
   background-position: center left, top left;
 }
 
+/* SideMenuWidget items contents */
+
 .side-menu-widget-item-label {
   padding: 4px 0px;
 }
@@ -385,6 +403,8 @@
   text-shadow: 0 1px 1px #111;
 }
 
+/* SideMenuWidget misc */
+
 .side-menu-widget-empty-notice-container {
   padding: 12px;
 }

browser/themes/windows/devtools/debugger.css

@@ -17,6 +17,13 @@
   -moz-border-start-color: transparent;
 }
 
+/* Sources toolbar */
+
+#sources-toolbar {
+  border: none; /* Remove the devtools-toolbar's black bottom border. */
+  -moz-border-end: 1px solid #222426; /* Match the sources list's dark margin. */
+}
+
 #pretty-print {
   min-width: 0;
   font-weight: bold;
@@ -440,3 +447,8 @@
 #body[layout=vertical] .side-menu-widget-item-arrow {
   background-image: none !important;
 }
+
+#body[layout=vertical] .side-menu-widget-group,
+#body[layout=vertical] .side-menu-widget-item {
+  -moz-margin-end: 0;
+}

browser/themes/windows/devtools/widgets.css

@@ -283,6 +283,8 @@
   color: #000;
 }
 
+/* SideMenuWidget container */
+
 .side-menu-widget-container[with-arrows=true]:-moz-locale-dir(ltr) {
   box-shadow: inset -1px 0 0 #222426;
 }
@@ -291,6 +293,18 @@
   box-shadow: inset 1px 0 0 #222426;
 }
 
+.side-menu-widget-container[with-arrows=true] .side-menu-widget-group {
+  /* To allow visibility of the dark margin shadow. */
+  -moz-margin-end: 1px;
+}
+
+.side-menu-widget-container[with-arrows=true] .side-menu-widget-item {
+  /* To compensate for the arrow image's dark margin. */
+  -moz-margin-end: -1px;
+}
+
+/* SideMenuWidget groups */
+
 .side-menu-widget-group-title {
   padding: 4px;
 }
@@ -312,6 +326,8 @@
   padding: 0;
 }
 
+/* SideMenuWidget items */
+
 .side-menu-widget-item[theme="dark"] {
   border-top: 1px solid hsla(210,8%,5%,.25);
   border-bottom: 1px solid hsla(210,16%,76%,.1);
@@ -347,15 +363,17 @@
 }
 
 .side-menu-widget-item.selected > .side-menu-widget-item-arrow:-moz-locale-dir(ltr) {
-  background-image: url(itemArrow-ltr.png), linear-gradient(to right, black, black);
+  background-image: url(itemArrow-ltr.png), linear-gradient(to right, #222426, #222426);
   background-position: center right, top right;
 }
 
 .side-menu-widget-item.selected > .side-menu-widget-item-arrow:-moz-locale-dir(rtl) {
-  background-image: url(itemArrow-rtl.png), linear-gradient(to right, black, black);
+  background-image: url(itemArrow-rtl.png), linear-gradient(to right, #222426, #222426);
   background-position: center left, top left;
 }
 
+/* SideMenuWidget items contents */
+
 .side-menu-widget-item-label {
   padding: 4px 0px;
 }
@@ -388,6 +406,8 @@
   color: #f5f7fa;
 }
 
+/* SideMenuWidget misc */
+
 .side-menu-widget-empty-notice-container {
   padding: 12px;
 }