DevTools: migrate the closeButton icons over to UI.Icon

third_party/WebKit/Source/devtools/front_end/ui/UIUtils.js

Index: third_party/WebKit/Source/devtools/front_end/ui/UIUtils.js
diff --git a/third_party/WebKit/Source/devtools/front_end/ui/UIUtils.js b/third_party/WebKit/Source/devtools/front_end/ui/UIUtils.js
index 1e79d2231cf554d764e8a278a30592c07fd4a2f5..82c61ec86ad8db91c1d1933034d8b52d32d9cbbb 100644
--- a/third_party/WebKit/Source/devtools/front_end/ui/UIUtils.js
+++ b/third_party/WebKit/Source/devtools/front_end/ui/UIUtils.js
@@ -1531,6 +1531,12 @@ UI.appendStyle = function(node, cssFile) {
     createdCallback: function() {
       var root = UI.createShadowRootWithCoreStyles(this, 'ui/closeButton.css');
       this._buttonElement = root.createChild('div', 'close-button');
+      var regularIcon = UI.Icon.create('smallicon-cross', 'default-icon');
+      this._hoverIcon = UI.Icon.create('smallicon-red-cross-hover', 'hover-icon');
+      this._activeIcon = UI.Icon.create('smallicon-red-cross-active', 'active-icon');
+      this._buttonElement.appendChild(regularIcon);
+      this._buttonElement.appendChild(this._hoverIcon);
+      this._buttonElement.appendChild(this._activeIcon);
     },
 
     /**
@@ -1538,7 +1544,13 @@ UI.appendStyle = function(node, cssFile) {
      * @this {Element}
      */
     set gray(gray) {
-      this._buttonElement.className = gray ? 'close-button-gray' : 'close-button';
+      if (gray) {
+        this._hoverIcon.setIconType('smallicon-gray-cross-hover');
+        this._activeIcon.setIconType('smallicon-gray-cross-active');
+      } else {
+        this._hoverIcon.setIconType('smallicon-red-cross-hover');
+        this._activeIcon.setIconType('smallicon-red-cross-active');
+      }
     },
 
     __proto__: HTMLDivElement.prototype