markup and styles for running tab

This commit is contained in:
Lisa Passing 2015-03-18 16:38:28 +01:00
parent 7715ed31d6
commit fa13d84089
5 changed files with 69 additions and 42 deletions

View File

@ -83,4 +83,8 @@ $sb-font-size: 14px
border-bottom: .46rem solid #FAF9F7 border-bottom: .46rem solid #FAF9F7
background-color: #FAF9F7 background-color: #FAF9F7
.sidebar-seperator
width: 90%
margin: 1rem auto
border: none
border-bottom: solid 2px #f2f2f2

View File

@ -1,23 +1,29 @@
<ul id="queues">
<li class="queue"> {{#if length}}
<h4>Queue ({{length}})</h4> {{#each job in controller}}
<ul> <div {{bind-attr class=":tile :tile--sidebar job.state"}}>
{{#if length}} {{#if job.repo.slug}}
{{#each job in controller}} <span {{bind-attr class=":icon :icon--job job.state"}}></span>
<li> {{#link-to "job" job.repo job}}{{job.repo.slug}}{{/link-to}}
{{#if job.repo.slug}} {{/if}}
{{#link-to "job" job.repo job}} </h2>
<span class="slug" {{bind-attr title="job.slug"}}>
{{job.repo.slug}} <p class="tile-title float-right">
</span> <span class="icon icon--hash"></span>
#{{job.number}} {{#link-to "job" job.repo job}}{{job.number}}{{/link-to}}
{{/link-to}} </p>
{{/if}}
</li> <p>
{{/each}} <span class="icon icon--clock"></span>
{{else}} Duration:
There are no jobs <abbr class="duration" {{bind-attr title="job.startedAt"}}>
{{/if}} {{format-duration job.startedAt}}
</ul> </abbr>
</li> </p>
</ul>
</div>
{{/each}}
{{else}}
<div class="spinner-container">There are no jobs queued</div>
{{/if}}

View File

@ -8,9 +8,13 @@
{{#if showRunningJobs}} {{#if showRunningJobs}}
<div class="tabbody sidebar-list"> <div class="tabbody sidebar-list">
{{render "runningJobs"}} <div>
Hello {{render "runningJobs"}}
{{render "queue"}} </div>
<hr class="sidebar-seperator">
<div>
{{render "queue"}}
</div>
</div> </div>
{{else}} {{else}}
<div class="tabbody sidebar-list"> <div class="tabbody sidebar-list">

View File

@ -11,7 +11,7 @@
{{/unless}} {{/unless}}
<li id="tab_running" {{bind-attr class="view.classRunning"}}> <li id="tab_running" {{bind-attr class="view.classRunning"}}>
<a href="#" {{action "showRunningJobs"}}>Running</a> <a href="#" {{action "showRunningJobs"}}>Running (2/3)</a>
</li> </li>
<li id="tab_new" {{bind-attr class="view.classNew :float-right"}}> <li id="tab_new" {{bind-attr class="view.classNew :float-right"}}>

View File

@ -1,17 +1,30 @@
<h4>Running Jobs ({{controller.length}})</h4> {{!-- <h4>Running Jobs ({{controller.length}})</h4> --}}
<ul class="jobs"> {{#if controller.length}}
{{#if controller.length}} {{#each job in controller}}
{{#each job in controller}} <div {{bind-attr class=":tile :tile--sidebar job.state"}}>
<li {{bind-attr title="job.slug"}}">
{{#if job.repo.slug}} {{#if job.repo.slug}}
{{#link-to "job" job.repo job}} <span {{bind-attr class=":icon :icon--job job.state"}}></span>
{{job.repo.slug}} #{{job.number}} {{#link-to "job" job.repo job}}{{job.repo.slug}}{{/link-to}}
{{/link-to}}
{{/if}} {{/if}}
</li> </h2>
{{/each}}
{{else}} <p class="tile-title float-right">
There are no jobs <span class="icon icon--hash"></span>
{{/if}} {{#link-to "job" job.repo job}}{{job.number}}{{/link-to}}
</ul> </p>
<p>
<span class="icon icon--clock"></span>
Duration:
<abbr class="duration" {{bind-attr title="job.startedAt"}}>
{{format-duration job.startedAt}}
</abbr>
</p>
</div>
{{/each}}
{{else}}
<div class="spinner-container">There are no jobs running</div>
{{/if}}