mirror of
https://github.com/jupyter/notebook.git
synced 2024-12-21 04:10:17 +08:00
MAJOR CSS FIXES
Fixed jquery slider horizontal style Fixed label alignment
This commit is contained in:
Jonathan Frederic
parent
9cfecfb6aa
commit
72fd070739
@ -8,19 +8,15 @@ require(["notebook/js/widget"], function(){
|
||||
|
||||
// Called when view is rendered.
|
||||
render : function(){
|
||||
this.$el
|
||||
.html('');
|
||||
|
||||
var $label = $('<label />')
|
||||
.addClass('checkbox')
|
||||
this.$el = $('<div />')
|
||||
.addClass('widget-hbox-single');
|
||||
this.$label = $('<div />')
|
||||
.addClass('widget-label')
|
||||
.appendTo(this.$el);
|
||||
this.$checkbox_label = $('<div />')
|
||||
.appendTo($label)
|
||||
.appendTo(this.$el)
|
||||
.hide();
|
||||
this.$checkbox = $('<input />')
|
||||
.attr('type', 'checkbox')
|
||||
.appendTo($label);
|
||||
.appendTo(this.$el);
|
||||
|
||||
this.update(); // Set defaults.
|
||||
},
|
||||
@ -33,10 +29,10 @@ require(["notebook/js/widget"], function(){
|
||||
|
||||
var description = this.model.get('description');
|
||||
if (description.length == 0) {
|
||||
this.$checkbox_label.hide();
|
||||
this.$label.hide();
|
||||
} else {
|
||||
this.$checkbox_label.html(description);
|
||||
this.$checkbox_label.show();
|
||||
this.$label.html(description);
|
||||
this.$label.show();
|
||||
}
|
||||
}
|
||||
return IPython.WidgetView.prototype.update.call(this);
|
||||
|
||||
@ -8,6 +8,7 @@ require(["notebook/js/widget"], function(){
|
||||
render : function(){
|
||||
|
||||
this.$el
|
||||
.addClass('widget-hbox-single')
|
||||
.html('');
|
||||
this.$label = $('<div />')
|
||||
.appendTo(this.$el)
|
||||
@ -19,6 +20,7 @@ require(["notebook/js/widget"], function(){
|
||||
.appendTo(this.$el);
|
||||
this.$droplabel = $('<button />')
|
||||
.addClass('btn')
|
||||
.addClass('widget-combo-btn')
|
||||
.appendTo(this.$buttongroup);
|
||||
this.$dropbutton = $('<button />')
|
||||
.addClass('btn')
|
||||
@ -84,11 +86,16 @@ require(["notebook/js/widget"], function(){
|
||||
// Called when view is rendered.
|
||||
render : function(){
|
||||
this.$el
|
||||
.addClass('widget-hbox')
|
||||
.html('');
|
||||
this.$label = $('<div />')
|
||||
.appendTo(this.$el)
|
||||
.addClass('widget-label')
|
||||
.hide();
|
||||
this.$container = $('<div />')
|
||||
.appendTo(this.$el)
|
||||
.addClass('widget-container')
|
||||
.addClass('vbox');
|
||||
this.update();
|
||||
},
|
||||
|
||||
@ -104,7 +111,7 @@ require(["notebook/js/widget"], function(){
|
||||
var $label = $('<label />')
|
||||
.addClass('radio')
|
||||
.html(items[index])
|
||||
.appendTo(this.$el);
|
||||
.appendTo(this.$container);
|
||||
|
||||
var that = this;
|
||||
$('<input />')
|
||||
@ -119,14 +126,14 @@ require(["notebook/js/widget"], function(){
|
||||
}
|
||||
|
||||
if (this.model.get('value') == items[index]) {
|
||||
this.$el.find(item_query).prop('checked', true);
|
||||
this.$container.find(item_query).prop('checked', true);
|
||||
} else {
|
||||
this.$el.find(item_query).prop('checked', false);
|
||||
this.$container.find(item_query).prop('checked', false);
|
||||
}
|
||||
}
|
||||
|
||||
// Remove items that no longer exist.
|
||||
this.$el.find('input').each(function(i, obj) {
|
||||
this.$container.find('input').each(function(i, obj) {
|
||||
var value = $(obj).val();
|
||||
var found = false;
|
||||
for (var index in items) {
|
||||
@ -161,6 +168,7 @@ require(["notebook/js/widget"], function(){
|
||||
// Called when view is rendered.
|
||||
render : function(){
|
||||
this.$el
|
||||
.addClass('widget-hbox-single')
|
||||
.html('');
|
||||
this.$label = $('<div />')
|
||||
.appendTo(this.$el)
|
||||
|
||||
@ -26,6 +26,7 @@ require(["notebook/js/widget"], function(){
|
||||
// Called when view is rendered.
|
||||
render : function(){
|
||||
this.$el
|
||||
.addClass('widget-hbox')
|
||||
.html('');
|
||||
this.$label = $('<div />')
|
||||
.appendTo(this.$el)
|
||||
@ -33,6 +34,7 @@ require(["notebook/js/widget"], function(){
|
||||
.hide();
|
||||
this.$textbox = $('<textarea />')
|
||||
.attr('rows', 5)
|
||||
.addClass('widget-text')
|
||||
.appendTo(this.$el);
|
||||
this.update(); // Set defaults.
|
||||
},
|
||||
@ -74,6 +76,7 @@ require(["notebook/js/widget"], function(){
|
||||
// Called when view is rendered.
|
||||
render : function(){
|
||||
this.$el
|
||||
.addClass('widget-hbox-single')
|
||||
.html('');
|
||||
this.$label = $('<div />')
|
||||
.addClass('widget-label')
|
||||
@ -81,6 +84,7 @@ require(["notebook/js/widget"], function(){
|
||||
.hide();
|
||||
this.$textbox = $('<input type="text" />')
|
||||
.addClass('input')
|
||||
.addClass('widget-text')
|
||||
.appendTo(this.$el);
|
||||
this.update(); // Set defaults.
|
||||
},
|
||||
|
||||
@ -1,23 +1,79 @@
|
||||
.widget-label {
|
||||
min-width: 300px;
|
||||
}
|
||||
|
||||
div.widget-container {
|
||||
.box-flex2();
|
||||
.border-box-sizing();
|
||||
}
|
||||
|
||||
div.widget-area {
|
||||
.widget-area {
|
||||
page-break-inside: avoid;
|
||||
.hbox();
|
||||
}
|
||||
|
||||
/* This class is for the widget subarea inside the widget_area and after
|
||||
the prompt div. */
|
||||
div.widget-subarea {
|
||||
padding: 0.44em 0.4em 0.4em 1px;
|
||||
margin-left: 6px;
|
||||
.border-box-sizing();
|
||||
.vbox();
|
||||
.box-flex2()
|
||||
.widget-subarea {
|
||||
padding: 0.44em 0.4em 0.4em 1px;
|
||||
margin-left: 6px;
|
||||
.border-box-sizing();
|
||||
.vbox();
|
||||
.box-flex2();
|
||||
|
||||
.widget-label {
|
||||
min-width: 10ex;
|
||||
padding-right: 8px;
|
||||
text-align: right;
|
||||
vertical-align: text-top;
|
||||
padding-top: 3px;
|
||||
}
|
||||
|
||||
.widget-slider {
|
||||
padding-left: 8px;
|
||||
padding-right: 5px;
|
||||
margin-top: 11px;
|
||||
|
||||
width: 348px;
|
||||
height: 5px !important;
|
||||
overflow: visible !important;
|
||||
|
||||
border: 1px solid #CCCCCC;
|
||||
background: #FFFFFF;
|
||||
.corner-all();
|
||||
|
||||
.ui-slider {
|
||||
border: 0px !important;
|
||||
background: none !important;
|
||||
|
||||
.ui-slider-handle {
|
||||
width: 14px !important;
|
||||
height: 28px !important;
|
||||
|
||||
margin-top: -7px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.widget-text {
|
||||
width: 350px;
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
|
||||
.widget-numeric-text {
|
||||
width: 150px;
|
||||
}
|
||||
|
||||
.widget-combo-btn {
|
||||
min-width: 138px; /* + 26px drop arrow btn = 164px */
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
.widget-container {
|
||||
.box-flex1();
|
||||
.border-box-sizing();
|
||||
}
|
||||
|
||||
.widget-hbox {
|
||||
.hbox();
|
||||
.start();
|
||||
.widget-container();
|
||||
margin-bottom: 5px;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.widget-hbox-single {
|
||||
.widget-hbox();
|
||||
height: 30px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
11
IPython/html/static/style/ipython.min.css
vendored
11
IPython/html/static/style/ipython.min.css
vendored
@ -165,10 +165,7 @@ h1:hover .anchor-link,h2:hover .anchor-link,h3:hover .anchor-link,h4:hover .anch
|
||||
.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);}
|
||||
.hbox{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;}
|
||||
.hbox>*{-webkit-box-flex:0;-moz-box-flex:0;box-flex:0;display:block;}
|
||||
.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;}
|
||||
.vbox>*{-webkit-box-flex:0;-moz-box-flex:0;box-flex:0;display:block;}
|
||||
div.widget_area{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.widget_item{display:inline-block;}
|
||||
div.widget_subarea{padding:0.44em 0.4em 0.4em 1px;margin-left:6px;-webkit-box-flex:1;-moz-box-flex:1;box-flex:1;}
|
||||
.widget-label{min-width:300px;}
|
||||
div.widget-container{-webkit-box-flex:2;-moz-box-flex:2;box-flex:2;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;}
|
||||
div.widget-area{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.widget-subarea{padding:0.44em 0.4em 0.4em 1px;margin-left:6px;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;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%;-webkit-box-flex:2;-moz-box-flex:2;box-flex:2;}
|
||||
|
||||
11
IPython/html/static/style/style.min.css
vendored
11
IPython/html/static/style/style.min.css
vendored
@ -1584,10 +1584,7 @@ span#checkpoint_status,span#autosave_status{font-size:small;}
|
||||
.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);}
|
||||
.hbox{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;}
|
||||
.hbox>*{-webkit-box-flex:0;-moz-box-flex:0;box-flex:0;display:block;}
|
||||
.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;}
|
||||
.vbox>*{-webkit-box-flex:0;-moz-box-flex:0;box-flex:0;display:block;}
|
||||
div.widget_area{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.widget_item{display:inline-block;}
|
||||
div.widget_subarea{padding:0.44em 0.4em 0.4em 1px;margin-left:6px;-webkit-box-flex:1;-moz-box-flex:1;box-flex:1;}
|
||||
.widget-label{min-width:300px;}
|
||||
div.widget-container{-webkit-box-flex:2;-moz-box-flex:2;box-flex:2;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;}
|
||||
div.widget-area{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.widget-subarea{padding:0.44em 0.4em 0.4em 1px;margin-left:6px;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;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%;-webkit-box-flex:2;-moz-box-flex:2;box-flex:2;}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user