DevTools: extract a component for layer viewer

third_party/WebKit/Source/devtools/front_end/ui/inspectorCommon.css

Index: third_party/WebKit/Source/devtools/front_end/ui/inspectorCommon.css
diff --git a/third_party/WebKit/Source/devtools/front_end/ui/inspectorCommon.css b/third_party/WebKit/Source/devtools/front_end/ui/inspectorCommon.css
index 9bc0fef3432a12c74999585ae42f1534383b760f..a43db68259396be18fa2d15c9486da7fef7c08fa 100644
--- a/third_party/WebKit/Source/devtools/front_end/ui/inspectorCommon.css
+++ b/third_party/WebKit/Source/devtools/front_end/ui/inspectorCommon.css
@@ -292,3 +292,25 @@ body.inactive select.chrome-select,
 label[is=dt-icon-label] {
     flex: none;
 }
+
+.banner a {

[dgozman, 2016/09/23 00:40:06]

At least rename this to more specific selector like "full-widget-dimmed-banner"
or something.

+    color: inherit;
+}
+
+.banner {
+    color: #777;
+    background-color: white;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    text-align: center;
+    padding: 20px;
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    font-size: 13px;
+    overflow: auto;
+    z-index: 500;
+}