DevTools: hoist debugger paused reason to top

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

 /*
  * Copyright (C) 2006, 2007, 2008 Apple Inc.  All rights reserved.
  * Copyright (C) 2009 Anthony Ricaud <rik@webkit.org>
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * are met:
  *
  * 1.  Redistributions of source code must retain the above copyright
  *     notice, this list of conditions and the following disclaimer.
@@ skipping 84 matching lines @@
 }
 
 .cursor-pointer {
     cursor: pointer;
 }
 
 .cursor-auto {
     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;
+    border-bottom: 1px solid transparent;
+    border-top: 1px solid rgb(189, 189, 189);
+    background-color: hsl(50, 100%, 95%);
+    color: rgb(107, 97, 48);
+    flex: none;
 }
 
-.callstack-info.status {
-    border-top: 1px solid rgb(189, 189, 189);
-    background-color: rgb(255, 255, 194);
+.-theme-with-dark-background .paused-status {
+    background-color: hsl(46, 98%, 22%);
+    color: #ccc;
 }
 
-.-theme-with-dark-background .callstack-info.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;
     background-image: url(Images/deleteIcon.png);
     background-position: 0 0;
     background-color: transparent;
     background-repeat: no-repeat;
     border: 0 none transparent;
@@ skipping 131 matching lines @@
     text-align: center;
     font-style: italic;
     padding: 4px;
     color: #888;
     background-color: #FFFFC2;
 }
 
 .event-listeners-sidebar-pane .toolbar {
     border-bottom: 1px solid #eee;
 }