DevTools: improved layout for Kbd Shortcuts & Settings

Source/devtools/front_end/components/ShortcutsScreen.js

 /*
  * Copyright (C) 2010 Google Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions are
  * met:
  *
  *     * Redistributions of source code must retain the above copyright
  * notice, this list of conditions and the following disclaimer.
  *     * Redistributions in binary form must reproduce the above
@@ skipping 127 matching lines @@
     },
 
     /**
      * @param {!Element} container
      */
     renderSection: function(container)
     {
         var parent = container.createChild("div", "help-block");
 
         var headLine = parent.createChild("div", "help-line");
-        headLine.createChild("div", "help-key-cell");
         headLine.createChild("div", "help-section-title help-cell").textContent = this.name;
 
         for (var i = 0; i < this._lines.length; ++i) {
             var line = parent.createChild("div", "help-line");
+            line.createChild("div", "help-cell").textContent = this._lines[i].text;
             var keyCell = line.createChild("div", "help-key-cell");
+            keyCell.appendChild(this._createSpan("help-key-delimiter", ":"));
             keyCell.appendChild(this._lines[i].key);
-            keyCell.appendChild(this._createSpan("help-key-delimiter", ":"));
-            line.createChild("div", "help-cell").textContent = this._lines[i].text;
         }
     },
 
     /**
      * @param {!Array.<!WebInspector.KeyboardShortcut.Descriptor>} sequence
      * @param {string} delimiter
      * @return {!Node}
      */
     _renderSequence: function(sequence, delimiter)
     {
@@ skipping 366 matching lines @@
     Left: [
         WebInspector.KeyboardShortcut.makeDescriptor(WebInspector.KeyboardShortcut.Keys.Left),
         WebInspector.KeyboardShortcut.makeDescriptor("a")
     ],
 
     Right: [
         WebInspector.KeyboardShortcut.makeDescriptor(WebInspector.KeyboardShortcut.Keys.Right),
         WebInspector.KeyboardShortcut.makeDescriptor("d")
     ]
 }