From 153d0e78b0cc625deda37e9baefa87a2cde0ed34 Mon Sep 17 00:00:00 2001
From: Nicolas Chevobbe <nchevobbe@mozilla.com>
Date: Tue, 21 Aug 2018 16:25:49 +0000
Subject: [PATCH] Bug 1482798 - Use a flex layout for message body; r=bgrins.

It looks like we don't really need a grid layout anymore
for the message body AND it significantly reduces the time
spent on reflow.

Differential Revision: https://phabricator.services.mozilla.com/D3853

--HG--
extra : moz-landing-system : lando
---
 devtools/client/themes/webconsole.css | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/devtools/client/themes/webconsole.css b/devtools/client/themes/webconsole.css
index b253d162d600..43c7f901c44d 100644
--- a/devtools/client/themes/webconsole.css
+++ b/devtools/client/themes/webconsole.css
@@ -88,7 +88,7 @@ a {
 /* The red bubble that shows the number of times a message is repeated */
 .message-repeats {
   -moz-user-select: none;
-  flex: none;
+  flex-shrink: 0;
   margin: 2px 6px;
   padding: 0 6px;
   height: 1.25em;
@@ -98,6 +98,7 @@ a {
   font: message-box;
   font-size: 0.9em;
   font-weight: 600;
+  margin-inline-start: 5px;
 }
 
 .message-repeats[value="1"] {
@@ -106,8 +107,9 @@ a {
 
 .message-location {
   max-width: 40vw;
-  grid-column: -1 / -2;
+  flex-shrink: 0;
   color: var(--frame-link-source);
+  margin-inline-start: 5px;
 }
 
 .stack-trace {
@@ -140,9 +142,7 @@ a {
 }
 
 .message-flex-body {
-  display: grid;
-  grid-template-columns: 1fr auto max-content;
-  grid-gap: 5px;
+  display: flex;
 }
 
 .message-body {
@@ -152,7 +152,7 @@ a {
 
 .message-flex-body > .message-body {
   display: block;
-  flex: auto;
+  flex: 1;
 }
 
 /* Network styles */