diff --git a/IPython/frontend/html/notebook/fabfile.py b/IPython/frontend/html/notebook/fabfile.py index 26d8ed1ab..224e1486c 100644 --- a/IPython/frontend/html/notebook/fabfile.py +++ b/IPython/frontend/html/notebook/fabfile.py @@ -7,19 +7,24 @@ import os static_dir = 'static' components_dir = os.path.join(static_dir, 'components') -def css(minify=True): +def css(minify=True, verbose=False): """generate the css from less files""" source = os.path.join('style', 'style.less') target = os.path.join('style', 'style.min.css') - _compile_less(source, target, minify) + _compile_less(source, target, minify, verbose) -def _compile_less(source, target, minify=True): +def _to_bool(b): + if not b in ['True', 'False', True, False]: + abort('boolean expected, got: %s' % b) + return (b in ['True', True]) + +def _compile_less(source, target, minify=True, verbose=False): """Complie a less file by source and target relative to static_dir""" - if minify not in ['True', 'False', True, False]: - abort('minify must be Boolean') - minify = (minify in ['True',True]) - min_flag= '-x' if minify is True else '' + minify = _to_bool(minify) + verbose = _to_bool(verbose) + min_flag = '-x' if minify is True else '' + ver_flag = '--verbose' if verbose is True else '' lessc = os.path.join('components', 'less.js', 'bin', 'lessc') with lcd(static_dir): - local('{lessc} {min_flag} {source} {target}'.format(**locals())) + local('{lessc} {min_flag} {ver_flag} {source} {target}'.format(**locals())) diff --git a/IPython/frontend/html/notebook/static/notebook/js/main.js b/IPython/frontend/html/notebook/static/notebook/js/main.js index 77ab8deac..ae2123142 100644 --- a/IPython/frontend/html/notebook/static/notebook/js/main.js +++ b/IPython/frontend/html/notebook/static/notebook/js/main.js @@ -44,7 +44,7 @@ $(document).ready(function () { IPython.page = new IPython.Page(); IPython.layout_manager = new IPython.LayoutManager(); IPython.pager = new IPython.Pager('div#pager', 'div#pager_splitter'); - IPython.quick_help = new IPython.QuickHelp('span#quick_help_area'); + IPython.quick_help = new IPython.QuickHelp(); IPython.login_widget = new IPython.LoginWidget('span#login_widget',{baseProjectUrl:baseProjectUrl}); IPython.notebook = new IPython.Notebook('div#notebook',{baseProjectUrl:baseProjectUrl, read_only:IPython.read_only}); IPython.save_widget = new IPython.SaveWidget('span#save_widget'); diff --git a/IPython/frontend/html/notebook/static/notebook/less/ansicolors.less b/IPython/frontend/html/notebook/static/notebook/less/ansicolors.less new file mode 100644 index 000000000..9ae8d87d9 --- /dev/null +++ b/IPython/frontend/html/notebook/static/notebook/less/ansicolors.less @@ -0,0 +1,13 @@ +/* CSS font colors for translated ANSI colors. */ + + +.ansiblack {color: black;} +.ansired {color: darkred;} +.ansigreen {color: darkgreen;} +.ansiyellow {color: brown;} +.ansiblue {color: darkblue;} +.ansipurple {color: darkviolet;} +.ansicyan {color: steelblue;} +.ansigrey {color: grey;} +.ansibold {font-weight: bold;} + diff --git a/IPython/frontend/html/notebook/static/notebook/less/cell.less b/IPython/frontend/html/notebook/static/notebook/less/cell.less new file mode 100644 index 000000000..610a790c1 --- /dev/null +++ b/IPython/frontend/html/notebook/static/notebook/less/cell.less @@ -0,0 +1,29 @@ +.cell { + border: 1px solid transparent; + .vbox(); + + &.selected { + .corner-all; + border : thin @border_color solid; + } +} + +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 0px; + outline: none; +} + +div.prompt { + /* This needs to be wide enough for 3 digit prompt numbers: In[100]: */ + width: 11ex; + /* This 0.4em is tuned to match the padding on the CodeMirror editor. */ + padding: 0.4em; + margin: 0px; + font-family: @monoFontFamily; + text-align: right; + /* This has to match that of the the CodeMirror class line-height below */ + line-height: @baseLineHeight; +} diff --git a/IPython/frontend/html/notebook/static/notebook/less/codecell.less b/IPython/frontend/html/notebook/static/notebook/less/codecell.less new file mode 100644 index 000000000..2ca1dff5a --- /dev/null +++ b/IPython/frontend/html/notebook/static/notebook/less/codecell.less @@ -0,0 +1,69 @@ +div.code_cell { +} + +/* any special styling for code cells that are currently running goes here */ +div.code_cell.running { +} + +div.input { + page-break-inside: avoid; + .hbox(); +} + +/* input_area and input_prompt must match in top border and margin for alignment */ +div.input_area { + border: 1px solid @light_border_color; + .corner-all; + background: @cell_background; +} + +div.input_prompt { + color: navy; + border-top: 1px solid transparent; +} + +div.output_wrapper { + /* This is a spacer between the input and output of each cell */ + margin-top: 5px; + margin-left: 5px; + /* FF needs explicit width to stretch */ + width: 100%; + /* this position must be relative to enable descendents to be absolute within it */ + position: relative; +} + +/* 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-right: 5px; +} + +div.out_prompt_overlay { + height: 100%; + padding: 0px; + 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; + /* 5px right shift to account for margin in parent container */ + margin: 0 5px 0 -5px; +} diff --git a/IPython/frontend/html/notebook/static/notebook/less/codemirror.less b/IPython/frontend/html/notebook/static/notebook/less/codemirror.less new file mode 100644 index 000000000..4b3fbecb4 --- /dev/null +++ b/IPython/frontend/html/notebook/static/notebook/less/codemirror.less @@ -0,0 +1,37 @@ +/* The following gets added to the if it is detected that the user has a + * monospace font with inconsistent normal/bold/italic height. See + * notebookmain.js. Such fonts will have keywords vertically offset with + * respect to the rest of the text. The user should select a better font. + * See: https://github.com/ipython/ipython/issues/1503 + * + * .CodeMirror span { + * vertical-align: bottom; + * } + */ + +.CodeMirror { + line-height: @baseLineHeight; /* 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 */ +} + +.CodeMirror-scroll { + /* The CodeMirror docs are a bit fuzzy on if overflow-y should be hidden or visible.*/ + /* We have found that if it is visible, vertical scrollbars appear with font size changes.*/ + overflow-y: hidden; + overflow-x: auto; /* Changed from auto to remove scrollbar */ +} + +.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; +} + +.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) +} diff --git a/IPython/frontend/html/notebook/static/notebook/less/completer.less b/IPython/frontend/html/notebook/static/notebook/less/completer.less new file mode 100644 index 000000000..7073ec830 --- /dev/null +++ b/IPython/frontend/html/notebook/static/notebook/less/completer.less @@ -0,0 +1,24 @@ +.completions { + position: absolute; + z-index: 10; + overflow: hidden; + border: 1px solid @border_color; + .corner-all; + .box-shadow(0px 6px 10px -1px #adadad); +} + +.completions select { + background: white; + outline: none; + border: none; + padding: 0px; + margin: 0px; + overflow: auto; + font-family: @monoFontFamily; + font-size: 110%; + color: @textColor; +} + +.completions select option.context { + color: @blueDark; +} diff --git a/IPython/frontend/html/notebook/static/notebook/less/menubar.less b/IPython/frontend/html/notebook/static/notebook/less/menubar.less new file mode 100644 index 000000000..954f3eac1 --- /dev/null +++ b/IPython/frontend/html/notebook/static/notebook/less/menubar.less @@ -0,0 +1,25 @@ +.ui-menubar-item .ui-button .ui-button-text { + padding: 0.4em 1.0em; + font-size: 100%; +} + +.ui-menu { + .box-shadow(0px 6px 10px -1px #adadad); +} + +.ui-menu .ui-menu-item a { + border: 1px solid transparent; + padding: 2px 1.6em; +} + +.ui-menu .ui-menu-item a.ui-state-focus { + margin: 0; +} + +.ui-menu hr { + margin: 0.3em 0; +} + +#menubar_container { + position: relative; +} diff --git a/IPython/frontend/html/notebook/static/notebook/less/notebook.less b/IPython/frontend/html/notebook/static/notebook/less/notebook.less index 2736be00f..de00d216c 100644 --- a/IPython/frontend/html/notebook/static/notebook/less/notebook.less +++ b/IPython/frontend/html/notebook/static/notebook/less/notebook.less @@ -1,11 +1,3 @@ -/** - * Primary styles - * - * Author: IPython Development Team - */ - -@import "variables.less"; -@import "highlight.less"; body { background-color: @bodyBackground; @@ -15,26 +7,6 @@ body.notebook_app { overflow: hidden; } -blockquote { - border-left: 4px solid #DDD; - padding: 0 15px; - color: #777; -} - -span#save_widget { - padding: 5px; - margin: 0px 0px 0px 300px; - display:inline-block; -} - -span#checkpoint_status span#autosave_status { - font-size: small; -} - -/*span#save_widget > span#autosave_status { - font-size: x-small; -} -*/ span#notebook_name { height: 1em; line-height: 1em; @@ -43,98 +15,6 @@ span#notebook_name { font-size: 146.5%; } - -.ui-menubar-item .ui-button .ui-button-text { - padding: 0.4em 1.0em; - font-size: 100%; -} - -.ui-menu { - .box-shadow(0px 6px 10px -1px #adadad); -} - -.ui-menu .ui-menu-item a { - border: 1px solid transparent; - padding: 2px 1.6em; -} - -.ui-menu .ui-menu-item a.ui-state-focus { - margin: 0; -} - -.ui-menu hr { - margin: 0.3em 0; -} - -#menubar_container { - position: relative; -} - -#notification_area { - position: absolute; - right: 0px; - top: 0px; - height: 25px; - padding: 3px 0px; - padding-right: 3px; - z-index: 10; -} - -.notification_widget{ - float : right; - right: 0px; - top: 1px; - height: 25px; - padding: 3px 6px; - z-index: 10; -} - -.toolbar { - padding: 3px 15px; - border-bottom: @border_width @border_color solid; - - button { - margin-top:2px; - margin-bottom:2px; - } - - - select, label { - height : 19px; - vertical-align:middle; - margin-right:2px; - margin-bottom:0; - display: inline; - font-size: 92%; - margin-left:0.3em; - margin-right:0.3em; - padding: 0px; - } -} - -.toolbar select{ - width:auto; -} - -span#quick_help_area { - position: static; - padding: 5px 0px; - margin: 0px 0px 0px 0px; -} - -.help_string { - float: right; - width: 170px; - padding: 0px 5px; - text-align: left; - font-size: 85%; -} - -.help_string_label { - float: right; - font-size: 85%; -} - div#notebook_panel { margin: 0px 0px 0px 0px; padding: 0px; @@ -149,296 +29,11 @@ div#notebook { margin: 0px; } -div#pager_splitter { - height: 8px; -} - -#pager_container { - position : relative; -} - -div#pager { - padding: 15px; - overflow: auto; - display: none; - - pre { - font-size: @baseFontSize; - line-height: @baseLineHeight; - color: @textColor; - background-color: @cell_background; - padding: 0.4em; - } -} - div.ui-widget-content { border: 1px solid @border_color; outline: none; } -.cell { - border: 1px solid transparent; - .vbox(); - - &.selected { - .corner-all; - border : thin @border_color solid; - } -} - -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 0px; - outline: none; -} - -div.code_cell { -} - -/* any special styling for code cells that are currently running goes here */ -div.code_cell.running { -} - -div.prompt { - /* This needs to be wide enough for 3 digit prompt numbers: In[100]: */ - width: 11ex; - /* This 0.4em is tuned to match the padding on the CodeMirror editor. */ - padding: 0.4em; - margin: 0px; - font-family: @monoFontFamily; - text-align: right; - /* This has to match that of the the CodeMirror class line-height below */ - line-height: @baseLineHeight; -} - -div.input { - page-break-inside: avoid; - .hbox(); -} - -/* input_area and input_prompt must match in top border and margin for alignment */ -div.input_area { - border: 1px solid @light_border_color; - .corner-all; - background: @cell_background; -} - -div.input_prompt { - color: navy; - border-top: 1px solid transparent; -} - -div.output_wrapper { - /* This is a spacer between the input and output of each cell */ - margin-top: 5px; - margin-left: 5px; - /* FF needs explicit width to stretch */ - width: 100%; - /* this position must be relative to enable descendents to be absolute within it */ - position: relative; -} - -/* 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-right: 5px; -} - -div.out_prompt_overlay { - height: 100%; - padding: 0px; - 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; - /* 5px right shift to account for margin in parent container */ - margin: 0 5px 0 -5px; -} - -/* This class is the outer container of all output sections. */ -div.output_area { - padding: 0px; - page-break-inside: avoid; - .hbox(); -} - - -/* This is needed to protect the pre formating from global settings such - as that of bootstrap */ -div.output_area pre { - font-family: @monoFontFamily; - margin: 0; - padding: 0; - border: 0; - font-size: 100%; - vertical-align: baseline; - color: black; - background-color: white; - .border-radius(0); - line-height: inherit; -} - -/* 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; - .box-flex1(); -} - -/* The rest of the output_* classes are for special styling of the different - output types */ - -/* all text output has this class: */ -div.output_text { - text-align: left; - color: @textColor; - font-family: @monoFontFamily; - /* This has to match that of the the CodeMirror class line-height below */ - line-height: @baseLineHeight; -} - -/* 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 */ -} - -div.output_latex { - text-align: left; -} - -div.output_html { -} - -div.output_png { -} - -div.output_jpeg { -} - -div.text_cell { - padding: 5px 5px 5px 5px; -} - -div.text_cell_input { - color: @textColor; - border: 1px solid @light_border_color; - .corner-all; - background: @cell_background; -} - -div.text_cell_render { - /*font-family: "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;*/ - outline: none; - resize: none; - width: inherit; - border-style: none; - padding: 5px; - color: @textColor; -} - -/* The following gets added to the if it is detected that the user has a - * monospace font with inconsistent normal/bold/italic height. See - * notebookmain.js. Such fonts will have keywords vertically offset with - * respect to the rest of the text. The user should select a better font. - * See: https://github.com/ipython/ipython/issues/1503 - * - * .CodeMirror span { - * vertical-align: bottom; - * } - */ - -.CodeMirror { - line-height: @baseLineHeight; /* 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 */ -} - -.CodeMirror-scroll { - /* The CodeMirror docs are a bit fuzzy on if overflow-y should be hidden or visible.*/ - /* We have found that if it is visible, vertical scrollbars appear with font size changes.*/ - overflow-y: hidden; - overflow-x: auto; /* Changed from auto to remove scrollbar */ -} - -.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; -} - -.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) -} - -/* CSS font colors for translated ANSI colors. */ - - -.ansiblack {color: @textColor;} -.ansired {color: darkred;} -.ansigreen {color: darkgreen;} -.ansiyellow {color: brown;} -.ansiblue {color: darkblue;} -.ansipurple {color: darkviolet;} -.ansicyan {color: steelblue;} -.ansigrey {color: grey;} -.ansibold {font-weight: bold;} - -.completions { - position: absolute; - z-index: 10; - overflow: hidden; - border: 1px solid @border_color; - .corner-all; - .box-shadow(0px 6px 10px -1px #adadad); -} - -.completions select { - background: white; - outline: none; - border: none; - padding: 0px; - margin: 0px; - overflow: auto; - font-family: @monoFontFamily; - font-size: 110%; - color: @textColor; -} - -.completions select option.context { - color: @blueDark; -} - pre.dialog { background-color: @cell_background; border: 1px solid #ddd; @@ -451,16 +46,6 @@ p.dialog { padding : 0.2em; } -.shortcut_key { - display: inline-block; - width: 15ex; - text-align: right; - font-family: @monoFontFamily; -} - -.shortcut_descr { -} - /* Word-wrap output correctly. This is the CSS3 spelling, though Firefox seems to not honor it correctly. Webkit browsers (Chrome, rekonq, Safari) do. */ @@ -470,18 +55,12 @@ pre, code, kbd, samp { white-space: pre-wrap; } font-family: @monoFontFamily; } -.js-error { - color: darkred; -} - a { - text-decoration: underline; + text-decoration: underline; } p { - -margin-bottom:0; - + margin-bottom:0; } a.heading-anchor:link, a.heading-anchor:visited { @@ -489,30 +68,5 @@ a.heading-anchor:link, a.heading-anchor:visited { color: inherit; } -/* raw_input styles */ -div.raw_input { - padding-top: 0px; - padding-bottom: 0px; - height: 1em; - line-height: 1em; - font-family: @monoFontFamily; -} -span.input_prompt { - 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; -} - -p.p-space { - margin-bottom: 10px; -} diff --git a/IPython/frontend/html/notebook/static/notebook/less/notificationarea.less b/IPython/frontend/html/notebook/static/notebook/less/notificationarea.less new file mode 100644 index 000000000..577ac46a9 --- /dev/null +++ b/IPython/frontend/html/notebook/static/notebook/less/notificationarea.less @@ -0,0 +1,9 @@ +#notification_area { + position: absolute; + right: 0px; + top: 0px; + height: 25px; + padding: 3px 0px; + padding-right: 3px; + z-index: 10; +} diff --git a/IPython/frontend/html/notebook/static/notebook/less/notificationwidget.less b/IPython/frontend/html/notebook/static/notebook/less/notificationwidget.less new file mode 100644 index 000000000..aefd53ee6 --- /dev/null +++ b/IPython/frontend/html/notebook/static/notebook/less/notificationwidget.less @@ -0,0 +1,8 @@ +.notification_widget{ + float : right; + right: 0px; + top: 1px; + height: 25px; + padding: 3px 6px; + z-index: 10; +} diff --git a/IPython/frontend/html/notebook/static/notebook/less/outputarea.less b/IPython/frontend/html/notebook/static/notebook/less/outputarea.less new file mode 100644 index 000000000..59578b002 --- /dev/null +++ b/IPython/frontend/html/notebook/static/notebook/less/outputarea.less @@ -0,0 +1,96 @@ +/* This class is the outer container of all output sections. */ +div.output_area { + padding: 0px; + page-break-inside: avoid; + .hbox(); +} + + +/* This is needed to protect the pre formating from global settings such + as that of bootstrap */ +div.output_area pre { + font-family: @monoFontFamily; + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + vertical-align: baseline; + color: black; + background-color: white; + .border-radius(0); + line-height: inherit; +} + +/* 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; + .box-flex1(); +} + +/* The rest of the output_* classes are for special styling of the different + output types */ + +/* all text output has this class: */ +div.output_text { + text-align: left; + color: @textColor; + font-family: @monoFontFamily; + /* This has to match that of the the CodeMirror class line-height below */ + line-height: @baseLineHeight; +} + +/* 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 */ +} + +div.output_latex { + text-align: left; +} + +div.output_html { +} + +div.output_png { +} + +div.output_jpeg { +} + +.js-error { + color: darkred; +} + +/* raw_input styles */ + +div.raw_input { + padding-top: 0px; + padding-bottom: 0px; + height: 1em; + line-height: 1em; + font-family: @monoFontFamily; +} +span.input_prompt { + 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; +} + +p.p-space { + margin-bottom: 10px; +} \ No newline at end of file diff --git a/IPython/frontend/html/notebook/static/notebook/less/pager.less b/IPython/frontend/html/notebook/static/notebook/less/pager.less new file mode 100644 index 000000000..03c6a6084 --- /dev/null +++ b/IPython/frontend/html/notebook/static/notebook/less/pager.less @@ -0,0 +1,21 @@ +div#pager_splitter { + height: 8px; +} + +#pager_container { + position : relative; +} + +div#pager { + padding: 15px; + overflow: auto; + display: none; + + pre { + font-size: @baseFontSize; + line-height: @baseLineHeight; + color: @textColor; + background-color: @cell_background; + padding: 0.4em; + } +} diff --git a/IPython/frontend/html/notebook/static/notebook/less/quickhelp.less b/IPython/frontend/html/notebook/static/notebook/less/quickhelp.less new file mode 100644 index 000000000..603c92a85 --- /dev/null +++ b/IPython/frontend/html/notebook/static/notebook/less/quickhelp.less @@ -0,0 +1,9 @@ +.shortcut_key { + display: inline-block; + width: 15ex; + text-align: right; + font-family: @monoFontFamily; +} + +.shortcut_descr { +} diff --git a/IPython/frontend/html/notebook/static/notebook/less/savewidget.less b/IPython/frontend/html/notebook/static/notebook/less/savewidget.less new file mode 100644 index 000000000..8056e0f4a --- /dev/null +++ b/IPython/frontend/html/notebook/static/notebook/less/savewidget.less @@ -0,0 +1,9 @@ +span#save_widget { + padding: 5px; + margin: 0px 0px 0px 300px; + display:inline-block; +} + +span#checkpoint_status span#autosave_status { + font-size: small; +} diff --git a/IPython/frontend/html/notebook/static/notebook/less/style.less b/IPython/frontend/html/notebook/static/notebook/less/style.less index 3fc0ef0de..df586255c 100644 --- a/IPython/frontend/html/notebook/static/notebook/less/style.less +++ b/IPython/frontend/html/notebook/static/notebook/less/style.less @@ -1,5 +1,20 @@ -@import "notebook.less"; -@import "renderedhtml.less"; -@import "tooltip.less"; +@import "variables.less"; +@import "ansicolors.less"; +@import "cell.less"; @import "celltoolbar.less"; +@import "codecell.less"; +@import "codemirror.less"; +@import "completer.less"; @import "highlight.less"; +@import "menubar.less"; +@import "notebook.less"; +@import "notificationarea.less"; +@import "notificationwidget.less"; +@import "outputarea.less"; +@import "pager.less"; +@import "quickhelp.less"; +@import "renderedhtml.less"; +@import "savewidget.less"; +@import "textcell.less"; +@import "toolbar.less"; +@import "tooltip.less"; diff --git a/IPython/frontend/html/notebook/static/notebook/less/textcell.less b/IPython/frontend/html/notebook/static/notebook/less/textcell.less new file mode 100644 index 000000000..9d32b49de --- /dev/null +++ b/IPython/frontend/html/notebook/static/notebook/less/textcell.less @@ -0,0 +1,21 @@ +div.text_cell { + padding: 5px 5px 5px 5px; +} + +div.text_cell_input { + color: @textColor; + border: 1px solid @light_border_color; + .corner-all; + background: @cell_background; +} + +div.text_cell_render { + /*font-family: "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;*/ + outline: none; + resize: none; + width: inherit; + border-style: none; + padding: 5px; + color: @textColor; +} + diff --git a/IPython/frontend/html/notebook/static/notebook/less/toolbar.less b/IPython/frontend/html/notebook/static/notebook/less/toolbar.less new file mode 100644 index 000000000..bd155336d --- /dev/null +++ b/IPython/frontend/html/notebook/static/notebook/less/toolbar.less @@ -0,0 +1,26 @@ +.toolbar { + padding: 3px 15px; + border-bottom: @border_width @border_color solid; + + button { + margin-top:2px; + margin-bottom:2px; + } + + + select, label { + height : 19px; + vertical-align:middle; + margin-right:2px; + margin-bottom:0; + display: inline; + font-size: 92%; + margin-left:0.3em; + margin-right:0.3em; + padding: 0px; + } +} + +.toolbar select{ + width:auto; +} diff --git a/IPython/frontend/html/notebook/static/style/style.min.css b/IPython/frontend/html/notebook/static/style/style.min.css index b0051fa6e..2c8bc455e 100644 --- a/IPython/frontend/html/notebook/static/style/style.min.css +++ b/IPython/frontend/html/notebook/static/style/style.min.css @@ -901,6 +901,51 @@ span#login_widget{float:right;} .ui-tabs .ui-tabs-nav li a{padding:.3em .5em;} #project_name>.breadcrumb{padding:0;background-color:transparent;} input.engine_num_input{height:20px;margin-bottom:2px;padding-top:0;padding-bottom:0;width:90px;} +.ansiblack{color:black;} +.ansired{color:darkred;} +.ansigreen{color:darkgreen;} +.ansiyellow{color:brown;} +.ansiblue{color:darkblue;} +.ansipurple{color:darkviolet;} +.ansicyan{color:steelblue;} +.ansigrey{color:grey;} +.ansibold{font-weight:bold;} +.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%;}.cell.selected{border-radius:4px;border:thin #ababab solid;} +div.cell{width:100%;padding:5px 5px 5px 0px;margin:2px 0px 2px 0px;outline:none;} +div.prompt{width:11ex;padding:0.4em;margin:0px;font-family:monospace;text-align:right;line-height:1.231;} +.celltoolbar{border:thin solid #CFCFCF;border-bottom:none;background:#EEE;border-top-right-radius:3px;border-top-left-radius:3px;width:100%;-webkit-box-pack:end;height:20px;} +.no_input_radius{border-top-right-radius:0px;border-top-left-radius:0px;} +.text_cell .ctb_prompt{display:none;} +.code_cell .ctb_prompt{display:block;} +.ctb_hideshow{display:none;vertical-align:bottom;padding-right:2px;} +.celltoolbar>div{padding-top:0px;} +.ctb_area{margin:0;padding:0;width:100%;} +.ctb_show.ctb_hideshow,.ctb_show .ctb_hideshow{display:block;} +.ctb_show .input_area,.ctb_show .ctb_hideshow+div.text_cell_input{border-top-right-radius:0px;border-top-left-radius:0px;} +.ctb_show>.celltoolbar{border-bottom-right-radius:0px;border-bottom-left-radius:0px;} +.button_container{margin-top:0;margin-bottom:0;} +.ui-button{min-width:30px;} +.celltoolbar .button_container select{margin:10px;margin-top:1px;margin-bottom:0px;padding:0;font-size:87%;width:auto;display:inline-block;height:18px;line-height:18px;vertical-align:top;} +.celltoolbar label{display:inline-block;height:15px;line-height:15px;vertical-align:top;} +.celltoolbar label span{font-size:85%;} +.celltoolbar input[type=checkbox]{margin:0px;margin-left:4px;margin-right:4px;} +.celltoolbar .ui-button{border:none;vertical-align:top;height:20px;} +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;margin-left:5px;width:100%;position:relative;} +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-right:5px;} +div.out_prompt_overlay{height:100%;padding:0px;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;margin:0 5px 0 -5px;} +.CodeMirror{line-height:1.231;height:auto;background:none;} +.CodeMirror-scroll{overflow-y:hidden;overflow-x:auto;} +.CodeMirror-lines{padding:0.4em;} +.CodeMirror pre{padding:0;border:0;-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;} +.completions{position:absolute;z-index:10;overflow:hidden;border:1px solid #ababab;border-radius:4px;-webkit-box-shadow:0px 6px 10px -1px #adadad;-moz-box-shadow:0px 6px 10px -1px #adadad;box-shadow:0px 6px 10px -1px #adadad;} +.completions select{background:white;outline:none;border:none;padding:0px;margin:0px;overflow:auto;font-family:monospace;font-size:110%;color:#000000;} +.completions select option.context{color:#0064cd;} pre code{display:block;padding:0.5em;} .highlight-base,pre code,pre .subst,pre .tag .title,pre .lisp .title,pre .clojure .built_in,pre .nginx .title{color:black;} .highlight-string,pre .string,pre .constant,pre .parent,pre .tag .value,pre .rules .value,pre .rules .value .number,pre .preprocessor,pre .ruby .symbol,pre .ruby .symbol .string,pre .aggregate,pre .template_tag,pre .django .variable,pre .smalltalk .class,pre .addition,pre .flow,pre .stream,pre .bash .variable,pre .apache .tag,pre .apache .cbracket,pre .tex .command,pre .tex .special,pre .erlang_repl .function_or_atom,pre .markdown .header{color:#BA2121;} @@ -921,44 +966,27 @@ pre .coffeescript .javascript,pre .javascript .xml,pre .tex .formula,pre .xml .j .cm-s-ipython span.cm-error{color:#f00;} .cm-s-ipython span.cm-operator{color:#AA22FF;font-weight:bold;} .cm-s-ipython span.cm-meta{color:#AA22FF;} -body{background-color:#ffffff;} -body.notebook_app{overflow:hidden;} -blockquote{border-left:4px solid #DDD;padding:0 15px;color:#777;} -span#save_widget{padding:5px;margin:0px 0px 0px 300px;display:inline-block;} -span#checkpoint_status span#autosave_status{font-size:small;} -span#notebook_name{height:1em;line-height:1em;padding:3px;border:none;font-size:146.5%;} .ui-menubar-item .ui-button .ui-button-text{padding:0.4em 1.0em;font-size:100%;} .ui-menu{-webkit-box-shadow:0px 6px 10px -1px #adadad;-moz-box-shadow:0px 6px 10px -1px #adadad;box-shadow:0px 6px 10px -1px #adadad;} .ui-menu .ui-menu-item a{border:1px solid transparent;padding:2px 1.6em;} .ui-menu .ui-menu-item a.ui-state-focus{margin:0;} .ui-menu hr{margin:0.3em 0;} #menubar_container{position:relative;} -#notification_area{position:absolute;right:0px;top:0px;height:25px;padding:3px 0px;padding-right:3px;z-index:10;} -.notification_widget{float:right;right:0px;top:1px;height:25px;padding:3px 6px;z-index:10;} -.toolbar{padding:3px 15px;border-bottom:1px #ababab solid;}.toolbar button{margin-top:2px;margin-bottom:2px;} -.toolbar select,.toolbar label{height:19px;vertical-align:middle;margin-right:2px;margin-bottom:0;display:inline;font-size:92%;margin-left:0.3em;margin-right:0.3em;padding:0px;} -.toolbar select{width:auto;} -span#quick_help_area{position:static;padding:5px 0px;margin:0px 0px 0px 0px;} -.help_string{float:right;width:170px;padding:0px 5px;text-align:left;font-size:85%;} -.help_string_label{float:right;font-size:85%;} +body{background-color:#ffffff;} +body.notebook_app{overflow:hidden;} +span#notebook_name{height:1em;line-height:1em;padding:3px;border:none;font-size:146.5%;} div#notebook_panel{margin:0px 0px 0px 0px;padding:0px;} div#notebook{overflow-y:scroll;overflow-x:auto;width:100%;padding:5px 5px 15px 5px;margin:0px;} -div#pager_splitter{height:8px;} -#pager_container{position:relative;} -div#pager{padding:15px;overflow:auto;display:none;}div#pager pre{font-size:13px;line-height:1.231;color:#000000;background-color:#f7f7f7;padding:0.4em;} div.ui-widget-content{border:1px solid #ababab;outline:none;} -.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%;}.cell.selected{border-radius:4px;border:thin #ababab solid;} -div.cell{width:100%;padding:5px 5px 5px 0px;margin:2px 0px 2px 0px;outline:none;} -div.prompt{width:11ex;padding:0.4em;margin:0px;font-family:monospace;text-align:right;line-height:1.231;} -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;margin-left:5px;width:100%;position:relative;} -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-right:5px;} -div.out_prompt_overlay{height:100%;padding:0px;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;margin:0 5px 0 -5px;} +pre.dialog{background-color:#f7f7f7;border:1px solid #ddd;border-radius:4px;padding:0.4em;padding-left:2em;} +p.dialog{padding:0.2em;} +pre,code,kbd,samp{white-space:pre-wrap;} +#fonttest{font-family:monospace;} +a{text-decoration:underline;} +p{margin-bottom:0;} +a.heading-anchor:link,a.heading-anchor:visited{text-decoration:none;color:inherit;} +#notification_area{position:absolute;right:0px;top:0px;height:25px;padding:3px 0px;padding-right:3px;z-index:10;} +.notification_widget{float:right;right:0px;top:1px;height:25px;padding:3px 6px;z-index:10;} 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 pre{font-family:monospace;margin:0;padding:0;border:0;font-size:100%;vertical-align:baseline;color:black;background-color:white;-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;-webkit-box-flex:1;-moz-box-flex:1;box-flex:1;} @@ -966,38 +994,15 @@ div.output_text{text-align:left;color:#000000;font-family:monospace;line-height: div.output_stream{padding-top:0.0em;padding-bottom:0.0em;} div.output_stderr{background:#fdd;} div.output_latex{text-align:left;} -div.text_cell{padding:5px 5px 5px 5px;} -div.text_cell_input{color:#000000;border:1px solid #cfcfcf;border-radius:4px;background:#f7f7f7;} -div.text_cell_render{outline:none;resize:none;width:inherit;border-style:none;padding:5px;color:#000000;} -.CodeMirror{line-height:1.231;height:auto;background:none;} -.CodeMirror-scroll{overflow-y:hidden;overflow-x:auto;} -.CodeMirror-lines{padding:0.4em;} -.CodeMirror pre{padding:0;border:0;-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;} -.ansiblack{color:#000000;} -.ansired{color:darkred;} -.ansigreen{color:darkgreen;} -.ansiyellow{color:brown;} -.ansiblue{color:darkblue;} -.ansipurple{color:darkviolet;} -.ansicyan{color:steelblue;} -.ansigrey{color:grey;} -.ansibold{font-weight:bold;} -.completions{position:absolute;z-index:10;overflow:hidden;border:1px solid #ababab;border-radius:4px;-webkit-box-shadow:0px 6px 10px -1px #adadad;-moz-box-shadow:0px 6px 10px -1px #adadad;box-shadow:0px 6px 10px -1px #adadad;} -.completions select{background:white;outline:none;border:none;padding:0px;margin:0px;overflow:auto;font-family:monospace;font-size:110%;color:#000000;} -.completions select option.context{color:#0064cd;} -pre.dialog{background-color:#f7f7f7;border:1px solid #ddd;border-radius:4px;padding:0.4em;padding-left:2em;} -p.dialog{padding:0.2em;} -.shortcut_key{display:inline-block;width:15ex;text-align:right;font-family:monospace;} -pre,code,kbd,samp{white-space:pre-wrap;} -#fonttest{font-family:monospace;} .js-error{color:darkred;} -a{text-decoration:underline;} -p{margin-bottom:0;} -a.heading-anchor:link,a.heading-anchor:visited{text-decoration:none;color:inherit;} div.raw_input{padding-top:0px;padding-bottom:0px;height:1em;line-height:1em;font-family:monospace;} span.input_prompt{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;} p.p-space{margin-bottom:10px;} +div#pager_splitter{height:8px;} +#pager_container{position:relative;} +div#pager{padding:15px;overflow:auto;display:none;}div#pager pre{font-size:13px;line-height:1.231;color:#000000;background-color:#f7f7f7;padding:0.4em;} +.shortcut_key{display:inline-block;width:15ex;text-align:right;font-family:monospace;} .rendered_html{color:black;}.rendered_html em{font-style:italic;} .rendered_html strong{font-weight:bold;} .rendered_html u{text-decoration:underline;} @@ -1025,6 +1030,14 @@ p.p-space{margin-bottom:10px;} .rendered_html th{font-weight:bold;} .rendered_html p{text-align:justify;} .rendered_html p+p{margin-top:1em;} +span#save_widget{padding:5px;margin:0px 0px 0px 300px;display:inline-block;} +span#checkpoint_status span#autosave_status{font-size:small;} +div.text_cell{padding:5px 5px 5px 5px;} +div.text_cell_input{color:#000000;border:1px solid #cfcfcf;border-radius:4px;background:#f7f7f7;} +div.text_cell_render{outline:none;resize:none;width:inherit;border-style:none;padding:5px;color:#000000;} +.toolbar{padding:3px 15px;border-bottom:1px #ababab solid;}.toolbar button{margin-top:2px;margin-bottom:2px;} +.toolbar select,.toolbar label{height:19px;vertical-align:middle;margin-right:2px;margin-bottom:0;display:inline;font-size:92%;margin-left:0.3em;margin-right:0.3em;padding:0px;} +.toolbar select{width:auto;} @-moz-keyframes fadeOut{from{opacity:1;} to{opacity:0;}}@-webkit-keyframes fadeOut{from{opacity:1;} to{opacity:0;}}@-moz-keyframes fadeIn{from{opacity:0;} to{opacity:1;}}@-webkit-keyframes fadeIn{from{opacity:0;} to{opacity:1;}}.bigtooltip{overflow:auto;height:200px;-webkit-transition-property:height;-webkit-transition-duration:500ms;-moz-transition-property:height;-moz-transition-duration:500ms;transition-property:height;transition-duration:500ms;} .smalltooltip{-webkit-transition-property:height;-webkit-transition-duration:500ms;-moz-transition-property:height;-moz-transition-duration:500ms;transition-property:height;transition-duration:500ms;text-overflow:ellipsis;overflow:hidden;height:80px;} .tooltipbuttons{position:absolute;padding-right:15px;top:0px;right:0px;} @@ -1033,40 +1046,3 @@ p.p-space{margin-bottom:10px;} .ipython_tooltip .tooltiptext pre{border:0;-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;font-size:100%;background-color:#f7f7f7;} .pretooltiparrow{left:0px;margin:0px;top:-16px;width:40px;height:16px;overflow:hidden;position:absolute;} .pretooltiparrow:before{background-color:#f7f7f7;border:1px #ababab solid;z-index:11;content:"";position:absolute;left:15px;top:10px;width:25px;height:25px;-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);} -.celltoolbar{border:thin solid #CFCFCF;border-bottom:none;background:#EEE;border-top-right-radius:3px;border-top-left-radius:3px;width:100%;-webkit-box-pack:end;height:20px;} -.no_input_radius{border-top-right-radius:0px;border-top-left-radius:0px;} -.text_cell .ctb_prompt{display:none;} -.code_cell .ctb_prompt{display:block;} -.ctb_hideshow{display:none;vertical-align:bottom;padding-right:2px;} -.celltoolbar>div{padding-top:0px;} -.ctb_area{margin:0;padding:0;width:100%;} -.ctb_show.ctb_hideshow,.ctb_show .ctb_hideshow{display:block;} -.ctb_show .input_area,.ctb_show .ctb_hideshow+div.text_cell_input{border-top-right-radius:0px;border-top-left-radius:0px;} -.ctb_show>.celltoolbar{border-bottom-right-radius:0px;border-bottom-left-radius:0px;} -.button_container{margin-top:0;margin-bottom:0;} -.ui-button{min-width:30px;} -.celltoolbar .button_container select{margin:10px;margin-top:1px;margin-bottom:0px;padding:0;font-size:87%;width:auto;display:inline-block;height:18px;line-height:18px;vertical-align:top;} -.celltoolbar label{display:inline-block;height:15px;line-height:15px;vertical-align:top;} -.celltoolbar label span{font-size:85%;} -.celltoolbar input[type=checkbox]{margin:0px;margin-left:4px;margin-right:4px;} -.celltoolbar .ui-button{border:none;vertical-align:top;height:20px;} -pre code{display:block;padding:0.5em;} -.highlight-base,pre code,pre .subst,pre .tag .title,pre .lisp .title,pre .clojure .built_in,pre .nginx .title{color:black;} -.highlight-string,pre .string,pre .constant,pre .parent,pre .tag .value,pre .rules .value,pre .rules .value .number,pre .preprocessor,pre .ruby .symbol,pre .ruby .symbol .string,pre .aggregate,pre .template_tag,pre .django .variable,pre .smalltalk .class,pre .addition,pre .flow,pre .stream,pre .bash .variable,pre .apache .tag,pre .apache .cbracket,pre .tex .command,pre .tex .special,pre .erlang_repl .function_or_atom,pre .markdown .header{color:#BA2121;} -.highlight-comment,pre .comment,pre .annotation,pre .template_comment,pre .diff .header,pre .chunk,pre .markdown .blockquote{color:#408080;font-style:italic;} -.highlight-number,pre .number,pre .date,pre .regexp,pre .literal,pre .smalltalk .symbol,pre .smalltalk .char,pre .go .constant,pre .change,pre .markdown .bullet,pre .markdown .link_url{color:#080;} -pre .label,pre .javadoc,pre .ruby .string,pre .decorator,pre .filter .argument,pre .localvars,pre .array,pre .attr_selector,pre .important,pre .pseudo,pre .pi,pre .doctype,pre .deletion,pre .envvar,pre .shebang,pre .apache .sqbracket,pre .nginx .built_in,pre .tex .formula,pre .erlang_repl .reserved,pre .prompt,pre .markdown .link_label,pre .vhdl .attribute,pre .clojure .attribute,pre .coffeescript .property{color:#8888ff;} -.highlight-keyword,pre .keyword,pre .id,pre .phpdoc,pre .aggregate,pre .css .tag,pre .javadoctag,pre .phpdoc,pre .yardoctag,pre .smalltalk .class,pre .winutils,pre .bash .variable,pre .apache .tag,pre .go .typename,pre .tex .command,pre .markdown .strong,pre .request,pre .status{color:#008000;font-weight:bold;} -.highlight-builtin,pre .built_in{color:#008000;} -pre .markdown .emphasis{font-style:italic;} -pre .nginx .built_in{font-weight:normal;} -pre .coffeescript .javascript,pre .javascript .xml,pre .tex .formula,pre .xml .javascript,pre .xml .vbscript,pre .xml .css,pre .xml .cdata{opacity:0.5;} -.cm-s-ipython span.cm-variable{color:black;} -.cm-s-ipython span.cm-keyword{color:#008000;font-weight:bold;} -.cm-s-ipython span.cm-number{color:#080;} -.cm-s-ipython span.cm-comment{color:#408080;font-style:italic;} -.cm-s-ipython span.cm-string{color:#BA2121;} -.cm-s-ipython span.cm-builtin{color:#008000;} -.cm-s-ipython span.cm-error{color:#f00;} -.cm-s-ipython span.cm-operator{color:#AA22FF;font-weight:bold;} -.cm-s-ipython span.cm-meta{color:#AA22FF;}