diff --git a/IPython/frontend/html/notebook/static/css/celltoolbar.css b/IPython/frontend/html/notebook/static/css/celltoolbar.css index d9650ae..549e547 100644 --- a/IPython/frontend/html/notebook/static/css/celltoolbar.css +++ b/IPython/frontend/html/notebook/static/css/celltoolbar.css @@ -1,38 +1,30 @@ -/*Css for the metadata edit area*/ +/* Css for the metadata edit area */ -.celltoolbar{ - border:thin solid #DDD; - margin-left:81px; - border-bottom:none; + +.celltoolbar { + border: thin solid #DDD; + margin-left: 0px; + border-bottom: none; background : #EEE; border-top-right-radius: 3px; border-top-left-radius: 3px; - display:none; -} - -.code_cell .celltoolbar{ - margin-left:81px; -} - -.text_cell .celltoolbar{ - margin-left:0px; } -.celltoolbar-on div.input_area , .celltoolbar-on div.text_cell_input{ +.no_input_radius { border-top-right-radius: 0px; border-top-left-radius: 0px; } -.celltoolbar-on .celltoolbar { - display:block; +.text_cell .ctb_prompt { + display: none; } -.celltoolbar ui-button { - border :none; +.code_cell .ctb_prompt { + display: block; } .button_container { - float:right; + float: right; } .button_container .ui-state-default, .button_container .ui-state-hover, .button_container .ui-state-hover span{ @@ -40,14 +32,22 @@ border : none; } -.celltoolbar select { - margin:10px; - margin-top:0px; - margin-bottom:0px; +.celltoolbar .button_container select { + margin: 10px; + margin-top: 0px; + margin-bottom: 0px; + font-size: 77%; +} + +.celltoolbar label span { + font-size: 77%; } .celltoolbar input[type=checkbox] { - margin-bottom:1px; + margin-bottom: 1px; +} +.celltoolbar ui-button { + border: none; } diff --git a/IPython/frontend/html/notebook/static/js/cell.js b/IPython/frontend/html/notebook/static/js/cell.js index f1ea132..6f87ff7 100644 --- a/IPython/frontend/html/notebook/static/js/cell.js +++ b/IPython/frontend/html/notebook/static/js/cell.js @@ -51,7 +51,6 @@ var IPython = (function (IPython) { * @method create_element */ Cell.prototype.create_element = function () { - this.celltoolbar = new IPython.CellToolbar(this); }; diff --git a/IPython/frontend/html/notebook/static/js/celltoolbar.js b/IPython/frontend/html/notebook/static/js/celltoolbar.js index 3e74131..1ebb6a6 100644 --- a/IPython/frontend/html/notebook/static/js/celltoolbar.js +++ b/IPython/frontend/html/notebook/static/js/celltoolbar.js @@ -19,7 +19,6 @@ var IPython = (function (IPython) { "use strict"; - /** * @constructor * @class CellToolbar @@ -27,30 +26,54 @@ var IPython = (function (IPython) { */ var CellToolbar = function (cell) { CellToolbar._instances.push(this); - this.inner_element = $('
'); this.cell = cell; - this.element = $('').addClass('celltoolbar') - .append(this.inner_element) + this.create_element(); this.rebuild(); return this; }; + + CellToolbar.prototype.create_element = function () { + this.inner_element = $(''); + var ctb_element = $('').addClass('celltoolbar') + .append(this.inner_element); + this.element = $('').addClass('ctb_wrapper hbox'); + ctb_element.addClass('box-flex1'); + var ctb_prompt = $('').addClass('ctb_prompt prompt'); + this.element.append(ctb_prompt).append(ctb_element); + }; + + CellToolbar.dropdown_preset_element = $('') .addClass('ui-widget ui-widget-content') .attr('id', 'celltoolbar_selector') .append($('').attr('value', '').text('None')) - CellToolbar.dropdown_preset_element.change(function(){ + + CellToolbar.dropdown_preset_element.change(function() { var val = CellToolbar.dropdown_preset_element.val() if(val ==''){ - $('body').removeClass('celltoolbar-on') + CellToolbar.hide(); } else { - $('body').addClass('celltoolbar-on') - CellToolbar.activate_preset(val) + CellToolbar.show(); + CellToolbar.activate_preset(val); } }) + CellToolbar.hide = function () { + $('.ctb_wrapper').hide(); + $('.input_area').addClass('no_input_radius'); + $('.text_cell_input').addClass('no_input_radius'); + } + + + CellToolbar.show = function () { + $('.ctb_wrapper').show(); + $('.input_area').removeClass('no_input_radius'); + $('.text_cell_input').removeClass('no_input_radius'); + } + /** * Class variable that should contain a dict of all availlable callback @@ -274,7 +297,7 @@ var IPython = (function (IPython) { var button_container = $(div) var chkb = $('').attr('type', 'checkbox'); - var lbl = $('').append($('').text(name).css('font-size', '77%')); + var lbl = $('').append($('').text(name)); lbl.append(chkb); chkb.attr("checked", getter(cell)); @@ -334,8 +357,8 @@ var IPython = (function (IPython) { label= label? label: ""; return function(div, cell) { var button_container = $(div) - var lbl = $("").append($('').text(label).css('font-size', '77%')); - var select = $(''); + var lbl = $("").append($('').text(label)); + var select = $('').addClass('ui-widget ui-widget-content'); for(var itemn in list_list){ var opt = $(''); opt.attr('value', list_list[itemn][1]) diff --git a/IPython/frontend/html/notebook/static/js/codecell.js b/IPython/frontend/html/notebook/static/js/codecell.js index 2fd80ce..cadc3c0 100644 --- a/IPython/frontend/html/notebook/static/js/codecell.js +++ b/IPython/frontend/html/notebook/static/js/codecell.js @@ -61,8 +61,11 @@ var IPython = (function (IPython) { IPython.Cell.prototype.create_element.apply(this, arguments); var cell = $('').addClass('cell border-box-sizing code_cell vbox'); - cell.append(this.celltoolbar.element); cell.attr('tabindex','2'); + + this.celltoolbar = new IPython.CellToolbar(this); + cell.append(this.celltoolbar.element); + var input = $('').addClass('input hbox'); input.append($('').addClass('prompt input_prompt')); var input_area = $('').addClass('input_area box-flex1'); diff --git a/IPython/frontend/html/notebook/static/js/textcell.js b/IPython/frontend/html/notebook/static/js/textcell.js index 8650068..e869b81 100644 --- a/IPython/frontend/html/notebook/static/js/textcell.js +++ b/IPython/frontend/html/notebook/static/js/textcell.js @@ -44,8 +44,9 @@ var IPython = (function (IPython) { TextCell.prototype.create_element = function () { IPython.Cell.prototype.create_element.apply(this, arguments); var cell = $("