diff --git a/IPython/frontend/html/notebook/static/notebook/js/maintoolbar.js b/IPython/frontend/html/notebook/static/notebook/js/maintoolbar.js index e0e4d9dc8..0798b4737 100644 --- a/IPython/frontend/html/notebook/static/notebook/js/maintoolbar.js +++ b/IPython/frontend/html/notebook/static/notebook/js/maintoolbar.js @@ -26,7 +26,7 @@ var IPython = (function (IPython) { { id : 'save_b', label : 'Save and Checkpoint', - icon : 'ui-icon-disk', + icon : 'icon-hdd', callback : function () { IPython.notebook.save_checkpoint(); } @@ -36,7 +36,7 @@ var IPython = (function (IPython) { { id : 'cut_b', label : 'Cut Cell', - icon : 'ui-icon-scissors', + icon : 'icon-cut', callback : function () { IPython.notebook.cut_cell(); } @@ -44,7 +44,7 @@ var IPython = (function (IPython) { { id : 'copy_b', label : 'Copy Cell', - icon : 'ui-icon-copy', + icon : 'icon-copy', callback : function () { IPython.notebook.copy_cell(); } @@ -52,7 +52,7 @@ var IPython = (function (IPython) { { id : 'paste_b', label : 'Paste Cell Below', - icon : 'ui-icon-clipboard', + icon : 'icon-paste', callback : function () { IPython.notebook.paste_cell_below(); } @@ -63,7 +63,7 @@ var IPython = (function (IPython) { { id : 'move_up_b', label : 'Move Cell Up', - icon : 'ui-icon-arrowthick-1-n', + icon : 'icon-arrow-up', callback : function () { IPython.notebook.move_cell_up(); } @@ -71,7 +71,7 @@ var IPython = (function (IPython) { { id : 'move_down_b', label : 'Move Cell Down', - icon : 'ui-icon-arrowthick-1-s', + icon : 'icon-arrow-up', callback : function () { IPython.notebook.move_cell_down(); } @@ -82,7 +82,7 @@ var IPython = (function (IPython) { { id : 'insert_above_b', label : 'Insert Cell Above', - icon : 'ui-icon-arrowthickstop-1-n', + icon : 'icon-circle-arrow-up', callback : function () { IPython.notebook.insert_cell_above('code'); } @@ -90,7 +90,7 @@ var IPython = (function (IPython) { { id : 'insert_below_b', label : 'Insert Cell Below', - icon : 'ui-icon-arrowthickstop-1-s', + icon : 'icon-circle-arrow-down', callback : function () { IPython.notebook.insert_cell_below('code'); } @@ -101,7 +101,7 @@ var IPython = (function (IPython) { { id : 'run_b', label : 'Run Cell', - icon : 'ui-icon-play', + icon : 'icon-play', callback : function () { IPython.notebook.execute_selected_cell(); } @@ -109,7 +109,7 @@ var IPython = (function (IPython) { { id : 'interrupt_b', label : 'Interrupt', - icon : 'ui-icon-stop', + icon : 'icon-stop', callback : function () { IPython.notebook.kernel.interrupt(); } @@ -121,7 +121,7 @@ var IPython = (function (IPython) { this.element .append($('') .attr('id','cell_type') - .addClass('ui-widget-content') + // .addClass('ui-widget-content') .append($('').attr('value','code').text('Code')) .append($('').attr('value','markdown').text('Markdown')) .append($('').attr('value','raw').text('Raw Text')) @@ -136,9 +136,9 @@ var IPython = (function (IPython) { MainToolBar.prototype.add_celltoolbar_list = function () { - var label = $('').text('Cell Toolbar:'); + var label = $('').addClass("navbar-text").text('Cell Toolbar:'); var select = $('') - .addClass('ui-widget-content') + // .addClass('ui-widget-content') .attr('id', 'ctb_select') .append($('').attr('value', '').text('None')); this.element.append(label).append(select); diff --git a/IPython/frontend/html/notebook/static/notebook/js/toolbar.js b/IPython/frontend/html/notebook/static/notebook/js/toolbar.js index 428ffa019..04359c4c1 100644 --- a/IPython/frontend/html/notebook/static/notebook/js/toolbar.js +++ b/IPython/frontend/html/notebook/static/notebook/js/toolbar.js @@ -39,13 +39,13 @@ var IPython = (function (IPython) { * IPython.toolbar.add_buttons_group([ * { * label:'my button', - * icon:'ui-icon-disk', + * icon:'icon-hdd', * callback:function(){alert('hoho')}, * id : 'my_button_id', // this is optional * }, * { * label:'my second button', - * icon:'ui-icon-scissors', + * icon:'icon-play', * callback:function(){alert('be carefull I cut')} * } * ], @@ -56,40 +56,37 @@ var IPython = (function (IPython) { * @param list {List} * List of button of the group, with the following paramter for each : * @param list.label {string} text to show on button hover - * @param list.icon {string} icon to choose from [jQuery ThemeRoller](http://jqueryui.com/themeroller/) + * @param list.icon {string} icon to choose from [Font Awesome](http://fortawesome.github.io/Font-Awesome) * @param list.callback {function} function to be called on button click * @param [list.id] {String} id to give to the button * @param [group_id] {String} optionnal id to give to the group * */ ToolBar.prototype.add_buttons_group = function (list, group_id) { - var span_group = $(''); + var btn_group = $('
').addClass("btn-group"); if( group_id != undefined ) { - span_group.attr('id',group_id); + btn_group.attr('id',group_id); } for(var el in list) { - var button = $('').button({ - icons : {primary : list[el].icon}, - text : false, - label : list[el].label - }); + var button = $('') + .addClass('btn') + .attr("title", list[el].label) + .append( + $("").addClass(list[el].icon) + ); var id = list[el].id; if( id != undefined ) button.attr('id',id); var fun = list[el].callback; button.click(fun); - span_group.append(button); + btn_group.append(button); } - span_group.buttonset(); - $(this.selector).append(span_group); + $(this.selector).append(btn_group); }; ToolBar.prototype.style = function () { - this.element.addClass('border-box-sizing'). - addClass('toolbar'). - css('border-top-style','none'). - css('border-left-style','none'). - css('border-right-style','none'); + this.element.addClass('border-box-sizing') + .addClass('toolbar'); }; /** diff --git a/IPython/frontend/html/notebook/static/notebook/less/toolbar.less b/IPython/frontend/html/notebook/static/notebook/less/toolbar.less index bd155336d..816d3bd20 100644 --- a/IPython/frontend/html/notebook/static/notebook/less/toolbar.less +++ b/IPython/frontend/html/notebook/static/notebook/less/toolbar.less @@ -1,15 +1,10 @@ .toolbar { - padding: 3px 15px; + padding: 0px 15px; border-bottom: @border_width @border_color solid; - button { - margin-top:2px; - margin-bottom:2px; - } - - select, label { - height : 19px; + width: auto; + height: @baseLineHeight + 6px; vertical-align:middle; margin-right:2px; margin-bottom:0; @@ -19,8 +14,7 @@ margin-right:0.3em; padding: 0px; } -} - -.toolbar select{ - width:auto; + .btn { + padding: 2px 8px; + } }