From 481a6a307076404c718bf313300f6d84f6cab5de Mon Sep 17 00:00:00 2001
From: Paul Ivanov <pi@berkeley.edu>
Date: Sun, 4 Aug 2013 08:36:21 -0700
Subject: [PATCH] two column quickhelp dialog, closes #3895

now that quickhelp is a modal dialog, it makes sense to have it be wider
and have the shortcuts take up two columns, instead of one. This change
makes that possible. See the results here:

![new quickhelp css](http://i.imgur.com/nvRTFJm.png)
---
 IPython/html/static/notebook/js/quickhelp.js     | 2 +-
 IPython/html/static/notebook/less/quickhelp.less | 6 ++++++
 IPython/html/static/style/ipython.min.css        | 2 ++
 IPython/html/static/style/style.min.css          | 2 ++
 4 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/IPython/html/static/notebook/js/quickhelp.js b/IPython/html/static/notebook/js/quickhelp.js
index dc83a9e7c..e94c944f2 100644
--- a/IPython/html/static/notebook/js/quickhelp.js
+++ b/IPython/html/static/notebook/js/quickhelp.js
@@ -52,7 +52,7 @@ var IPython = (function (IPython) {
             {key: 'Ctrl-m h', help: 'show keyboard shortcuts'}
         ];
         for (var i=0; i<shortcuts.length; i++) {
-            body.append($('<div>').
+            body.append($('<div>').addClass('quickhelp').
                 append($('<span/>').addClass('shortcut_key').html(shortcuts[i].key)).
                 append($('<span/>').addClass('shortcut_descr').html(' : ' + shortcuts[i].help))
             );
diff --git a/IPython/html/static/notebook/less/quickhelp.less b/IPython/html/static/notebook/less/quickhelp.less
index 603c92a85..d4aca1062 100644
--- a/IPython/html/static/notebook/less/quickhelp.less
+++ b/IPython/html/static/notebook/less/quickhelp.less
@@ -6,4 +6,10 @@
 }
 
 .shortcut_descr {
+    display: inline-block;
+}
+
+div.quickhelp {
+    float: left;
+    width: 50%;
 }
diff --git a/IPython/html/static/style/ipython.min.css b/IPython/html/static/style/ipython.min.css
index 91beaa066..0941abfca 100644
--- a/IPython/html/static/style/ipython.min.css
+++ b/IPython/html/static/style/ipython.min.css
@@ -159,6 +159,8 @@ div#pager_splitter{height:8px;}
 #pager-container{position:relative;padding:15px 0px;}
 div#pager{overflow:auto;display:none;}div#pager pre{font-size:13px;line-height:1.231em;color:#000000;background-color:#f7f7f7;padding:0.4em;}
 .shortcut_key{display:inline-block;width:15ex;text-align:right;font-family:monospace;}
+.shortcut_descr{display:inline-block;}
+div.quickhelp{float:left;width:50%;}
 .rendered_html{color:black;}.rendered_html em{font-style:italic;}
 .rendered_html strong{font-weight:bold;}
 .rendered_html u{text-decoration:underline;}
diff --git a/IPython/html/static/style/style.min.css b/IPython/html/static/style/style.min.css
index e39052669..a110bc3cd 100644
--- a/IPython/html/static/style/style.min.css
+++ b/IPython/html/static/style/style.min.css
@@ -1526,6 +1526,8 @@ div#pager_splitter{height:8px;}
 #pager-container{position:relative;padding:15px 0px;}
 div#pager{overflow:auto;display:none;}div#pager pre{font-size:13px;line-height:1.231em;color:#000000;background-color:#f7f7f7;padding:0.4em;}
 .shortcut_key{display:inline-block;width:15ex;text-align:right;font-family:monospace;}
+.shortcut_descr{display:inline-block;}
+div.quickhelp{float:left;width:50%;}
 .rendered_html{color:black;}.rendered_html em{font-style:italic;}
 .rendered_html strong{font-weight:bold;}
 .rendered_html u{text-decoration:underline;}