From 373635775c0c359ed6706b910536d7379cd15fed Mon Sep 17 00:00:00 2001 From: "Brian E. Granger" Date: Wed, 20 Nov 2013 17:31:49 -0800 Subject: [PATCH 1/5] Making the cell margin 0 all around. Also moves some css/less code to the outputarea.less. --- IPython/html/static/notebook/less/cell.less | 2 +- .../html/static/notebook/less/codecell.less | 43 ------------------ .../html/static/notebook/less/outputarea.less | 45 ++++++++++++++++++- IPython/html/static/style/ipython.min.css | 15 ++++--- IPython/html/static/style/style.min.css | 15 ++++--- 5 files changed, 61 insertions(+), 59 deletions(-) diff --git a/IPython/html/static/notebook/less/cell.less b/IPython/html/static/notebook/less/cell.less index 2782ea72425..082be485016 100644 --- a/IPython/html/static/notebook/less/cell.less +++ b/IPython/html/static/notebook/less/cell.less @@ -9,7 +9,7 @@ div.cell { width: 100%; padding: 5px 5px 5px 0px; /* This acts as a spacer between cells, that is outside the border */ - margin: 2px 0px 2px 7px; + margin: 0px; outline: none; } diff --git a/IPython/html/static/notebook/less/codecell.less b/IPython/html/static/notebook/less/codecell.less index c4840f6fcb1..9954e3f0f40 100644 --- a/IPython/html/static/notebook/less/codecell.less +++ b/IPython/html/static/notebook/less/codecell.less @@ -22,46 +22,3 @@ div.input_prompt { border-top: 1px solid transparent; } -div.output_wrapper { - /* This is a spacer between the input and output of each cell */ - margin-top: 5px; - /* this position must be relative to enable descendents to be absolute within it */ - position: relative; - .vbox() -} - -/* class for the output area when it should be height-limited */ -div.output_scroll { - /* ideally, this would be max-height, but FF barfs all over that */ - height: 24em; - /* FF needs this *and the wrapper* to specify full width, or it will shrinkwrap */ - width: 100%; - - overflow: auto; - .corner-all; - .box-shadow(inset 0 2px 8px rgba(0, 0, 0, .8)); -} - -/* output div while it is collapsed */ -div.output_collapsed { - margin: 0px; - padding: 0px; - .vbox(); -} - -div.out_prompt_overlay { - height: 100%; - padding: 0px 0.4em; - position: absolute; - .corner-all; -} - -div.out_prompt_overlay:hover { - /* use inner shadow to get border that is computed the same on WebKit/FF */ - .box-shadow(inset 0 0 1px #000); - background: rgba(240, 240, 240, 0.5); -} - -div.output_prompt { - color: darkred; -} diff --git a/IPython/html/static/notebook/less/outputarea.less b/IPython/html/static/notebook/less/outputarea.less index bdc094394a2..c92ccc17d63 100644 --- a/IPython/html/static/notebook/less/outputarea.less +++ b/IPython/html/static/notebook/less/outputarea.less @@ -1,3 +1,47 @@ +div.output_wrapper { + /* This is a spacer between the input and output of each cell */ + margin-top: 5px; + /* this position must be relative to enable descendents to be absolute within it */ + position: relative; + .vbox() +} + +/* class for the output area when it should be height-limited */ +div.output_scroll { + /* ideally, this would be max-height, but FF barfs all over that */ + height: 24em; + /* FF needs this *and the wrapper* to specify full width, or it will shrinkwrap */ + width: 100%; + + overflow: auto; + .corner-all; + .box-shadow(inset 0 2px 8px rgba(0, 0, 0, .8)); +} + +/* output div while it is collapsed */ +div.output_collapsed { + margin: 0px; + padding: 0px; + .vbox(); +} + +div.out_prompt_overlay { + height: 100%; + padding: 0px 0.4em; + position: absolute; + .corner-all; +} + +div.out_prompt_overlay:hover { + /* use inner shadow to get border that is computed the same on WebKit/FF */ + .box-shadow(inset 0 0 1px #000); + background: rgba(240, 240, 240, 0.5); +} + +div.output_prompt { + color: darkred; +} + /* This class is the outer container of all output sections. */ div.output_area { padding: 0px; @@ -23,7 +67,6 @@ div.output_area { } } - /* This is needed to protect the pre formating from global settings such as that of bootstrap */ .output { diff --git a/IPython/html/static/style/ipython.min.css b/IPython/html/static/style/ipython.min.css index f4b44be871b..7cdc34ee37f 100644 --- a/IPython/html/static/style/ipython.min.css +++ b/IPython/html/static/style/ipython.min.css @@ -54,17 +54,11 @@ input.engine_num_input{height:20px;margin-bottom:2px;padding-top:0;padding-botto .ansibgpurple{background-color:magenta;} .ansibgcyan{background-color:cyan;} .ansibggray{background-color:gray;} -div.cell{border:1px solid transparent;display:-webkit-box;-webkit-box-orient:vertical;-webkit-box-align:stretch;display:-moz-box;-moz-box-orient:vertical;-moz-box-align:stretch;display:box;box-orient:vertical;box-align:stretch;width:100%;padding:5px 5px 5px 0px;margin:2px 0px 2px 7px;outline:none;}div.cell.selected{border-radius:4px;border:thin #ababab solid;} +div.cell{border:1px solid transparent;display:-webkit-box;-webkit-box-orient:vertical;-webkit-box-align:stretch;display:-moz-box;-moz-box-orient:vertical;-moz-box-align:stretch;display:box;box-orient:vertical;box-align:stretch;width:100%;padding:5px 5px 5px 0px;margin:0px;outline:none;}div.cell.selected{border-radius:4px;border:thin #ababab solid;} div.prompt{min-width:11ex;padding:0.4em;margin:0px;font-family:monospace;text-align:right;line-height:1.231em;} div.input{page-break-inside:avoid;display:-webkit-box;-webkit-box-orient:horizontal;-webkit-box-align:stretch;display:-moz-box;-moz-box-orient:horizontal;-moz-box-align:stretch;display:box;box-orient:horizontal;box-align:stretch;} div.input_area{border:1px solid #cfcfcf;border-radius:4px;background:#f7f7f7;} div.input_prompt{color:navy;border-top:1px solid transparent;} -div.output_wrapper{margin-top:5px;position:relative;display:-webkit-box;-webkit-box-orient:vertical;-webkit-box-align:stretch;display:-moz-box;-moz-box-orient:vertical;-moz-box-align:stretch;display:box;box-orient:vertical;box-align:stretch;width:100%;} -div.output_scroll{height:24em;width:100%;overflow:auto;border-radius:4px;-webkit-box-shadow:inset 0 2px 8px rgba(0, 0, 0, 0.8);-moz-box-shadow:inset 0 2px 8px rgba(0, 0, 0, 0.8);box-shadow:inset 0 2px 8px rgba(0, 0, 0, 0.8);} -div.output_collapsed{margin:0px;padding:0px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-box-align:stretch;display:-moz-box;-moz-box-orient:vertical;-moz-box-align:stretch;display:box;box-orient:vertical;box-align:stretch;width:100%;} -div.out_prompt_overlay{height:100%;padding:0px 0.4em;position:absolute;border-radius:4px;} -div.out_prompt_overlay:hover{-webkit-box-shadow:inset 0 0 1px #000000;-moz-box-shadow:inset 0 0 1px #000000;box-shadow:inset 0 0 1px #000000;background:rgba(240, 240, 240, 0.5);} -div.output_prompt{color:darkred;} .CodeMirror{line-height:1.231em;height:auto;background:none;} .CodeMirror-scroll{overflow-y:hidden;overflow-x:auto;} @-moz-document url-prefix(){.CodeMirror-scroll{overflow-x:hidden;}}.CodeMirror-lines{padding:0.4em;} @@ -92,6 +86,13 @@ pre .coffeescript .javascript,pre .javascript .xml,pre .tex .formula,pre .xml .j .cm-s-ipython span.cm-operator{color:#AA22FF;font-weight:bold;} .cm-s-ipython span.cm-meta{color:#AA22FF;} .cm-s-ipython span.cm-tab{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAMCAYAAAAkuj5RAAAAAXNSR0IArs4c6QAAAGFJREFUSMft1LsRQFAQheHPowAKoACx3IgEKtaEHujDjORSgWTH/ZOdnZOcM/sgk/kFFWY0qV8foQwS4MKBCS3qR6ixBJvElOobYAtivseIE120FaowJPN75GMu8j/LfMwNjh4HUpwg4LUAAAAASUVORK5CYII=);background-position:right;background-repeat:no-repeat;} +div.output_wrapper{margin-top:5px;position:relative;display:-webkit-box;-webkit-box-orient:vertical;-webkit-box-align:stretch;display:-moz-box;-moz-box-orient:vertical;-moz-box-align:stretch;display:box;box-orient:vertical;box-align:stretch;width:100%;} +div.output_wrapper div.output:empty{margin-top:0px;} +div.output_scroll{height:24em;width:100%;overflow:auto;border-radius:4px;-webkit-box-shadow:inset 0 2px 8px rgba(0, 0, 0, 0.8);-moz-box-shadow:inset 0 2px 8px rgba(0, 0, 0, 0.8);box-shadow:inset 0 2px 8px rgba(0, 0, 0, 0.8);} +div.output_collapsed{margin:0px;padding:0px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-box-align:stretch;display:-moz-box;-moz-box-orient:vertical;-moz-box-align:stretch;display:box;box-orient:vertical;box-align:stretch;width:100%;} +div.out_prompt_overlay{height:100%;padding:0px 0.4em;position:absolute;border-radius:4px;} +div.out_prompt_overlay:hover{-webkit-box-shadow:inset 0 0 1px #000000;-moz-box-shadow:inset 0 0 1px #000000;box-shadow:inset 0 0 1px #000000;background:rgba(240, 240, 240, 0.5);} +div.output_prompt{color:darkred;} div.output_area{padding:0px;page-break-inside:avoid;display:-webkit-box;-webkit-box-orient:horizontal;-webkit-box-align:stretch;display:-moz-box;-moz-box-orient:horizontal;-moz-box-align:stretch;display:box;box-orient:horizontal;box-align:stretch;}div.output_area .MathJax_Display{text-align:left !important;} div.output_area .rendered_html table{margin-left:0;margin-right:0;} div.output_area .rendered_html img{margin-left:0;margin-right:0;} diff --git a/IPython/html/static/style/style.min.css b/IPython/html/static/style/style.min.css index 817ba7387ce..30968ce29cb 100644 --- a/IPython/html/static/style/style.min.css +++ b/IPython/html/static/style/style.min.css @@ -1435,17 +1435,11 @@ input.engine_num_input{height:20px;margin-bottom:2px;padding-top:0;padding-botto .ansibgpurple{background-color:magenta;} .ansibgcyan{background-color:cyan;} .ansibggray{background-color:gray;} -div.cell{border:1px solid transparent;display:-webkit-box;-webkit-box-orient:vertical;-webkit-box-align:stretch;display:-moz-box;-moz-box-orient:vertical;-moz-box-align:stretch;display:box;box-orient:vertical;box-align:stretch;width:100%;padding:5px 5px 5px 0px;margin:2px 0px 2px 7px;outline:none;}div.cell.selected{border-radius:4px;border:thin #ababab solid;} +div.cell{border:1px solid transparent;display:-webkit-box;-webkit-box-orient:vertical;-webkit-box-align:stretch;display:-moz-box;-moz-box-orient:vertical;-moz-box-align:stretch;display:box;box-orient:vertical;box-align:stretch;width:100%;padding:5px 5px 5px 0px;margin:0px;outline:none;}div.cell.selected{border-radius:4px;border:thin #ababab solid;} div.prompt{min-width:11ex;padding:0.4em;margin:0px;font-family:monospace;text-align:right;line-height:1.231em;} div.input{page-break-inside:avoid;display:-webkit-box;-webkit-box-orient:horizontal;-webkit-box-align:stretch;display:-moz-box;-moz-box-orient:horizontal;-moz-box-align:stretch;display:box;box-orient:horizontal;box-align:stretch;} div.input_area{border:1px solid #cfcfcf;border-radius:4px;background:#f7f7f7;} div.input_prompt{color:navy;border-top:1px solid transparent;} -div.output_wrapper{margin-top:5px;position:relative;display:-webkit-box;-webkit-box-orient:vertical;-webkit-box-align:stretch;display:-moz-box;-moz-box-orient:vertical;-moz-box-align:stretch;display:box;box-orient:vertical;box-align:stretch;width:100%;} -div.output_scroll{height:24em;width:100%;overflow:auto;border-radius:4px;-webkit-box-shadow:inset 0 2px 8px rgba(0, 0, 0, 0.8);-moz-box-shadow:inset 0 2px 8px rgba(0, 0, 0, 0.8);box-shadow:inset 0 2px 8px rgba(0, 0, 0, 0.8);} -div.output_collapsed{margin:0px;padding:0px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-box-align:stretch;display:-moz-box;-moz-box-orient:vertical;-moz-box-align:stretch;display:box;box-orient:vertical;box-align:stretch;width:100%;} -div.out_prompt_overlay{height:100%;padding:0px 0.4em;position:absolute;border-radius:4px;} -div.out_prompt_overlay:hover{-webkit-box-shadow:inset 0 0 1px #000000;-moz-box-shadow:inset 0 0 1px #000000;box-shadow:inset 0 0 1px #000000;background:rgba(240, 240, 240, 0.5);} -div.output_prompt{color:darkred;} .CodeMirror{line-height:1.231em;height:auto;background:none;} .CodeMirror-scroll{overflow-y:hidden;overflow-x:auto;} @-moz-document url-prefix(){.CodeMirror-scroll{overflow-x:hidden;}}.CodeMirror-lines{padding:0.4em;} @@ -1473,6 +1467,13 @@ pre .coffeescript .javascript,pre .javascript .xml,pre .tex .formula,pre .xml .j .cm-s-ipython span.cm-operator{color:#AA22FF;font-weight:bold;} .cm-s-ipython span.cm-meta{color:#AA22FF;} .cm-s-ipython span.cm-tab{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAMCAYAAAAkuj5RAAAAAXNSR0IArs4c6QAAAGFJREFUSMft1LsRQFAQheHPowAKoACx3IgEKtaEHujDjORSgWTH/ZOdnZOcM/sgk/kFFWY0qV8foQwS4MKBCS3qR6ixBJvElOobYAtivseIE120FaowJPN75GMu8j/LfMwNjh4HUpwg4LUAAAAASUVORK5CYII=);background-position:right;background-repeat:no-repeat;} +div.output_wrapper{margin-top:5px;position:relative;display:-webkit-box;-webkit-box-orient:vertical;-webkit-box-align:stretch;display:-moz-box;-moz-box-orient:vertical;-moz-box-align:stretch;display:box;box-orient:vertical;box-align:stretch;width:100%;} +div.output_wrapper div.output:empty{margin-top:0px;} +div.output_scroll{height:24em;width:100%;overflow:auto;border-radius:4px;-webkit-box-shadow:inset 0 2px 8px rgba(0, 0, 0, 0.8);-moz-box-shadow:inset 0 2px 8px rgba(0, 0, 0, 0.8);box-shadow:inset 0 2px 8px rgba(0, 0, 0, 0.8);} +div.output_collapsed{margin:0px;padding:0px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-box-align:stretch;display:-moz-box;-moz-box-orient:vertical;-moz-box-align:stretch;display:box;box-orient:vertical;box-align:stretch;width:100%;} +div.out_prompt_overlay{height:100%;padding:0px 0.4em;position:absolute;border-radius:4px;} +div.out_prompt_overlay:hover{-webkit-box-shadow:inset 0 0 1px #000000;-moz-box-shadow:inset 0 0 1px #000000;box-shadow:inset 0 0 1px #000000;background:rgba(240, 240, 240, 0.5);} +div.output_prompt{color:darkred;} div.output_area{padding:0px;page-break-inside:avoid;display:-webkit-box;-webkit-box-orient:horizontal;-webkit-box-align:stretch;display:-moz-box;-moz-box-orient:horizontal;-moz-box-align:stretch;display:box;box-orient:horizontal;box-align:stretch;}div.output_area .MathJax_Display{text-align:left !important;} div.output_area .rendered_html table{margin-left:0;margin-right:0;} div.output_area .rendered_html img{margin-left:0;margin-right:0;} From 27dea3d2f8e7c0e66b243ae7435dc60a789df29a Mon Sep 17 00:00:00 2001 From: "Brian E. Granger" Date: Thu, 21 Nov 2013 16:38:38 -0800 Subject: [PATCH 2/5] Adjusting padding of output subareas and adding @code_padding. --- IPython/html/static/notebook/less/cell.less | 4 ++-- IPython/html/static/notebook/less/codemirror.less | 4 ++-- IPython/html/static/notebook/less/outputarea.less | 11 ++++------- IPython/html/static/notebook/less/pager.less | 2 +- IPython/html/static/notebook/less/variables.less | 1 + IPython/html/static/style/ipython.min.css | 6 ++---- IPython/html/static/style/style.min.css | 6 ++---- 7 files changed, 14 insertions(+), 20 deletions(-) diff --git a/IPython/html/static/notebook/less/cell.less b/IPython/html/static/notebook/less/cell.less index 082be485016..7d508d8cc2d 100644 --- a/IPython/html/static/notebook/less/cell.less +++ b/IPython/html/static/notebook/less/cell.less @@ -16,8 +16,8 @@ div.cell { div.prompt { /* This needs to be wide enough for 3 digit prompt numbers: In[100]: */ min-width: 11ex; - /* This 0.4em is tuned to match the padding on the CodeMirror editor. */ - padding: 0.4em; + /* This padding is tuned to match the padding on the CodeMirror editor. */ + padding: @code_padding; margin: 0px; font-family: @monoFontFamily; text-align: right; diff --git a/IPython/html/static/notebook/less/codemirror.less b/IPython/html/static/notebook/less/codemirror.less index 542daff3bf2..512157bf87d 100644 --- a/IPython/html/static/notebook/less/codemirror.less +++ b/IPython/html/static/notebook/less/codemirror.less @@ -33,11 +33,11 @@ .CodeMirror-lines { /* In CM2, this used to be 0.4em, but in CM3 it went to 4px. We need the em value because */ /* we have set a different line-height and want this to scale with that. */ - padding: 0.4em; + padding: @code_padding; } .CodeMirror-linenumber { - // This is needed to fine tune the position of the line numbers because we use the 0.4em + // This is needed to fine tune the position of the line numbers because we use the 0.4em in @code_padding // spacing in various places. Fine tuned to look right. padding: 0 8px 0 4px; } diff --git a/IPython/html/static/notebook/less/outputarea.less b/IPython/html/static/notebook/less/outputarea.less index c92ccc17d63..8ccabe05fef 100644 --- a/IPython/html/static/notebook/less/outputarea.less +++ b/IPython/html/static/notebook/less/outputarea.less @@ -1,6 +1,4 @@ div.output_wrapper { - /* This is a spacer between the input and output of each cell */ - margin-top: 5px; /* this position must be relative to enable descendents to be absolute within it */ position: relative; .vbox() @@ -27,7 +25,7 @@ div.output_collapsed { div.out_prompt_overlay { height: 100%; - padding: 0px 0.4em; + padding: 0px @code_padding; position: absolute; .corner-all; } @@ -89,8 +87,7 @@ div.output_area pre { /* This class is for the output subarea inside the output_area and after the prompt div. */ div.output_subarea { - padding: 0.44em 0.4em 0.4em 1px; - margin-left: 6px; + padding: @code_padding @code_padding 0.0em @code_padding; .box-flex1(); } @@ -108,11 +105,11 @@ div.output_text { /* stdout/stderr are 'text' as well as 'stream', but pyout/pyerr are *not* streams */ div.output_stream { - padding-top: 0.0em; - padding-bottom: 0.0em; } + div.output_stdout { } + div.output_stderr { background: #fdd; /* very light red background for stderr */ } diff --git a/IPython/html/static/notebook/less/pager.less b/IPython/html/static/notebook/less/pager.less index 805f8fcf167..3ba80e489ed 100644 --- a/IPython/html/static/notebook/less/pager.less +++ b/IPython/html/static/notebook/less/pager.less @@ -16,6 +16,6 @@ div#pager { line-height: @code_line_height; color: @textColor; background-color: @cell_background; - padding: 0.4em; + padding: @code_padding; } } diff --git a/IPython/html/static/notebook/less/variables.less b/IPython/html/static/notebook/less/variables.less index e1f55eb2ea7..01d6ab23fc9 100644 --- a/IPython/html/static/notebook/less/variables.less +++ b/IPython/html/static/notebook/less/variables.less @@ -6,4 +6,5 @@ @border_color: darken(@cell_selected_background, 31%); @light_border_color: darken(@cell_selected_background, 17%); @border_width: 1px; +@code_padding: 0.4em; diff --git a/IPython/html/static/style/ipython.min.css b/IPython/html/static/style/ipython.min.css index 7cdc34ee37f..c01d9f6510c 100644 --- a/IPython/html/static/style/ipython.min.css +++ b/IPython/html/static/style/ipython.min.css @@ -86,8 +86,7 @@ pre .coffeescript .javascript,pre .javascript .xml,pre .tex .formula,pre .xml .j .cm-s-ipython span.cm-operator{color:#AA22FF;font-weight:bold;} .cm-s-ipython span.cm-meta{color:#AA22FF;} .cm-s-ipython span.cm-tab{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAMCAYAAAAkuj5RAAAAAXNSR0IArs4c6QAAAGFJREFUSMft1LsRQFAQheHPowAKoACx3IgEKtaEHujDjORSgWTH/ZOdnZOcM/sgk/kFFWY0qV8foQwS4MKBCS3qR6ixBJvElOobYAtivseIE120FaowJPN75GMu8j/LfMwNjh4HUpwg4LUAAAAASUVORK5CYII=);background-position:right;background-repeat:no-repeat;} -div.output_wrapper{margin-top:5px;position:relative;display:-webkit-box;-webkit-box-orient:vertical;-webkit-box-align:stretch;display:-moz-box;-moz-box-orient:vertical;-moz-box-align:stretch;display:box;box-orient:vertical;box-align:stretch;width:100%;} -div.output_wrapper div.output:empty{margin-top:0px;} +div.output_wrapper{position:relative;display:-webkit-box;-webkit-box-orient:vertical;-webkit-box-align:stretch;display:-moz-box;-moz-box-orient:vertical;-moz-box-align:stretch;display:box;box-orient:vertical;box-align:stretch;width:100%;} div.output_scroll{height:24em;width:100%;overflow:auto;border-radius:4px;-webkit-box-shadow:inset 0 2px 8px rgba(0, 0, 0, 0.8);-moz-box-shadow:inset 0 2px 8px rgba(0, 0, 0, 0.8);box-shadow:inset 0 2px 8px rgba(0, 0, 0, 0.8);} div.output_collapsed{margin:0px;padding:0px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-box-align:stretch;display:-moz-box;-moz-box-orient:vertical;-moz-box-align:stretch;display:box;box-orient:vertical;box-align:stretch;width:100%;} div.out_prompt_overlay{height:100%;padding:0px 0.4em;position:absolute;border-radius:4px;} @@ -98,9 +97,8 @@ div.output_area .rendered_html table{margin-left:0;margin-right:0;} div.output_area .rendered_html img{margin-left:0;margin-right:0;} .output{display:-webkit-box;-webkit-box-orient:vertical;-webkit-box-align:stretch;display:-moz-box;-moz-box-orient:vertical;-moz-box-align:stretch;display:box;box-orient:vertical;box-align:stretch;width:100%;} div.output_area pre{font-family:monospace;margin:0;padding:0;border:0;font-size:100%;vertical-align:baseline;color:black;background-color:transparent;-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;line-height:inherit;} -div.output_subarea{padding:0.44em 0.4em 0.4em 1px;margin-left:6px;-webkit-box-flex:1;-moz-box-flex:1;box-flex:1;} +div.output_subarea{padding:0.4em 0.4em 0em 0.4em;-webkit-box-flex:1;-moz-box-flex:1;box-flex:1;} div.output_text{text-align:left;color:#000000;font-family:monospace;line-height:1.231em;} -div.output_stream{padding-top:0.0em;padding-bottom:0.0em;} div.output_stderr{background:#fdd;} div.output_latex{text-align:left;} .js-error{color:darkred;} diff --git a/IPython/html/static/style/style.min.css b/IPython/html/static/style/style.min.css index 30968ce29cb..8a4cd950de4 100644 --- a/IPython/html/static/style/style.min.css +++ b/IPython/html/static/style/style.min.css @@ -1467,8 +1467,7 @@ pre .coffeescript .javascript,pre .javascript .xml,pre .tex .formula,pre .xml .j .cm-s-ipython span.cm-operator{color:#AA22FF;font-weight:bold;} .cm-s-ipython span.cm-meta{color:#AA22FF;} .cm-s-ipython span.cm-tab{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAMCAYAAAAkuj5RAAAAAXNSR0IArs4c6QAAAGFJREFUSMft1LsRQFAQheHPowAKoACx3IgEKtaEHujDjORSgWTH/ZOdnZOcM/sgk/kFFWY0qV8foQwS4MKBCS3qR6ixBJvElOobYAtivseIE120FaowJPN75GMu8j/LfMwNjh4HUpwg4LUAAAAASUVORK5CYII=);background-position:right;background-repeat:no-repeat;} -div.output_wrapper{margin-top:5px;position:relative;display:-webkit-box;-webkit-box-orient:vertical;-webkit-box-align:stretch;display:-moz-box;-moz-box-orient:vertical;-moz-box-align:stretch;display:box;box-orient:vertical;box-align:stretch;width:100%;} -div.output_wrapper div.output:empty{margin-top:0px;} +div.output_wrapper{position:relative;display:-webkit-box;-webkit-box-orient:vertical;-webkit-box-align:stretch;display:-moz-box;-moz-box-orient:vertical;-moz-box-align:stretch;display:box;box-orient:vertical;box-align:stretch;width:100%;} div.output_scroll{height:24em;width:100%;overflow:auto;border-radius:4px;-webkit-box-shadow:inset 0 2px 8px rgba(0, 0, 0, 0.8);-moz-box-shadow:inset 0 2px 8px rgba(0, 0, 0, 0.8);box-shadow:inset 0 2px 8px rgba(0, 0, 0, 0.8);} div.output_collapsed{margin:0px;padding:0px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-box-align:stretch;display:-moz-box;-moz-box-orient:vertical;-moz-box-align:stretch;display:box;box-orient:vertical;box-align:stretch;width:100%;} div.out_prompt_overlay{height:100%;padding:0px 0.4em;position:absolute;border-radius:4px;} @@ -1479,9 +1478,8 @@ div.output_area .rendered_html table{margin-left:0;margin-right:0;} div.output_area .rendered_html img{margin-left:0;margin-right:0;} .output{display:-webkit-box;-webkit-box-orient:vertical;-webkit-box-align:stretch;display:-moz-box;-moz-box-orient:vertical;-moz-box-align:stretch;display:box;box-orient:vertical;box-align:stretch;width:100%;} div.output_area pre{font-family:monospace;margin:0;padding:0;border:0;font-size:100%;vertical-align:baseline;color:black;background-color:transparent;-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;line-height:inherit;} -div.output_subarea{padding:0.44em 0.4em 0.4em 1px;margin-left:6px;-webkit-box-flex:1;-moz-box-flex:1;box-flex:1;} +div.output_subarea{padding:0.4em 0.4em 0em 0.4em;-webkit-box-flex:1;-moz-box-flex:1;box-flex:1;} div.output_text{text-align:left;color:#000000;font-family:monospace;line-height:1.231em;} -div.output_stream{padding-top:0.0em;padding-bottom:0.0em;} div.output_stderr{background:#fdd;} div.output_latex{text-align:left;} .js-error{color:darkred;} From d01bdd0a2acdede45a3b95eb745b800bfa5a40fc Mon Sep 17 00:00:00 2001 From: "Brian E. Granger" Date: Fri, 22 Nov 2013 14:01:35 -0800 Subject: [PATCH 3/5] Tabs to spaces in variables.less. --- IPython/html/static/notebook/less/variables.less | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/IPython/html/static/notebook/less/variables.less b/IPython/html/static/notebook/less/variables.less index 01d6ab23fc9..0d5540cd774 100644 --- a/IPython/html/static/notebook/less/variables.less +++ b/IPython/html/static/notebook/less/variables.less @@ -1,10 +1,10 @@ // Our own variables for this page -@cell_selected_background: darken(@bodyBackground, 2%); -@cell_background: darken(@bodyBackground, 3.2%); -@border_color: darken(@cell_selected_background, 31%); -@light_border_color: darken(@cell_selected_background, 17%); -@border_width: 1px; +@cell_selected_background: darken(@bodyBackground, 2%); +@cell_background: darken(@bodyBackground, 3.2%); +@border_color: darken(@cell_selected_background, 31%); +@light_border_color: darken(@cell_selected_background, 17%); +@border_width: 1px; @code_padding: 0.4em; From 3aaab49a21c32fcff7dc4e6d8ebfef8b9acb9d75 Mon Sep 17 00:00:00 2001 From: "Brian E. Granger" Date: Fri, 22 Nov 2013 14:25:57 -0800 Subject: [PATCH 4/5] More tabs to spaces on less files. --- IPython/html/static/base/less/flexbox.less | 110 +++++++++--------- .../html/static/notebook/less/completer.less | 6 +- .../html/static/notebook/less/notebook.less | 4 +- 3 files changed, 60 insertions(+), 60 deletions(-) diff --git a/IPython/html/static/base/less/flexbox.less b/IPython/html/static/base/less/flexbox.less index 0e52d7080d3..052868b9129 100644 --- a/IPython/html/static/base/less/flexbox.less +++ b/IPython/html/static/base/less/flexbox.less @@ -3,63 +3,63 @@ /* Taken from Alex Russell http://infrequently.org/2009/08/css-3-progress/ */ .hbox { - display: -webkit-box; - -webkit-box-orient: horizontal; - -webkit-box-align: stretch; + display: -webkit-box; + -webkit-box-orient: horizontal; + -webkit-box-align: stretch; - display: -moz-box; - -moz-box-orient: horizontal; - -moz-box-align: stretch; + display: -moz-box; + -moz-box-orient: horizontal; + -moz-box-align: stretch; - display: box; - box-orient: horizontal; - box-align: stretch; + display: box; + box-orient: horizontal; + box-align: stretch; } .hbox > * { - -webkit-box-flex: 0; - -moz-box-flex: 0; - box-flex: 0; + -webkit-box-flex: 0; + -moz-box-flex: 0; + box-flex: 0; } .vbox { - display: -webkit-box; - -webkit-box-orient: vertical; - -webkit-box-align: stretch; - - display: -moz-box; - -moz-box-orient: vertical; - -moz-box-align: stretch; - - display: box; - box-orient: vertical; - box-align: stretch; - /* width must be 100% to force FF to behave like webkit */ - width: 100%; + display: -webkit-box; + -webkit-box-orient: vertical; + -webkit-box-align: stretch; + + display: -moz-box; + -moz-box-orient: vertical; + -moz-box-align: stretch; + + display: box; + box-orient: vertical; + box-align: stretch; + /* width must be 100% to force FF to behave like webkit */ + width: 100%; } .vbox > * { - -webkit-box-flex: 0; - -moz-box-flex: 0; - box-flex: 0; + -webkit-box-flex: 0; + -moz-box-flex: 0; + box-flex: 0; } .reverse { - -webkit-box-direction: reverse; - -moz-box-direction: reverse; - box-direction: reverse; + -webkit-box-direction: reverse; + -moz-box-direction: reverse; + box-direction: reverse; } .box-flex0 { - -webkit-box-flex: 0; - -moz-box-flex: 0; - box-flex: 0; + -webkit-box-flex: 0; + -moz-box-flex: 0; + box-flex: 0; } .box-flex1 { - -webkit-box-flex: 1; - -moz-box-flex: 1; - box-flex: 1; + -webkit-box-flex: 1; + -moz-box-flex: 1; + box-flex: 1; } .box-flex { @@ -69,37 +69,37 @@ .box-flex2 { - -webkit-box-flex: 2; - -moz-box-flex: 2; - box-flex: 2; + -webkit-box-flex: 2; + -moz-box-flex: 2; + box-flex: 2; } .box-group1 { - -webkit-box-flex-group: 1; - -moz-box-flex-group: 1; - box-flex-group: 1; + -webkit-box-flex-group: 1; + -moz-box-flex-group: 1; + box-flex-group: 1; } .box-group2 { - -webkit-box-flex-group: 2; - -moz-box-flex-group: 2; - box-flex-group: 2; + -webkit-box-flex-group: 2; + -moz-box-flex-group: 2; + box-flex-group: 2; } .start { - -webkit-box-pack: start; - -moz-box-pack: start; - box-pack: start; + -webkit-box-pack: start; + -moz-box-pack: start; + box-pack: start; } .end { - -webkit-box-pack: end; - -moz-box-pack: end; - box-pack: end; + -webkit-box-pack: end; + -moz-box-pack: end; + box-pack: end; } .center { - -webkit-box-pack: center; - -moz-box-pack: center; - box-pack: center; + -webkit-box-pack: center; + -moz-box-pack: center; + box-pack: center; } diff --git a/IPython/html/static/notebook/less/completer.less b/IPython/html/static/notebook/less/completer.less index 7073ec83064..165ad177ec5 100644 --- a/IPython/html/static/notebook/less/completer.less +++ b/IPython/html/static/notebook/less/completer.less @@ -3,8 +3,8 @@ z-index: 10; overflow: hidden; border: 1px solid @border_color; - .corner-all; - .box-shadow(0px 6px 10px -1px #adadad); + .corner-all; + .box-shadow(0px 6px 10px -1px #adadad); } .completions select { @@ -15,7 +15,7 @@ margin: 0px; overflow: auto; font-family: @monoFontFamily; - font-size: 110%; + font-size: 110%; color: @textColor; } diff --git a/IPython/html/static/notebook/less/notebook.less b/IPython/html/static/notebook/less/notebook.less index ad65ca16818..f84e1c19c19 100644 --- a/IPython/html/static/notebook/less/notebook.less +++ b/IPython/html/static/notebook/less/notebook.less @@ -1,6 +1,6 @@ body { - background-color: @bodyBackground; + background-color: @bodyBackground; } body.notebook_app { @@ -57,7 +57,7 @@ pre, code, kbd, samp { white-space: pre-wrap; } } p { - margin-bottom:0; + margin-bottom:0; } .end_space { From 009e7713472d6bfa482a3f3b0ec20deabbad745e Mon Sep 17 00:00:00 2001 From: "Brian E. Granger" Date: Thu, 5 Dec 2013 12:30:28 -0800 Subject: [PATCH 5/5] Cleaning up indentation and spacing of less files touched. --- IPython/html/static/base/less/flexbox.less | 2 - .../html/static/notebook/less/codemirror.less | 44 ++++++------ .../html/static/notebook/less/completer.less | 2 +- .../html/static/notebook/less/notebook.less | 4 +- .../html/static/notebook/less/outputarea.less | 72 ++++++++++--------- 5 files changed, 62 insertions(+), 62 deletions(-) diff --git a/IPython/html/static/base/less/flexbox.less b/IPython/html/static/base/less/flexbox.less index 052868b9129..089bb39ab94 100644 --- a/IPython/html/static/base/less/flexbox.less +++ b/IPython/html/static/base/less/flexbox.less @@ -66,8 +66,6 @@ .box-flex1(); } - - .box-flex2 { -webkit-box-flex: 2; -moz-box-flex: 2; diff --git a/IPython/html/static/notebook/less/codemirror.less b/IPython/html/static/notebook/less/codemirror.less index 512157bf87d..aa440e2a291 100644 --- a/IPython/html/static/notebook/less/codemirror.less +++ b/IPython/html/static/notebook/less/codemirror.less @@ -11,8 +11,8 @@ .CodeMirror { line-height: @code_line_height; /* Changed from 1em to our global default */ - height: auto; /* Changed to auto to autogrow */ - background: none; /* Changed from white to allow our bg to show through */ + height: auto; /* Changed to auto to autogrow */ + background: none; /* Changed from white to allow our bg to show through */ } .CodeMirror-scroll { @@ -23,36 +23,36 @@ } @-moz-document url-prefix() { - /* Firefox does weird and terrible things (#3549) when overflow-x is auto */ - /* It doesn't respect the overflow setting anyway, so we can workaround it with this */ - .CodeMirror-scroll { - overflow-x: hidden; - } + /* Firefox does weird and terrible things (#3549) when overflow-x is auto */ + /* It doesn't respect the overflow setting anyway, so we can workaround it with this */ + .CodeMirror-scroll { + overflow-x: hidden; + } } .CodeMirror-lines { - /* In CM2, this used to be 0.4em, but in CM3 it went to 4px. We need the em value because */ - /* we have set a different line-height and want this to scale with that. */ - padding: @code_padding; + /* In CM2, this used to be 0.4em, but in CM3 it went to 4px. We need the em value because */ + /* we have set a different line-height and want this to scale with that. */ + padding: @code_padding; } .CodeMirror-linenumber { - // This is needed to fine tune the position of the line numbers because we use the 0.4em in @code_padding - // spacing in various places. Fine tuned to look right. - padding: 0 8px 0 4px; + // This is needed to fine tune the position of the line numbers because we use the 0.4em in @code_padding + // spacing in various places. Fine tuned to look right. + padding: 0 8px 0 4px; } .CodeMirror-gutters { - // This is needed because our cell has rounded corners, otherwise the gutter area square - // corner cuts into the rounded cell border. - border-bottom-left-radius: @baseBorderRadius; - border-top-left-radius: @baseBorderRadius; + // This is needed because our cell has rounded corners, otherwise the gutter area square + // corner cuts into the rounded cell border. + border-bottom-left-radius: @baseBorderRadius; + border-top-left-radius: @baseBorderRadius; } .CodeMirror pre { - /* In CM3 this went to 4px from 0 in CM2. We need the 0 value because of how we size */ - /* .CodeMirror-lines */ - padding: 0; - border: 0; - .border-radius(0) + /* In CM3 this went to 4px from 0 in CM2. We need the 0 value because of how we size */ + /* .CodeMirror-lines */ + padding: 0; + border: 0; + .border-radius(0) } diff --git a/IPython/html/static/notebook/less/completer.less b/IPython/html/static/notebook/less/completer.less index 165ad177ec5..6f633ded760 100644 --- a/IPython/html/static/notebook/less/completer.less +++ b/IPython/html/static/notebook/less/completer.less @@ -20,5 +20,5 @@ } .completions select option.context { - color: @blueDark; + color: @blueDark; } diff --git a/IPython/html/static/notebook/less/notebook.less b/IPython/html/static/notebook/less/notebook.less index f84e1c19c19..b51f3562b2d 100644 --- a/IPython/html/static/notebook/less/notebook.less +++ b/IPython/html/static/notebook/less/notebook.less @@ -2,7 +2,7 @@ body { background-color: @bodyBackground; } - + body.notebook_app { overflow: hidden; } @@ -61,5 +61,5 @@ p { } .end_space { - height: 200px; + height: 200px; } diff --git a/IPython/html/static/notebook/less/outputarea.less b/IPython/html/static/notebook/less/outputarea.less index 8ccabe05fef..c50f6ad40f7 100644 --- a/IPython/html/static/notebook/less/outputarea.less +++ b/IPython/html/static/notebook/less/outputarea.less @@ -6,34 +6,34 @@ div.output_wrapper { /* class for the output area when it should be height-limited */ div.output_scroll { - /* ideally, this would be max-height, but FF barfs all over that */ - height: 24em; - /* FF needs this *and the wrapper* to specify full width, or it will shrinkwrap */ - width: 100%; + /* ideally, this would be max-height, but FF barfs all over that */ + height: 24em; + /* FF needs this *and the wrapper* to specify full width, or it will shrinkwrap */ + width: 100%; - overflow: auto; - .corner-all; - .box-shadow(inset 0 2px 8px rgba(0, 0, 0, .8)); + overflow: auto; + .corner-all; + .box-shadow(inset 0 2px 8px rgba(0, 0, 0, .8)); } /* output div while it is collapsed */ div.output_collapsed { - margin: 0px; - padding: 0px; - .vbox(); + margin: 0px; + padding: 0px; + .vbox(); } div.out_prompt_overlay { - height: 100%; - padding: 0px @code_padding; - position: absolute; - .corner-all; + height: 100%; + padding: 0px @code_padding; + position: absolute; + .corner-all; } div.out_prompt_overlay:hover { - /* use inner shadow to get border that is computed the same on WebKit/FF */ - .box-shadow(inset 0 0 1px #000); - background: rgba(240, 240, 240, 0.5); + /* use inner shadow to get border that is computed the same on WebKit/FF */ + .box-shadow(inset 0 0 1px #000); + background: rgba(240, 240, 240, 0.5); } div.output_prompt { @@ -71,8 +71,8 @@ div.output_area { .vbox(); } -div.output_area pre { - font-family: @monoFontFamily; +div.output_area pre { + font-family: @monoFontFamily; margin: 0; padding: 0; border: 0; @@ -99,7 +99,7 @@ div.output_text { text-align: left; color: @textColor; font-family: @monoFontFamily; - /* This has to match that of the the CodeMirror class line-height below */ + /* This has to match that of the the CodeMirror class line-height below */ line-height: @code_line_height; } @@ -134,26 +134,28 @@ div.output_jpeg { /* raw_input styles */ div.raw_input { - padding-top: 0px; - padding-bottom: 0px; - height: 1em; - line-height: 1em; - font-family: @monoFontFamily; + padding-top: 0px; + padding-bottom: 0px; + height: 1em; + line-height: 1em; + font-family: @monoFontFamily; } + span.input_prompt { - font-family: inherit; + font-family: inherit; } + input.raw_input { - font-family: inherit; - font-size: inherit; - color: inherit; - width: auto; - margin: -2px 0px 0px 1px; - padding-left: 1px; - padding-top: 2px; - height: 1em; + font-family: inherit; + font-size: inherit; + color: inherit; + width: auto; + margin: -2px 0px 0px 1px; + padding-left: 1px; + padding-top: 2px; + height: 1em; } p.p-space { - margin-bottom: 10px; + margin-bottom: 10px; }