Config UI for Extension Commands (part 1).

chrome/browser/resources/extensions/extension_commands_overlay.css

 /* Copyright (c) 2012 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. */
 
 .extension-command-list-command-item-wrapper {
   margin-left: 12px;
 }
 
+.command-title {
+  display: inline-block;
+  margin-top: 1em;
+}
+
+.command-container {
+  width: 450px;
+}
+
+.command-description {
+  display: inline-block;
+  margin-top: 0.5em;
+  min-height: 2em;
+  width: 55%;
+}
+
+.command-shortcut-container {
+  display: inline-block;
+  float: right;

[Evan Stade, 2012/06/05 21:25:52]

make the parent container a flex box.

+  margin-top: 0.25em;
+  min-height: 2em;
+  width: 35%;
+}
+
 .command-shortcut {
-  float: right;
+  border: solid 1px #999;
+  color: rgb(48, 57, 66);
+  display: inline-block;
+  height: 1.5em;
+  min-width: 12.5em;
+  outline: none;
+  padding: 4px 0 1px 4px;
+}
+
+.clearable {
+  background: white url('chrome://theme/IDR_EXTENSION_COMMAND_CLOSE')
+              no-repeat right;
+}
+
+.capturing {
+  background: rgb(243, 244, 255);
+  border: solid 1px rgb(140, 147, 255);
+  color: #999;
+}
+
+.contains-chars {
+  color: rgb(48, 57, 66);
 }
 
 .inactive-keybinding {
-  color: Gray;
+  color: #999;
 }