DevTools Security panel: Update the origin view to match the latest Material specs.

third_party/WebKit/Source/devtools/front_end/security/SecurityPanel.js

 // Copyright 2015 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 /**
  * @constructor
  * @extends {WebInspector.PanelWithSidebar}
  * @implements {WebInspector.TargetManager.Observer}
  */
 WebInspector.SecurityPanel = function()
@@ skipping 725 matching lines @@
     this.element.classList.add("security-origin-view");
     this.registerRequiredCSS("security/originView.css");
     this.registerRequiredCSS("security/lockIcon.css");
 
     var titleSection = this.element.createChild("div", "title-section");
     var originDisplay = titleSection.createChild("div", "origin-display");
     this._originLockIcon = originDisplay.createChild("span", "security-property");
     this._originLockIcon.classList.add("security-property-" + originState.securityState);
     // TODO(lgarron): Highlight the origin scheme. https://crbug.com/523589
     originDisplay.createChild("span", "origin").textContent = origin;
-    var originNetworkLink = titleSection.createChild("div", "link");
-    originNetworkLink.textContent = WebInspector.UIString("View requests in Network Panel");
+    var originNetworkButton = titleSection.createChild("button", "network-button");
+    originNetworkButton.textContent = WebInspector.UIString("View requests in Network Panel");
     function showOriginRequestsInNetworkPanel()
     {
         var parsedURL = new WebInspector.ParsedURL(origin);
         WebInspector.NetworkPanel.revealAndFilter([
             {
                 filterType: WebInspector.NetworkLogView.FilterType.Domain,
                 filterValue: parsedURL.host
             },
             {
                 filterType: WebInspector.NetworkLogView.FilterType.Scheme,
                 filterValue: parsedURL.scheme
             }
         ]);
     }
-    originNetworkLink.addEventListener("click", showOriginRequestsInNetworkPanel, false);
+    originNetworkButton.addEventListener("click", showOriginRequestsInNetworkPanel, false);
 
 
     if (originState.securityDetails) {
         var connectionSection = this.element.createChild("div", "origin-view-section");
         connectionSection.createChild("div", "origin-view-section-title").textContent = WebInspector.UIString("Connection");
 
         var table = new WebInspector.SecurityDetailsTable();
         connectionSection.appendChild(table.element());
         table.addRow("Protocol", originState.securityDetails.protocol);
         table.addRow("Key Exchange", originState.securityDetails.keyExchange);
@@ skipping 76 matching lines @@
             toggleSctsDetailsLink.addEventListener("click", toggleSctDetailsDisplay, false);
         }
 
         function displayCertificateDetailsUnavailable()
         {
             certificateSection.createChild("div").textContent = WebInspector.UIString("Certificate details unavailable.");
         }
 
         originState.certificateDetailsPromise.then(displayCertificateDetails.bind(this), displayCertificateDetailsUnavailable);
 
-        var noteSection = this.element.createChild("div", "origin-view-section");
+        var noteSection = this.element.createChild("div", "origin-view-section first-inspected-response");
         // TODO(lgarron): Fix the issue and then remove this section. See comment in SecurityPanel._processRequest().
         noteSection.createChild("div").textContent = WebInspector.UIString("The security details above are from the first inspected response.");
     } else if (originState.securityState !== SecurityAgent.SecurityState.Unknown) {
         var notSecureSection = this.element.createChild("div", "origin-view-section");
         notSecureSection.createChild("div", "origin-view-section-title").textContent = WebInspector.UIString("Not Secure");
         notSecureSection.createChild("div").textContent = WebInspector.UIString("Your connection to this origin is not secure.");
     } else {
         var noInfoSection = this.element.createChild("div", "origin-view-section");
         noInfoSection.createChild("div", "origin-view-section-title").textContent = WebInspector.UIString("No Security Information");
         noInfoSection.createChild("div").textContent = WebInspector.UIString("No security details are available for this origin.");
@@ skipping 88 matching lines @@
         row.createChild("div").textContent = key;
 
         var valueDiv = row.createChild("div");
         if (typeof value === "string") {
             valueDiv.textContent = value;
         } else {
             valueDiv.appendChild(value);
         }
     }
 }