DevTools: [Documentation] Update empty page style

FYI: screenshot is available here: https://code.google.com/p/chromium/issues/detail?id=391593#c30

BUG=391593

Review URL: https://codereview.chromium.org/532223002

git-svn-id: svn://svn.chromium.org/blink/trunk@181721 bbb929c8-8fbe-4397-9dbb-9b2b20218538

third_party/WebKit/Source/devtools/front_end/documentation/DocumentationView.js

@@ -75,8 +75,10 @@ WebInspector.DocumentationView.prototype = {
     _createEmptyPage: function()
     {
         this.element.removeChildren();
-        var pageTitle = this.element.createChild("div", "documentation-page-title");
-        pageTitle.textContent = WebInspector.UIString("Documentation not available");
+        var emptyPage = this.element.createChild("div", "documentation-empty-page fill");
+        var pageTitle = emptyPage.createChild("div", "documentation-not-found");
+        pageTitle.textContent = "No documentation found.";
+        emptyPage.createChild("div", "documentation-empty-page-align");
     },
 
     __proto__: WebInspector.View.prototype

third_party/WebKit/Source/devtools/front_end/documentationView.css

@@ -94,3 +94,23 @@
     margin-top: 5px;
     border-radius: 5px;
 }
+
+.documentation-not-found {
+    display: flex;
+    justify-content: center;
+    align-items: flex-end;
+    font-size: 24px;
+    font-weight: bold;
+    color: rgb(191, 191, 191);
+    flex-shrink: 0;
+    flex-grow: 2;
+}
+
+.documentation-empty-page {
+    display: flex;
+    flex-direction: column !important;
+}
+
+.documentation-empty-page-align {
+    flex-grow: 3;
+}