DevTools: beautified styles sidebar toolbar.

third_party/WebKit/Source/devtools/front_end/elements/ElementStatePaneWidget.js

 // Copyright (c) 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.ElementsPanel.BaseToolbarPaneWidget}
  * @param {!WebInspector.ToolbarItem} toolbarItem
  */
 WebInspector.ElementStatePaneWidget = function(toolbarItem)
@@ skipping 106 matching lines @@
 
     __proto__: WebInspector.ElementsPanel.BaseToolbarPaneWidget.prototype
 }
 
 /**
  * @constructor
  * @implements {WebInspector.ToolbarItem.Provider}
  */
 WebInspector.ElementStatePaneWidget.ButtonProvider = function()
 {
-    this._button = new WebInspector.ToolbarToggle(WebInspector.UIString("Toggle Element State"), "pin-toolbar-item");
+    this._button = new WebInspector.ToolbarToggle(WebInspector.UIString("Toggle Element State"), "", WebInspector.UIString(":hov"));
     this._button.addEventListener("click", this._clicked, this);
+    this._button.element.classList.add("monospace");
     this._view = new WebInspector.ElementStatePaneWidget(this.item());
     WebInspector.context.addFlavorChangeListener(WebInspector.DOMNode, this._nodeChanged, this);
     this._nodeChanged();
 }
 
 WebInspector.ElementStatePaneWidget.ButtonProvider.prototype = {
     _clicked: function()
     {
         WebInspector.ElementsPanel.instance().showToolbarPane(!this._view.isShowing() ? this._view : null);
     },
 
     /**
      * @override
      * @return {!WebInspector.ToolbarItem}
      */
     item: function()
     {
         return this._button;
     },
 
     _nodeChanged: function()
     {
         var enabled = !!WebInspector.context.flavor(WebInspector.DOMNode);
         this._button.setEnabled(enabled);
         if (!enabled && this._button.toggled())
             WebInspector.ElementsPanel.instance().showToolbarPane(null);
     }
 }