DevTools: hoist debugger paused reason to top

third_party/WebKit/Source/devtools/front_end/sources/sourcesPanel.css

Index: third_party/WebKit/Source/devtools/front_end/sources/sourcesPanel.css
diff --git a/third_party/WebKit/Source/devtools/front_end/sources/sourcesPanel.css b/third_party/WebKit/Source/devtools/front_end/sources/sourcesPanel.css
index 0496a5ee2143d866d10a9f421610f9d9b2faf297..24a8e297ad9c7592b2e467bdb3bb4cd910f909bf 100644
--- a/third_party/WebKit/Source/devtools/front_end/sources/sourcesPanel.css
+++ b/third_party/WebKit/Source/devtools/front_end/sources/sourcesPanel.css
@@ -102,27 +102,65 @@
     cursor: auto;
 }
 
-.callstack-info {
-    text-align: center;
-    font-style: italic;
+.paused-status {
     padding: 6px;
-    color: #888;
     pointer-events: none;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-}
-
-.callstack-info.status {
+    border-bottom: 1px solid transparent;
     border-top: 1px solid rgb(189, 189, 189);
-    background-color: rgb(255, 255, 194);
+    background-color: hsl(50, 100%, 95%);
+    color: rgb(107, 97, 48);
+    flex: none;
 }
 
-.-theme-with-dark-background .callstack-info.status {
+.-theme-with-dark-background .paused-status {
     background-color: hsl(46, 98%, 22%);
     color: #ccc;
 }
 
+.paused-status.error-reason {
+    background-color: hsl(0, 100%, 97%);
+    color: #6b3b3b;
+}
+
+.status-main {
+    font-weight: bold;
+    padding-left: 15px;
+    position: relative;
+}
+
+.status-sub:not(:empty) {
+    padding-left: 15px;
+    padding-top: 5px;
+    font-size: 11px;
+    font-family:  dejavu sans mono, monospace;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+.paused-status.error-reason .status-sub {
+    color: red;
+    line-height: 11px;
+    max-height: 27px;
+}
+
+.status-main::before {
+    background-position: -80px 0;
+    background-image: url(Images/smallIcons.png);
+    background-size: 190px 30px;
+    width: 10px;
+    height: 10px;
+    content: "";
+    -webkit-filter: hue-rotate(190deg);
+    position: absolute;
+    left: 0;
+    top: 1px;
+}
+
+.paused-status.error-reason .status-main::before {
+    background-position: -20px 0;
+    -webkit-filter: none;
+}
+
 .watch-expression-delete-button {
     width: 10px;
     height: 10px;