diff --git a/app/components/owner-repo-tile.coffee b/app/components/owner-repo-tile.coffee index 2cad3185..db65e286 100644 --- a/app/components/owner-repo-tile.coffee +++ b/app/components/owner-repo-tile.coffee @@ -3,7 +3,7 @@ OwnerRepoTileComponent = Ember.Component.extend tagName: 'li' - classNames: ['tile', 'tile--small', 'row'] + classNames: ['owner-tile'] classNameBindings: ['repo.default_branch.last_build.state'] ownerName: (-> diff --git a/app/styles/app/layouts/owner.sass b/app/styles/app/layouts/owner.sass index afacf718..2669068d 100644 --- a/app/styles/app/layouts/owner.sass +++ b/app/styles/app/layouts/owner.sass @@ -52,60 +52,6 @@ content: "" @include fadeOut(right, -90deg, $white) - -.owner-tiles - @extend .repo-main - @include resetul - - h2 - font-size: 20px - white-space: nowrap - line-height: 2.5 - - .tile-status .icon-status - margin-top: 2.1em - width: 1.2em - height: 1.3em - - .tile-single, - .tile-double - color: $grey-medium - padding: .1em 0 - font-size: $font-size-m - .icon - margin-right: .3em - width: 1em - height: 1.1em - vertical-align: middle - &.icon-github - width: .9em - height: 1.2em - &.push - width: 1.1em - height: .6em - margin: 0 - a - color: $grey-medium - &:hover - color: $grey-medium - text-decoration: underline - - .tile-single - line-height: 3em - .tile-double - line-height: 1.5em - - .tile-main - position: relative - overflow: hidden - &:after - content: "" - @include fadeOut(right, -90deg, $cream-light, 20%) - & ~ div - @media #{$medium-up} - padding-left: 2em - border-left: 1px solid $cream-dark - .tabs--owner padding : 0 $column-gutter/2 @@ -129,3 +75,104 @@ @media #{$medium-up} height: 2.2em border-bottom: solid 2px $cream-dark + + +.owner-tiles + padding: 0 + +%one-line + font-size: 16px + font-weight: 400 + vertical-align: middle + margin: 0 + * + display: inline-block + font-size: inherit + font-weight: 400 + vertical-align: middle + margin: 0 + padding: 0 + line-height: 1 + +@mixin statusColors($color, $status) + &.#{$status} + background: linear-gradient(to right, $color 0%, $color 9px, transparent 10px, transparent 100%); + .build a, + .repo-title a + color: $color + &:hover + border-color: $color + .build-status + color: $color + + +.owner-tile + display: flex + flex-direction: row + flex-flow: space-between + align-items: baseline + height: 3.8em + padding: .8em 0 + margin-bottom: .5em + border: #F2F0F0 solid 1px + + a + text-decoration: none + &:hover + span + text-decoration: underline + .repo-title a:hover + text-decoration: underline + + .repo + @extend %one-line + width: grid-calc(4, 12) + margin-left: 2em + + .icon--job, + .icon-push, + .icon-pull_request, + .icon-calendar, + .icon-hash, + .icon-github + width: 1em + height: 1.1em + margin-right: .5em + background-repeat: no-repeat + background-size: 100% + + .icon--job + height: 1.2em + background-position-y: 0.2em + .icon-push + background-position-y: 0.4em + .build-status + text-transform: capitalize + + .build + @extend %one-line + width: grid-calc(2, 12) + + .branch + @extend %one-line + width: grid-calc(2, 12) + + .commit + @extend %one-line + width: grid-calc(2, 12) + + .duration + @extend %one-line + width: grid-calc(4, 12) + + @include statusColors($green-dark, 'passed') + @include statusColors($red-dark, 'failed') + @include statusColors($red-dark, 'errored') + @include statusColors($grey-medium, 'canceled') + @include statusColors(#ECCE4B, 'started') + @include statusColors(#ECCE4B, 'queued') + @include statusColors(#ECCE4B, 'booting') + @include statusColors(#ECCE4B, 'received') + @include statusColors(#ECCE4B, 'created') + + diff --git a/app/styles/app/modules/icons.sass b/app/styles/app/modules/icons.sass index 6a43244a..815086a7 100644 --- a/app/styles/app/modules/icons.sass +++ b/app/styles/app/modules/icons.sass @@ -10,7 +10,8 @@ @extend %icon .icon-cal, -.icon--cal +.icon--cal, +.icon-calendar background-image: inline-image('svg/finished-icon.svg') .icon-clock, @@ -83,9 +84,11 @@ .icon.pull_request background-image: inline-image('svg/pull-request-icon.svg') -.icon--grey.push +.icon--grey.push, +.icon-push background-image: inline-image('svg/icon-request-push.svg') -.icon--grey.pull_request +.icon--grey.pull_request, +.icon-pull_request background-image: inline-image('svg/icon-request-pull.svg') .icon-api, diff --git a/app/templates/components/owner-repo-tile.hbs b/app/templates/components/owner-repo-tile.hbs index 83719f0f..ef232f50 100644 --- a/app/templates/components/owner-repo-tile.hbs +++ b/app/templates/components/owner-repo-tile.hbs @@ -1,38 +1,34 @@ {{#if repo.private }}
{{/if}} -
- -
-
-

{{#link-to "repo" ownerName repoName }}{{repoName}}{{/link-to}}

-
-
- {{#if repo.default_branch.last_build}} -

- {{#link-to "build" ownerName repoName repo.default_branch.last_build.id}} - {{!-- {{repo.last_build.number}} {{repo.last_build.state}} --}} - {{repo.default_branch.last_build.number}} {{repo.default_branch.last_build.state}} - {{/link-to}}

- -
-
-

- - {{repo.default_branch.name}}

-

- {{format-sha repo.default_branch.last_build.commit.sha}}

-
-
-

- - {{format-duration repo.default_branch.last_build.duration}}

-

- - {{format-time repo.default_branch.last_build.finished_at}}

-
-
- {{else}} -

there is no build

- {{/if}} +
+ +

{{#link-to "repo" ownerName repoName }}{{repoName}}{{/link-to}}

+{{#if repo.default_branch.last_build}} +
+ {{#link-to "build" ownerName repoName repo.default_branch.last_build.id}} + + {{repo.default_branch.last_build.number}} + {{/link-to}} +
+
+ +

+ {{repo.default_branch.name}} +

+
+
+ + + {{format-sha repo.default_branch.last_build.commit.sha}} + +
+
+ + {{repo.default_branch.last_build.state}} + {{format-time repo.default_branch.last_build.finished_at}} +
+{{else}} +

there is no build

+{{/if}} diff --git a/app/templates/owner.hbs b/app/templates/owner.hbs index a5cc2479..b593deb4 100644 --- a/app/templates/owner.hbs +++ b/app/templates/owner.hbs @@ -10,13 +10,13 @@
- --}}