mirror/notebook
2
0
Fork 0
mirror of https://github.com/jupyter/notebook.git synced 2025-01-24 12:05:22 +08:00
Code Issues Packages Projects Releases Wiki Activity

Tighten spacing of dashboard.

Browse Source
This commit is contained in:
Brian E. Granger 2014-02-02 22:50:08 -08:00
parent e6c0e462ac
commit dd126fce6d
6 changed files with 97 additions and 80 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
IPython/html/static/style/ipython.min.css vendored
View File

@ -28,21 +28,23 @@ div.traceback-wrapper{text-align:left;max-width:800px;margin:auto}
.center-nav{display:inline-block;margin-bottom:-4px} .center-nav{display:inline-block;margin-bottom:-4px}
.alternate_upload{background-color:none;display:inline} .alternate_upload{background-color:none;display:inline}
.alternate_upload.form{padding:0;margin:0} .alternate_upload.form{padding:0;margin:0}
.alternate_upload input.fileinput{background-color:#f00;position:relative;opacity:0;z-index:2;width:295px;margin-left:163px;cursor:pointer} .alternate_upload input.fileinput{background-color:#f00;position:relative;opacity:0;z-index:2;width:295px;margin-left:163px;cursor:pointer;height:26px}
.list_toolbar{padding:5px;height:25px;line-height:25px} ul#tabs{margin-bottom:4px}
.toolbar_info{float:left} ul#tabs a{padding-top:4px;padding-bottom:4px}
.toolbar_buttons{float:right} .list_toolbar{padding:4px 0 4px 0}
.list_toolbar [class*="span"]{min-height:26px}
.list_header{font-weight:bold} .list_header{font-weight:bold}
.list_container{margin-top:16px;margin-bottom:16px;border:1px solid #ababab;border-radius:4px} .list_container{margin-top:4px;margin-bottom:16px;border:1px solid #ababab;border-radius:4px}
.list_container>div{border-bottom:1px solid #ababab}.list_container>div:hover .list-item{background-color:#f00} .list_container>div{border-bottom:1px solid #ababab}.list_container>div:hover .list-item{background-color:#f00}
.list_container>div:last-child{border:none} .list_container>div:last-child{border:none}
.list_item:hover .list_item{background-color:#ddd} .list_item:hover .list_item{background-color:#ddd}
.list_item a{text-decoration:none} .list_item a{text-decoration:none}
.list_item .span12{padding:3px} .list_header>div,.list_item>div{padding-top:4px;padding-bottom:4px;padding-left:7px;padding-right:7px}
.item_name{line-height:24px} .item_name{line-height:22px}
.item_icon{font-size:14px;color:#5e5e5e;margin-left:5px;margin-right:8px} .item_icon{font-size:14px;color:#5e5e5e;margin-right:7px}
.list_container>div>span,.list_container>div>div{padding:8px} .item_buttons{line-height:1em}
input.nbname_input{height:15px;margin:0} .toolbar_info{height:26px;line-height:26px}
input.nbname_input{padding-top:3px;padding-bottom:3px;height:14px;line-height:14px;margin:0}
.highlight_text{color:#00f} .highlight_text{color:#00f}
#project_name>.breadcrumb{padding:0;margin-bottom:0;background-color:transparent;font-weight:bold} #project_name>.breadcrumb{padding:0;margin-bottom:0;background-color:transparent;font-weight:bold}
input.engine_num_input{height:20px;margin-bottom:2px;padding-top:0;padding-bottom:0;width:60px} input.engine_num_input{height:20px;margin-bottom:2px;padding-top:0;padding-bottom:0;width:60px}

22
IPython/html/static/style/style.min.css vendored
View File

@ -1305,21 +1305,23 @@ span#login_widget{float:right}
.center-nav{display:inline-block;margin-bottom:-4px} .center-nav{display:inline-block;margin-bottom:-4px}
.alternate_upload{background-color:none;display:inline} .alternate_upload{background-color:none;display:inline}
.alternate_upload.form{padding:0;margin:0} .alternate_upload.form{padding:0;margin:0}
.alternate_upload input.fileinput{background-color:#f00;position:relative;opacity:0;z-index:2;width:295px;margin-left:163px;cursor:pointer} .alternate_upload input.fileinput{background-color:#f00;position:relative;opacity:0;z-index:2;width:295px;margin-left:163px;cursor:pointer;height:26px}
.list_toolbar{padding:5px;height:25px;line-height:25px} ul#tabs{margin-bottom:4px}
.toolbar_info{float:left} ul#tabs a{padding-top:4px;padding-bottom:4px}
.toolbar_buttons{float:right} .list_toolbar{padding:4px 0 4px 0}
.list_toolbar [class*="span"]{min-height:26px}
.list_header{font-weight:bold} .list_header{font-weight:bold}
.list_container{margin-top:16px;margin-bottom:16px;border:1px solid #ababab;border-radius:4px} .list_container{margin-top:4px;margin-bottom:16px;border:1px solid #ababab;border-radius:4px}
.list_container>div{border-bottom:1px solid #ababab}.list_container>div:hover .list-item{background-color:#f00} .list_container>div{border-bottom:1px solid #ababab}.list_container>div:hover .list-item{background-color:#f00}
.list_container>div:last-child{border:none} .list_container>div:last-child{border:none}
.list_item:hover .list_item{background-color:#ddd} .list_item:hover .list_item{background-color:#ddd}
.list_item a{text-decoration:none} .list_item a{text-decoration:none}
.list_item .span12{padding:3px} .list_header>div,.list_item>div{padding-top:4px;padding-bottom:4px;padding-left:7px;padding-right:7px}
.item_name{line-height:24px} .item_name{line-height:22px}
.item_icon{font-size:14px;color:#5e5e5e;margin-left:5px;margin-right:8px} .item_icon{font-size:14px;color:#5e5e5e;margin-right:7px}
.list_container>div>span,.list_container>div>div{padding:8px} .item_buttons{line-height:1em}
input.nbname_input{height:15px;margin:0} .toolbar_info{height:26px;line-height:26px}
input.nbname_input{padding-top:3px;padding-bottom:3px;height:14px;line-height:14px;margin:0}
.highlight_text{color:#00f} .highlight_text{color:#00f}
#project_name>.breadcrumb{padding:0;margin-bottom:0;background-color:transparent;font-weight:bold} #project_name>.breadcrumb{padding:0;margin-bottom:0;background-color:transparent;font-weight:bold}
input.engine_num_input{height:20px;margin-bottom:2px;padding-top:0;padding-bottom:0;width:60px} input.engine_num_input{height:20px;margin-bottom:2px;padding-top:0;padding-bottom:0;width:60px}

16
IPython/html/static/tree/js/clusterlist.js
View File

@ -100,16 +100,16 @@ var IPython = (function (IPython) {
ClusterItem.prototype.state_stopped = function () { ClusterItem.prototype.state_stopped = function () {
var that = this; var that = this;
var profile_col = $('<span/>').addClass('profile_col span4').text(this.data.profile); var profile_col = $('<div/>').addClass('profile_col span4').text(this.data.profile);
var status_col = $('<span/>').addClass('status_col span3').text('stopped'); var status_col = $('<div/>').addClass('status_col span3').text('stopped');
var engines_col = $('<span/>').addClass('engine_col span3'); var engines_col = $('<div/>').addClass('engine_col span3');
var input = $('<input/>').attr('type','number') var input = $('<input/>').attr('type','number')
.attr('min',1) .attr('min',1)
.attr('size',3) .attr('size',3)
.addClass('engine_num_input'); .addClass('engine_num_input');
engines_col.append(input); engines_col.append(input);
var start_button = $('<button/>').addClass("btn btn-mini").text("Start"); var start_button = $('<button/>').addClass("btn btn-mini").text("Start");
var action_col = $('<span/>').addClass('action_col span2').append( var action_col = $('<div/>').addClass('action_col span2').append(
$("<span/>").addClass("item_buttons btn-group").append( $("<span/>").addClass("item_buttons btn-group").append(
start_button start_button
) )
@ -151,11 +151,11 @@ var IPython = (function (IPython) {
ClusterItem.prototype.state_running = function () { ClusterItem.prototype.state_running = function () {
var that = this; var that = this;
var profile_col = $('<span/>').addClass('profile_col span4').text(this.data.profile); var profile_col = $('<div/>').addClass('profile_col span4').text(this.data.profile);
var status_col = $('<span/>').addClass('status_col span3').text('running'); var status_col = $('<div/>').addClass('status_col span3').text('running');
var engines_col = $('<span/>').addClass('engines_col span3').text(this.data.n); var engines_col = $('<div/>').addClass('engines_col span3').text(this.data.n);
var stop_button = $('<button/>').addClass("btn btn-mini").text("Stop"); var stop_button = $('<button/>').addClass("btn btn-mini").text("Stop");
var action_col = $('<span/>').addClass('action_col span2').append( var action_col = $('<div/>').addClass('action_col span2').append(
$("<span/>").addClass("item_buttons btn-group").append( $("<span/>").addClass("item_buttons btn-group").append(
stop_button stop_button
) )

1
IPython/html/static/tree/less/altuploadform.less
View File

@ -22,4 +22,5 @@
width: 295px; width: 295px;
margin-left:163px; margin-left:163px;
cursor: pointer; cursor: pointer;
height: 26px;
} }

61
IPython/html/static/tree/less/tree.less
View File

@ -5,21 +5,25 @@
* Author: IPython Development Team * Author: IPython Development Team
*/ */
#tabs { @dashboard_tb_pad: 4px;
@dashboard_lr_pad: 7px;
ul#tabs {
margin-bottom: @dashboard_tb_pad;
}
ul#tabs a {
padding-top: @dashboard_tb_pad;
padding-bottom: @dashboard_tb_pad;
} }
.list_toolbar { .list_toolbar {
padding: 5px; padding: @dashboard_tb_pad 0 @dashboard_tb_pad 0;
height: 25px;
line-height: 25px;
} }
.toolbar_info { .list_toolbar [class*="span"] {
float: left; min-height: 26px;
}
.toolbar_buttons {
float: right;
} }
.list_header { .list_header {
@ -27,7 +31,7 @@
} }
.list_container { .list_container {
margin-top: 16px; margin-top: @dashboard_tb_pad;
margin-bottom: 16px; margin-bottom: 16px;
border: 1px solid @border_color; border: 1px solid @border_color;
border-radius: 4px; border-radius: 4px;
@ -49,38 +53,39 @@
background-color: #ddd; background-color: #ddd;
}; };
a {text-decoration: none;} a {text-decoration: none;}
.span12 {padding: 3px;} }
.list_header>div, .list_item>div {
padding-top: @dashboard_tb_pad;
padding-bottom: @dashboard_tb_pad;
padding-left: @dashboard_lr_pad;
padding-right: @dashboard_lr_pad;
} }
.item_name { .item_name {
line-height: 24px; line-height: 22px;
} }
.item_icon { .item_icon {
font-size: 14px; font-size: 14px;
color: darken(@border_color, 30%); color: darken(@border_color, 30%);
margin-left: 5px; margin-right: @dashboard_lr_pad;
margin-right: 8px;
} }
.list_container > div > span, .list_container > div > div { .item_buttons {
padding: 8px; line-height: 1em;
} }
.profile_col { .toolbar_info {
} height: 26px;
line-height: 26px;
.status_col {
}
.engines_col {
}
.action_col {
} }
input.nbname_input { input.nbname_input {
height: 15px; padding-top: 3px;
padding-bottom: 3px;
height: 14px;
line-height: 14px;
margin: 0px; margin: 0px;
} }

53
IPython/html/templates/tree.html
View File

@ -22,25 +22,29 @@ data-base-kernel-url="{{base_kernel_url}}"
<div id="ipython-main-app" class="container"> <div id="ipython-main-app" class="container">
<div id="tabs" class="tabbable"> <div id="tab_content" class="tabbable">
<ul class="nav nav-tabs" id="tabs"> <ul id="tabs" class="nav nav-tabs">
<li class="active"><a href="#notebooks" data-toggle="tab">Notebooks</a></li> <li class="active"><a href="#notebooks" data-toggle="tab">Notebooks</a></li>
<li><a href="#clusters" data-toggle="tab">Clusters</a></li> <li><a href="#clusters" data-toggle="tab">Clusters</a></li>
</ul> </ul>
<div class="tab-content"> <div class="tab-content">
<div id="notebooks" class="tab-pane active"> <div id="notebooks" class="tab-pane active">
<div id="notebook_toolbar"> <div id="notebook_toolbar" class="row-fluid">
<form id='alternate_upload' class='alternate_upload' > <div class="span8">
<span id="drag_info" style="position:absolute" > <form id='alternate_upload' class='alternate_upload' >
To import a notebook, drag the file onto the listing below or <strong>click here</strong>. <span id="drag_info" style="position:absolute" >
</span> To import a notebook, drag the file onto the listing below or <strong>click here</strong>.
<input type="file" name="datafile" class="fileinput" multiple='multiple'> </span>
</form> <input type="file" name="datafile" class="fileinput" multiple='multiple'>
<span id="notebook_buttons"> </form>
<button id="refresh_notebook_list" title="Refresh notebook list" class="btn btn-small">Refresh</button> </div>
<button id="new_notebook" title="Create new notebook" class="btn btn-small">New Notebook</button> <div class="span4 clearfix">
</span> <span id="notebook_buttons" class="pull-right">
<button id="new_notebook" title="Create new notebook" class="btn btn-small">New Notebook</button>
<button id="refresh_notebook_list" title="Refresh notebook list" class="btn btn-small"><i class="icon-refresh"></i></button>
</span>
</div>
</div> </div>
<div id="notebook_list"> <div id="notebook_list">
@ -59,20 +63,23 @@ data-base-kernel-url="{{base_kernel_url}}"
<div id="clusters" class="tab-pane"> <div id="clusters" class="tab-pane">
<div id="cluster_toolbar"> <div id="cluster_toolbar" class="row-fluid">
<span id="cluster_list_info">IPython parallel computing clusters</span> <div class="span8">
<span id="cluster_list_info">IPython parallel computing clusters</span>
<span id="cluster_buttons"> </div>
<button id="refresh_cluster_list" title="Refresh cluster list" class="btn btn-small">Refresh</button> <div class="span4" class="clearfix">
</span> <span id="cluster_buttons" class="pull-right">
<button id="refresh_cluster_list" title="Refresh cluster list" class="btn btn-small"><i class="icon-refresh"></i></button>
</span>
</div>
</div> </div>
<div id="cluster_list"> <div id="cluster_list">
<div id="cluster_list_header" class="row-fluid list_header"> <div id="cluster_list_header" class="row-fluid list_header">
<span class="profile_col span4">profile</span> <div class="profile_col span4">profile</div>
<span class="status_col span3">status</span> <div class="status_col span3">status</div>
<span class="engines_col span3" title="Enter the number of engines to start or empty for default"># of engines</span> <div class="engines_col span3" title="Enter the number of engines to start or empty for default"># of engines</div>
<span class="action_col span2">action</span> <div class="action_col span2">action</div>
</div> </div>
</div> </div>
</div> </div>