Bug 1560804 - Fix double scrollbar in network message detail. r=Honza.
authorNicolas Chevobbe <nchevobbe@mozilla.com>
Fri, 28 Jun 2019 08:50:43 +0000
changeset 543332 5bb0858a753789688471fdeabe33538d9af22ed4
parent 543331 bde71705988f6599e8411e7ee9af68a3fab9c161
child 543333 feb8bd2e797305377b7200d73cb34e3b5227a85c
push id2131
push userffxbld-merge
push dateMon, 26 Aug 2019 18:30:20 +0000
treeherdermozilla-release@b19ffb3ca153 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersHonza
bugs1560804
milestone69.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1560804 - Fix double scrollbar in network message detail. r=Honza. We take this as an opportunity to fix the alignment between the XHR badge and the URL. Differential Revision: https://phabricator.services.mozilla.com/D36297
devtools/client/themes/webconsole.css
--- a/devtools/client/themes/webconsole.css
+++ b/devtools/client/themes/webconsole.css
@@ -147,27 +147,23 @@ a {
   top: 0;
   bottom: 0;
   background: var(--theme-highlight-blue);
   width: 3px;
 }
 
 /*
  * By default, prevent any element in message to overflow.
+ * We exclude network messages as it may cause issues in the network detail panel.
  * This makes console reflows faster (See Bug 1487457).
  */
-.message * {
+.message:not(.network) * {
   overflow: hidden;
 }
 
-/* Reset the overflow for the network info panel (when a network message is expanded) */
-.message .network-info * {
-  overflow: unset;
-}
-
 .message.error {
   z-index: 2;
   color: var(--console-error-color);
   border-color: var(--console-error-border);
   background-color: var(--console-error-background);
 }
 
 .message.warn {
@@ -828,16 +824,17 @@ a.learn-more-link.webconsole-learn-more-
    supported in the Console panel. */
 .network.message #headers-panel .edit-and-resend-button {
   display: none;
 }
 
 .network .message-flex-body > .message-body {
   display: flex;
   flex-wrap: wrap;
+  align-items: baseline;
 }
 
 /*
  * Open DOMNode in inspector button. Style need to be reset in the new
  * console since its style is already defined in reps.css .
  */
 .webconsole-app .open-inspector {
   background-image: unset;