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

responsify dashboard list

Browse Source
This commit is contained in:
Lisa Passing 2015-02-23 16:54:41 +01:00
parent 6caa1bf56d
commit b3c2ed1d98
3 changed files with 21 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
app/styles/app/foundation/scss/foundation/_settings.scss
View File

@ -151,8 +151,10 @@ $body-font-color: $color-text;
// d. Media Query Ranges
// - - - - - - - - - - - - - - - - - - - - - - - - -
$small-range: (0em, 40em);
$medium-range: (40.063em, 64em);
$breakpoint-sm: 64em;
$small-range: (0em, 50em);
$medium-range: (50.063em, $breakpoint-sm);
$large-range: (64.063em, 90em);
$xlarge-range: (90.063em, 120em);
$xxlarge-range: (120.063em, 99999999em);

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

@ -102,8 +102,8 @@ $db-text-color: #ACAAAA
margin-left: 1em
.icon
width: 1.6em
height: 1.6em
width: 1.4em
height: 1.4em
.db-job,
.db-branch,
@ -112,6 +112,7 @@ $db-text-color: #ACAAAA
position: relative
padding-left: 2.2em
z-index: 30
overflow: hidden
.db-lock
position: absolute
@ -122,8 +123,11 @@ $db-text-color: #ACAAAA
height: 1em
.db-activation
margin: 1em 0 .5em
text-align: right
padding-right: 0
@media #{$medium-up}
margin: 0
.db-burger
position: absolute;
@ -178,15 +182,22 @@ $db-text-color: #ACAAAA
display: none
.dashboard-starred
padding: 0 3em
margin: 2em 0 3em
.db
padding-bottom: .2em
@media #{$medium-up}
width: grid-calc(17, 36)
.db-controls
padding-left: 3em
.dashboard-active,
.dashboard-inactive
padding: 0 3em
margin-bottom: 3em
.db
padding-bottom: 0.2em;
.db-repo,
.db-controls
padding-left: 4em
@media #{$medium-up}

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

@ -65,7 +65,7 @@
<div class="dashboard">
<section class="dashboard-starred">
<div class="row">
<div class="db db--pass column medium-5">
<div class="db db--pass column">
<div class="db-status">
<span class="icon icon-status icon-started"></span>
<span class="icon icon-star"></span>
@ -89,7 +89,7 @@
</ul>
</div>
<div class="db db--error column medium-5">
<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>
@ -162,7 +162,7 @@
<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 minutes ago</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>
@ -262,7 +262,7 @@
<p class="db-job column medium-2 small-4"><span class="icon icon-hash"></span>9874</p>
<p class="db-commit column medium-2 small-4"><span class="icon icon-github"></span>394348a</p>
<p class="db-timeago column medium-2 small-4"><span class="icon icon-cal"></span>3 hours ago</p>
<div class="db-activation column medium-4 push-2 small-12 end">
<div class="db-activation column medium-5 push-1 small-12 end">
<p>Not active</p>
<button class="button button--green button--fixedwidth">Activate</button>
</div>