mirror of
https://github.com/jupyter/notebook.git
synced 2025-03-07 13:07:22 +08:00
use row-fluid for cluster list
This commit is contained in:
MinRK
parent
7f3995eded
commit
d1416665dc
@ -1405,22 +1405,19 @@ ul.icons-ul{list-style-type:none;text-indent:-0.7142857142857143em;margin-left:2
|
||||
.list_toolbar{padding:5px;height:25px;line-height:25px;}
|
||||
.toolbar_info{float:left;}
|
||||
.toolbar_buttons{float:right;}
|
||||
.list_header>a{font-size:100%;}
|
||||
.tree_list{margin-top:16px;margin-bottom:16px;border:1px solid #eeeeee;border-radius:4px;}
|
||||
.tree_list>div{border-bottom:1px solid #eeeeee;}.tree_list>div:hover .list-item{background-color:red;}
|
||||
.tree_list>div:last-child{border:none;}
|
||||
.list_header{font-weight:bold;}
|
||||
.list_container{margin-top:16px;margin-bottom:16px;border:1px solid #eeeeee;border-radius:4px;}
|
||||
.list_container>div{border-bottom:1px solid #eeeeee;}.list_container>div:hover .list-item{background-color:red;}
|
||||
.list_container>div:last-child{border:none;}
|
||||
.list_item:hover .list_item{background-color:#ddd;}
|
||||
.tree_list>div>span,.tree_list>div>div{padding:8px;}
|
||||
.cluster_list_item>a{color:#000000 !important;}
|
||||
.list_container>div>span,.list_container>div>div{padding:8px;}
|
||||
.cluster_list_item>a{}
|
||||
.notebook_item a{text-decoration:none;}
|
||||
.status_col{float:right;width:325px;}
|
||||
.engines_col{float:right;width:325px;}
|
||||
.action_col{float:right;width:64px;text-align:right;}
|
||||
.item_buttons{}
|
||||
.action_col{}
|
||||
input.nbname_input{height:15px;}
|
||||
.highlight_text{color:blue;}
|
||||
#project_name>.breadcrumb{padding:0px;margin-bottom:0px;background-color:transparent;font-weight:bold;}
|
||||
input.engine_num_input{height:20px;margin-bottom:2px;padding-top:0;padding-bottom:0;width:90px;}
|
||||
input.engine_num_input{height:20px;margin-bottom:2px;padding-top:0;padding-bottom:0;width:60px;}
|
||||
.ansiblack{color:black;}
|
||||
.ansired{color:darkred;}
|
||||
.ansigreen{color:darkgreen;}
|
||||
|
||||
@ -25,6 +25,7 @@ var IPython = (function (IPython) {
|
||||
};
|
||||
|
||||
ClusterList.prototype.style = function () {
|
||||
$('#cluster_list').addClass('list_container');
|
||||
$('#cluster_toolbar').addClass('list_toolbar');
|
||||
$('#cluster_list_info').addClass('toolbar_info');
|
||||
$('#cluster_buttons').addClass('toolbar_buttons');
|
||||
@ -53,14 +54,14 @@ var IPython = (function (IPython) {
|
||||
|
||||
|
||||
ClusterList.prototype.clear_list = function () {
|
||||
this.element.children('.cluster_list_item').remove();
|
||||
this.element.children('.list_item').remove();
|
||||
}
|
||||
|
||||
ClusterList.prototype.load_list_success = function (data, status, xhr) {
|
||||
this.clear_list();
|
||||
var len = data.length;
|
||||
for (var i=0; i<len; i++) {
|
||||
var element = $('<li/>');
|
||||
var element = $('<div/>');
|
||||
var item = new ClusterItem(element);
|
||||
item.update_state(data[i]);
|
||||
element.data('item', item);
|
||||
@ -82,8 +83,7 @@ var IPython = (function (IPython) {
|
||||
|
||||
|
||||
ClusterItem.prototype.style = function () {
|
||||
this.element.addClass('cluster_list_item').addClass("disabled");
|
||||
this.element.append($("<a/>"));
|
||||
this.element.addClass('list_item').addClass("row-fluid");
|
||||
}
|
||||
|
||||
ClusterItem.prototype.update_state = function (data) {
|
||||
@ -99,26 +99,25 @@ var IPython = (function (IPython) {
|
||||
|
||||
ClusterItem.prototype.state_stopped = function () {
|
||||
var that = this;
|
||||
var a = this.element.find("a");
|
||||
var profile_col = $('<span/>').addClass('profile_col').text(this.data.profile);
|
||||
var status_col = $('<span/>').addClass('status_col').html('stopped');
|
||||
var engines_col = $('<span/>').addClass('engines_col');
|
||||
var profile_col = $('<span/>').addClass('profile_col span4').text(this.data.profile);
|
||||
var status_col = $('<span/>').addClass('status_col span3').html('stopped');
|
||||
var engines_col = $('<span/>').addClass('engine_col span3');
|
||||
var input = $('<input/>').attr('type','number')
|
||||
.attr('min',1)
|
||||
.attr('size',3)
|
||||
.addClass('engine_num_input');
|
||||
engines_col.append(input);
|
||||
var start_button = $('<button/>').addClass("btn btn-mini").text("Start");
|
||||
var action_col = $('<span/>').addClass('action_col').append(
|
||||
$("<span/>").addClass("item_buttons btn-group pull-right").append(
|
||||
var action_col = $('<span/>').addClass('action_col span2').append(
|
||||
$("<span/>").addClass("item_buttons btn-group").append(
|
||||
start_button
|
||||
)
|
||||
);
|
||||
a.empty()
|
||||
this.element.empty()
|
||||
.append(profile_col)
|
||||
.append(action_col)
|
||||
.append(status_col)
|
||||
.append(engines_col)
|
||||
.append(status_col);
|
||||
.append(action_col);
|
||||
start_button.click(function (e) {
|
||||
var n = that.element.find('.engine_num_input').val();
|
||||
if (!/^\d+$/.test(n) && n.length>0) {
|
||||
@ -146,21 +145,20 @@ var IPython = (function (IPython) {
|
||||
|
||||
ClusterItem.prototype.state_running = function () {
|
||||
var that = this;
|
||||
var a = this.element.find("a");
|
||||
var profile_col = $('<span/>').addClass('profile_col').text(this.data.profile);
|
||||
var status_col = $('<span/>').addClass('status_col').html('running');
|
||||
var engines_col = $('<span/>').addClass('engines_col').html(this.data.n);
|
||||
var profile_col = $('<span/>').addClass('profile_col span4').text(this.data.profile);
|
||||
var status_col = $('<span/>').addClass('status_col span3').html('running');
|
||||
var engines_col = $('<span/>').addClass('engines_col span3').html(this.data.n);
|
||||
var stop_button = $('<button/>').addClass("btn btn-mini").text("Stop");
|
||||
var action_col = $('<span/>').addClass('action_col').append(
|
||||
$("<span/>").addClass("item_buttons btn-group pull-right").append(
|
||||
var action_col = $('<span/>').addClass('action_col span2').append(
|
||||
$("<span/>").addClass("item_buttons btn-group").append(
|
||||
stop_button
|
||||
)
|
||||
);
|
||||
a.empty()
|
||||
this.element.empty()
|
||||
.append(profile_col)
|
||||
.append(action_col)
|
||||
.append(status_col)
|
||||
.append(engines_col)
|
||||
.append(status_col);
|
||||
.append(action_col);
|
||||
stop_button.click(function (e) {
|
||||
var settings = {
|
||||
cache : false,
|
||||
|
||||
@ -29,7 +29,7 @@ var IPython = (function (IPython) {
|
||||
$('#drag_info').addClass('toolbar_info');
|
||||
$('#notebook_buttons').addClass('toolbar_buttons');
|
||||
$('#notebook_list_header').addClass('list_header');
|
||||
this.element.addClass("tree_list");
|
||||
this.element.addClass("list_container");
|
||||
};
|
||||
|
||||
|
||||
|
||||
@ -26,25 +26,25 @@
|
||||
float: right;
|
||||
}
|
||||
|
||||
.list_header > a {
|
||||
font-size: 100%;
|
||||
.list_header {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.tree_list {
|
||||
.list_container {
|
||||
margin-top: 16px;
|
||||
margin-bottom: 16px;
|
||||
border: 1px solid @borderColor;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.tree_list > div {
|
||||
.list_container > div {
|
||||
border-bottom: 1px solid @borderColor;
|
||||
&:hover .list-item{
|
||||
background-color: red;
|
||||
};
|
||||
}
|
||||
|
||||
.tree_list > div:last-child {
|
||||
.list_container > div:last-child {
|
||||
border: none;
|
||||
}
|
||||
|
||||
@ -55,13 +55,13 @@
|
||||
};
|
||||
}
|
||||
|
||||
.tree_list > div > span, .tree_list > div > div {
|
||||
.list_container > div > span, .list_container > div > div {
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
|
||||
.cluster_list_item > a {
|
||||
color: @textColor !important;
|
||||
/* color: @textColor !important;*/
|
||||
}
|
||||
|
||||
.notebook_item a {
|
||||
@ -72,23 +72,13 @@
|
||||
}
|
||||
|
||||
.status_col {
|
||||
float: right;
|
||||
width: 325px;
|
||||
}
|
||||
|
||||
.engines_col {
|
||||
float: right;
|
||||
width: 325px;
|
||||
}
|
||||
|
||||
.action_col {
|
||||
float: right;
|
||||
width: 64px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.item_buttons {
|
||||
/* float: right;*/
|
||||
/* text-align: right;*/
|
||||
}
|
||||
|
||||
input.nbname_input {
|
||||
@ -113,5 +103,5 @@ input.engine_num_input {
|
||||
margin-bottom:2px;
|
||||
padding-top:0;
|
||||
padding-bottom:0;
|
||||
width: 90px;
|
||||
width: 60px;
|
||||
}
|
||||
|
||||
@ -46,7 +46,7 @@ data-read-only={{read_only}}
|
||||
{% endif %}
|
||||
|
||||
<div id="notebook_list">
|
||||
<div id="notebook_list_header" class="row-fluid">
|
||||
<div id="notebook_list_header" class="row-fluid list_header">
|
||||
<div id="project_name">
|
||||
<ul class="breadcrumb">
|
||||
{% for component in project_component %}
|
||||
@ -68,17 +68,14 @@ data-read-only={{read_only}}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<ul id="cluster_list" class="nav nav-tabs nav-stacked">
|
||||
<li id="cluster_header" class="disabled list_header">
|
||||
<a class="nav-header">
|
||||
<!-- <div class="nav-header"> -->
|
||||
<span class="profile_col">profile</span>
|
||||
<span class="action_col">action</span>
|
||||
<span class="engines_col" title="Enter the number of engines to start or empty for default"># of engines</span>
|
||||
<span class="status_col">status</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div id="cluster_list">
|
||||
<div id="cluster_list_header" class="row-fluid list_header">
|
||||
<span class="profile_col span4">profile</span>
|
||||
<span class="status_col span3">status</span>
|
||||
<span class="engines_col span3" title="Enter the number of engines to start or empty for default"># of engines</span>
|
||||
<span class="action_col span2">action</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user