suzanne.soy/travis-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

make active repos dynamic again

Browse Source
This commit is contained in:
Lisa Passing 2015-02-23 17:34:28 +01:00
parent 5d41629672
commit 26ffa632f1
3 changed files with 66 additions and 208 deletions
app
styles/app
components
icons.sass
layouts
dashboard.sass
templates/dashboard
repositories.hbs

10
app/styles/app/components/icons.sass
View File

@ -19,19 +19,19 @@
.icon-star
background-image: inline-image('dashboard/star-off.svg')
.icon-error
.icon.errored
background-image: inline-image('dashboard/status-errored.svg')
.icon-fail
.icon.failed
background-image: inline-image('dashboard/status-failed.svg')
.icon-cancel
.icon.canceled
background-image: inline-image('dashboard/status-cancelled.svg')
.icon-pass
.icon.passed
background-image: inline-image('dashboard/status-passed.svg')
.icon-started
.icon.started
background-image: inline-image('dashboard/status-pending.svg')
.icon-lock

50
app/styles/app/layouts/dashboard.sass
View File

@ -3,6 +3,17 @@
* @todo: split into components: filter, search
*/
@mixin colorDbelements($color)
.db-status
background-color: $color
.db-repo
h2, h3, a
color: $color
.db-job
color: $color
a
color: $color
%br-4px
border-radius: 4px
@ -52,6 +63,19 @@ $dropdown-border: #C3D9DB
bottom: 0
margin: auto
&.started
@include colorDbelements($start-color)
&.failed
@include colorDbelements($fail-color)
&.errored
@include colorDbelements($error-color)
&.canceled
@include colorDbelements($cancel-color)
&.passed
@include colorDbelements($pass-color)
&.inactive
@include colorDbelements($cancel-color)
.db-repo
padding-left: 3em
transform: translateY(0.4em)
@ -73,7 +97,7 @@ $dropdown-border: #C3D9DB
left: 0
height: 100%
width: 2.5em
background-color: $db-gray
// background-color: $db-gray
border-top-left-radius: 4px
border-bottom-left-radius: 4px
@ -221,30 +245,6 @@ $dropdown-border: #C3D9DB
opacity: .7
@mixin colorDbelements($color)
.db-status
background-color: $color
.db-repo
h2, h3, a
color: $color
.db-job
color: $color
a
color: $color
.db--started
@include colorDbelements($start-color)
.db--fail
@include colorDbelements($fail-color)
.db--error
@include colorDbelements($error-color)
.db--cancel
@include colorDbelements($cancel-color)
.db--pass
@include colorDbelements($pass-color)
.db--inactive
@include colorDbelements($cancel-color)
// .current-org-avatar
// display : inline-block
// height : 20px

214
app/templates/dashboard/repositories.hbs
View File

@ -36,36 +36,10 @@
</div>
</div>
{{!-- <div class="tiles">
<div class="row">
{{#each repo in filteredRepositories}}
<div class="large-4 medium-6 columns">
<div {{bind-attr class=":tile repo.last_build.state"}}>
<div class="build-bar">
</div>
<div class="build-information">
<p class="org">{{repo.owner.login}}</p>
<p class="repo">{{#link-to "repo" repo.owner.login repo.name}}{{repo.name}}{{/link-to}}</p>
<div class="duration">{{format-duration repo.last_build.duration}}</div>
<div class="finished">{{format-time repo.last_build.finished_at}}</div>
<p class="build-status">
{{#link-to "build" repo.owner.login repo.name repo.last_build.id}}
#{{repo.last_build.number}} {{repo.last_build.state}}
{{/link-to}}
</p>
</div>
<div class="star-feature">
</div>
</div>
</div>
{{/each}}
</div>
</div> --}}
<div class="dashboard">
<section class="dashboard-starred">
<div class="row">
<div class="db db--pass column">
{{!-- <div class="db db--pass column">
<div class="db-status">
<span class="icon icon-status icon-started"></span>
<span class="icon icon-star"></span>
@ -87,166 +61,50 @@
<li><a href="#" title="">Deactivate repository</a></li>
<li><a href="#" title="">Trigger a build</a></li>
</ul>
</div>
</div> --}}
<div class="db db--error column">
<div class="db-lock"><span class="icon icon-lock"></span></div>
<div class="db-status">
<span class="icon icon-status icon-started"></span>
<span class="icon icon-star"></span>
</div>
<div class="db-repo column">
<h3>travis-pro</h3>
<h2>travis-rubies</h2>
</div>
<div class="db-controls column end">
<p class="db-job column small-6"><span class="icon icon-hash"></span>9874 started</p>
<p class="db-commit column small-6"><span class="icon icon-github"></span>394348a</p>
<p class="db-timeago column small-6"><span class="icon icon-cal"></span>in queue</p>
<p class="db-branch column small-6"><span class="icon icon-branch"></span>master</p>
</div>
<div class="db-burger">
<span class="icon icon-burger"></span>
</div>
<ul class="dropdown">
<li><a href="#" title="">Deactivate repository</a></li>
<li><a href="#" title="">Trigger a build</a></li>
</ul>
</div>
<div class="db db--error column">
<div class="db-lock"><span class="icon icon-lock"></span></div>
<div class="db-status">
<span class="icon icon-status icon-started"></span>
<span class="icon icon-star"></span>
</div>
<div class="db-repo column">
<h3>travis-pro</h3>
<h2>travis-rubies</h2>
</div>
<div class="db-controls column end">
<p class="db-job column small-6"><span class="icon icon-hash"></span>9874 started</p>
<p class="db-commit column small-6"><span class="icon icon-github"></span>394348a</p>
<p class="db-timeago column small-6"><span class="icon icon-cal"></span>in queue</p>
<p class="db-branch column small-6"><span class="icon icon-branch"></span>master</p>
</div>
<div class="db-burger">
<span class="icon icon-burger"></span>
</div>
<ul class="dropdown">
<li><a href="#" title="">Deactivate repository</a></li>
<li><a href="#" title="">Trigger a build</a></li>
</ul>
</div>
</div>
{{!-- <div class="row">
<div class="dashboard--empty">
<p><span class="icon icon-star"></span>Want to keep an eye on certain projects? Star repositories below to add them in this section.</p>
</div>
</div> --}}
</div>
</section>
<section class="dashboard-active">
<div class="db db--started row">
<div class="db-lock"><span class="icon icon-lock"></span></div>
<div class="db-status">
<span class="icon icon-status icon-started"></span>
<span class="icon icon-star"></span>
{{#each repo in filteredRepositories}}
<div {{bind-attr class=":db :row repo.last_build.state"}}>
{{#if repo.private }}
<div class="db-lock"><span class="icon icon-lock"></span></div>
{{/if}}
<div class="db-status">
<span {{bind-attr class=":icon :icon-status repo.last_build.state"}}></span>
<span class="icon icon-star"></span>
</div>
<div class="db-repo column medium-3 small-12">
<h3>{{repo.owner.login}}</h3>
<h2>{{#link-to "repo" repo.owner.login repo.name}}{{repo.name}}{{/link-to}}</h2>
</div>
<div class="db-controls column medium-9 small-12 end">
<p class="db-job column medium-3 small-6"><span class="icon icon-hash"></span>
{{#link-to "build" repo.owner.login repo.name repo.last_build.id}}
{{repo.last_build.number}} {{repo.last_build.state}}
{{/link-to}}</p>
<p class="db-branch column medium-3 small-6"><span class="icon icon-branch"></span>master</p>
<p class="db-commit column medium-3 small-6"><span class="icon icon-github"></span>394348a</p>
<p class="db-timeago column medium-3 small-6"><span class="icon icon-cal"></span>{{format-time repo.last_build.finished_at}}</p>
</div>
<div class="db-burger">
<span class="icon icon-burger"></span>
</div>
<ul class="dropdown">
<li><a href="#" title="">Deactivate repository</a></li>
<li><a href="#" title="">Trigger a build</a></li>
</ul>
</div>
<div class="db-repo column medium-3 small-12">
<h3>travis-pro</h3>
<h2>travis-rubies</h2>
</div>
<div class="db-controls column medium-9 small-12 end">
<p class="db-job column medium-3 small-6"><span class="icon icon-hash"></span>9874 started</p>
<p class="db-branch column medium-3 small-6"><span class="icon icon-branch"></span>master</p>
<p class="db-commit column medium-3 small-6"><span class="icon icon-github"></span>394348a</p>
<p class="db-timeago column medium-3 small-6"><span class="icon icon-cal"></span>in queue</p>
</div>
<div class="db-burger">
<span class="icon icon-burger"></span>
</div>
<ul class="dropdown">
<li><a href="#" title="">Deactivate repository</a></li>
<li><a href="#" title="">Trigger a build</a></li>
</ul>
</div>
{{/each}}
<div class="db db--fail row">
<div class="db-lock"><span class="icon icon-lock"></span></div>
<div class="db-status">
<span class="icon icon-status icon-fail"></span>
<span class="icon icon-star"></span>
</div>
<div class="db-repo column medium-3 small-12">
<h3>travis-pro</h3>
<h2>travis-pro-api</h2>
</div>
<div class="db-controls column medium-9 small-12 end">
<p class="db-job column medium-3 small-6"><span class="icon icon-hash"></span>9874 failed</p>
<p class="db-branch column medium-3 small-6"><span class="icon icon-branch"></span>master</p>
<p class="db-commit column medium-3 small-6"><span class="icon icon-github"></span>394348a</p>
<p class="db-timeago column medium-3 small-6"><span class="icon icon-cal"></span>25 min ago</p>
</div>
<div class="db-burger">
<span class="icon icon-burger"></span>
</div>
<ul class="dropdown">
<li><a href="#" title="">Deactivate repository</a></li>
<li><a href="#" title="">Trigger a build</a></li>
</ul>
</div>
<div class="db db--error row">
<div class="db-lock"><span class="icon icon-lock"></span></div>
<div class="db-status">
<span class="icon icon-status icon-error"></span>
<span class="icon icon-star"></span>
</div>
<div class="db-repo column medium-3 small-12">
<h3>travis-pro</h3>
<h2>travis-pro-hub</h2>
</div>
<div class="db-controls column medium-9 small-12 end">
<p class="db-job column medium-3 small-6"><span class="icon icon-hash"></span>9874 errored</p>
<p class="db-branch column medium-3 small-6"><span class="icon icon-branch"></span>master</p>
<p class="db-commit column medium-3 small-6"><span class="icon icon-github"></span>394348a</p>
<p class="db-timeago column medium-3 small-6"><span class="icon icon-cal"></span>1 hour ago</p>
</div>
<div class="db-burger">
<span class="icon icon-burger"></span>
</div>
<ul class="dropdown">
<li><a href="#" title="">Deactivate repository</a></li>
<li><a href="#" title="">Trigger a build</a></li>
</ul>
</div>
<div class="db db--cancel row">
<div class="db-status">
<span class="icon icon-status icon-cancel"></span>
<span class="icon icon-star"></span>
</div>
<div class="db-repo column medium-3 small-12">
<h3>travis-pro</h3>
<h2>travis-gatekeeper</h2>
</div>
<div class="db-controls column medium-9 small-12 end">
<p class="db-job column medium-3 small-6"><span class="icon icon-hash"></span>9874 cancelled</p>
<p class="db-branch column medium-3 small-6"><span class="icon icon-branch"></span>master</p>
<p class="db-commit column medium-3 small-6"><span class="icon icon-github"></span>394348a</p>
<p class="db-timeago column medium-3 small-6"><span class="icon icon-cal"></span>3 hours ago</p>
</div>
<div class="db-burger">
<span class="icon icon-burger"></span>
</div>
<ul class="dropdown">
<li><a href="#" title="">Deactivate repository</a></li>
<li><a href="#" title="">Trigger a build</a></li>
</ul>
</div>
<div class="db db--pass row">
{{!-- <div class="db db--pass row">
<div class="db-lock"><span class="icon icon-lock"></span></div>
<div class="db-status">
<span class="icon icon-status icon-pass"></span>
@ -269,7 +127,7 @@
<li><a href="#" title="">Deactivate repository</a></li>
<li><a href="#" title="">Trigger a build</a></li>
</ul>
</div>
</div> --}}
</section>
<hr>