Updating CSS for UI example.

examples/notebooks/User Interface.ipynb

@@ -163,7 +163,7 b''
      "outputs": [
       {
        "html": [
-        "<div class=\"hbox\"><div class=\"box-flex0\"><div class=\"quickhelp\"><span class=\"shortcut_key\">esc</span><span class=\"shortcut_descr\"> : command mode</span></div><div class=\"quickhelp\"><span class=\"shortcut_key\">ctrl+m</span><span class=\"shortcut_descr\"> : command mode</span></div><div class=\"quickhelp\"><span class=\"shortcut_key\">shift+enter</span><span class=\"shortcut_descr\"> : run cell</span></div><div class=\"quickhelp\"><span class=\"shortcut_key\">ctrl+enter</span><span class=\"shortcut_descr\"> : run cell, select below</span></div><div class=\"quickhelp\"><span class=\"shortcut_key\">alt+enter</span><span class=\"shortcut_descr\"> : run cell, insert below</span></div></div><div class=\"box-flex0\"><div class=\"quickhelp\"><span class=\"shortcut_key\">up</span><span class=\"shortcut_descr\"> : select previous cell</span></div><div class=\"quickhelp\"><span class=\"shortcut_key\">down</span><span class=\"shortcut_descr\"> : select next cell</span></div><div class=\"quickhelp\"><span class=\"shortcut_key\">alt+-</span><span class=\"shortcut_descr\"> : split cell</span></div><div class=\"quickhelp\"><span class=\"shortcut_key\">meta+s</span><span class=\"shortcut_descr\"> : save notebook</span></div><div class=\"quickhelp\"><span class=\"shortcut_key\">ctrl+s</span><span class=\"shortcut_descr\"> : save notebook</span></div></div></div>"
+        "<div class=\"hbox\"><div class=\"box-flex0\"><div class=\"quickhelp\"><span class=\"shortcut_key\">esc</span><span class=\"shortcut_descr\"> : command mode</span></div><div class=\"quickhelp\"><span class=\"shortcut_key\">ctrl+m</span><span class=\"shortcut_descr\"> : command mode</span></div><div class=\"quickhelp\"><span class=\"shortcut_key\">shift+enter</span><span class=\"shortcut_descr\"> : run cell</span></div><div class=\"quickhelp\"><span class=\"shortcut_key\">ctrl+enter</span><span class=\"shortcut_descr\"> : run cell, select below</span></div></div><div class=\"box-flex0\"><div class=\"quickhelp\"><span class=\"shortcut_key\">alt+enter</span><span class=\"shortcut_descr\"> : run cell, insert below</span></div><div class=\"quickhelp\"><span class=\"shortcut_key\">alt+-</span><span class=\"shortcut_descr\"> : split cell</span></div><div class=\"quickhelp\"><span class=\"shortcut_key\">meta+s</span><span class=\"shortcut_descr\"> : save notebook</span></div><div class=\"quickhelp\"><span class=\"shortcut_key\">ctrl+s</span><span class=\"shortcut_descr\"> : save notebook</span></div></div></div>"
        ],
        "output_type": "display_data"
       },
@@ -176,7 +176,7 b''
        "metadata": {},
        "output_type": "display_data",
        "text": [
-        "<IPython.core.display.Javascript at 0x10e441250>"
+        "<IPython.core.display.Javascript at 0x10e8d1a50>"
        ]
       }
      ],
@@ -223,7 +223,7 b''
        "metadata": {},
        "output_type": "display_data",
        "text": [
-        "<IPython.core.display.Javascript at 0x10e441410>"
+        "<IPython.core.display.Javascript at 0x10e8d11d0>"
        ]
       }
      ],
@@ -281,7 +281,7 b''
         "\n",
         "IPython.keyboard_manager.command_shortcuts.add_shortcut('r', {\n",
         "    help : 'run cell',\n",
-        "    help_index : 'aa',\n",
+        "    help_index : 'zz',\n",
         "    handler : function (event) {\n",
         "        IPython.notebook.execute_cell();\n",
         "        return false;\n",
@@ -291,11 +291,11 b''
        "metadata": {},
        "output_type": "display_data",
        "text": [
-        "<IPython.core.display.Javascript at 0x1019ba990>"
+        "<IPython.core.display.Javascript at 0x10e8d1890>"
        ]
       }
      ],
-     "prompt_number": 6
+     "prompt_number": 7
     },
     {
      "cell_type": "markdown",
@@ -365,7 +365,7 b''
        "metadata": {},
        "output_type": "display_data",
        "text": [
-        "<IPython.core.display.Javascript at 0x1019ba950>"
+        "<IPython.core.display.Javascript at 0x10e8d1950>"
        ]
       }
      ],
@@ -397,7 +397,7 b''
      "cell_type": "code",
      "collapsed": false,
      "input": [
-      "from IPython.display import Javascript, display\n",
+      "from IPython.display import Javascript, display, HTML\n",
       "\n",
       "t = \"\"\"var help = IPython.quick_help.build_{0}_help();\n",
       "help.children().first().remove();\n",
@@ -407,12 +407,34 b''
       "    display(Javascript(t.format('command')))\n",
       "\n",
       "def display_edit_shortcuts():\n",
-      "    display(Javascript(t.format('edit')))    "
+      "    display(Javascript(t.format('edit')))\n",
+      "\n",
+      "display(HTML(\"\"\"\n",
+      "<style>\n",
+      ".shortcut_key {display: inline-block; width: 15ex; text-align: right; font-family: monospace;}\n",
+      ".shortcut_descr {display: inline-block;}\n",
+      "</style>\n",
+      "\"\"\"))"
      ],
      "language": "python",
      "metadata": {},
-     "outputs": [],
-     "prompt_number": 2
+     "outputs": [
+      {
+       "html": [
+        "\n",
+        "<style>\n",
+        ".shortcut_key {display: inline-block; width: 15ex; text-align: right; font-family: monospace;}\n",
+        ".shortcut_descr {display: inline-block;}\n",
+        "</style>\n"
+       ],
+       "metadata": {},
+       "output_type": "display_data",
+       "text": [
+        "<IPython.core.display.HTML at 0x10e8b0690>"
+       ]
+      }
+     ],
+     "prompt_number": 13
     }
    ],
    "metadata": {}