DevTools: Autocomplete class names in ClassesPaneWidget

third_party/WebKit/Source/devtools/front_end/elements/elementsPanel.css

 /*
  * Copyright (C) 2006, 2007, 2008 Apple Inc.  All rights reserved.
  * Copyright (C) 2009 Anthony Ricaud <rik@webkit.org>
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * are met:
  *
  * 1.  Redistributions of source code must retain the above copyright
  *     notice, this list of conditions and the following disclaimer.
@@ skipping 476 matching lines @@
 .styles-element-classes-pane .title-container {
     padding-bottom: 2px;
 }
 
 .styles-element-classes-pane .new-class-input {
     padding-left: 3px;
     border: 1px solid #ddd;
     line-height: 15px;
     margin-left: 3px;
     width: calc(100% - 7px);
+    -webkit-user-modify: read-write-plaintext-only;
+    background-color: #fff;
+    cursor: text;
+}
+
+.styles-element-classes-pane .new-class-input:empty:before {
+    content: attr(placeholder);
+    color: darkgray;
 }
 
 .styles-element-state-pane > div {
     margin: 8px 4px 6px;
 }
 
 .styles-element-state-pane > table {
     width: 100%;
     border-spacing: 0;
 }
@@ skipping 214 matching lines @@
     position: absolute;
     right: 0;
     bottom: 0;
     visibility: hidden;
     background-color: rgba(255, 255, 255, 0.9);
 }
 
 .styles-pane:not(.is-editing-style) .styles-section.matched-styles:not(.read-only):hover .sidebar-pane-section-toolbar {
     visibility: visible;
 }