From d8f2758e3171e1169caf8106bb3ce3c8624c27ba Mon Sep 17 00:00:00 2001 From: Lisa Passing Date: Tue, 11 Aug 2015 16:00:25 +0200 Subject: [PATCH 01/15] new ownerpage style --- app/components/owner-repo-tile.coffee | 2 +- app/styles/app/layouts/owner.sass | 155 ++++++++++++------- app/styles/app/modules/icons.sass | 9 +- app/templates/components/owner-repo-tile.hbs | 64 ++++---- app/templates/owner.hbs | 6 +- 5 files changed, 141 insertions(+), 95 deletions(-) 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 @@
- --}}
From 0cea3d43a6aa35838258e75b5e470a8980bb0102 Mon Sep 17 00:00:00 2001 From: Lisa Passing Date: Tue, 11 Aug 2015 16:51:18 +0200 Subject: [PATCH 02/15] add responsive styles to owner page list --- app/styles/app/layouts/owner.sass | 50 ++++++++++++++++++++----------- 1 file changed, 32 insertions(+), 18 deletions(-) diff --git a/app/styles/app/layouts/owner.sass b/app/styles/app/layouts/owner.sass index 2669068d..7e6a7c63 100644 --- a/app/styles/app/layouts/owner.sass +++ b/app/styles/app/layouts/owner.sass @@ -79,12 +79,14 @@ .owner-tiles padding: 0 + list-style-type: none %one-line font-size: 16px font-weight: 400 vertical-align: middle margin: 0 + display: inline-block * display: inline-block font-size: inherit @@ -107,12 +109,7 @@ .owner-tile - display: flex - flex-direction: row - flex-flow: space-between - align-items: baseline - height: 3.8em - padding: .8em 0 + padding: .8em 0 .8em 2em margin-bottom: .5em border: #F2F0F0 solid 1px @@ -124,11 +121,6 @@ .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, @@ -149,21 +141,43 @@ .build-status text-transform: capitalize + .repo + @extend %one-line + white-space: nowrap + width: grid-calc(9, 12) .build @extend %one-line - width: grid-calc(2, 12) - + width: grid-calc(5, 12) .branch @extend %one-line - width: grid-calc(2, 12) - + width: grid-calc(6, 12) .commit @extend %one-line - width: grid-calc(2, 12) - + width: grid-calc(6, 12) .duration @extend %one-line - width: grid-calc(4, 12) + width: grid-calc(12, 12) + + @media #{$medium-up} + display: flex + flex-direction: row + flex-flow: space-between + align-items: baseline + height: 3.8em + padding: .8em 0 + + .build + width: grid-calc(2, 12) + .branch + width: grid-calc(2, 12) + .commit + width: grid-calc(2, 12) + .duration + width: grid-calc(4, 12) + .repo + width: grid-calc(4, 12) + margin-left: 2em + @include statusColors($green-dark, 'passed') @include statusColors($red-dark, 'failed') From 351cb909b637326ba59e7ecde23adbe1fe91d6d3 Mon Sep 17 00:00:00 2001 From: Lisa Passing Date: Tue, 11 Aug 2015 17:13:32 +0200 Subject: [PATCH 03/15] add backgroundcolor to owner avatar in case we get transparent bg avatars --- app/styles/app/layouts/owner.sass | 1 + 1 file changed, 1 insertion(+) diff --git a/app/styles/app/layouts/owner.sass b/app/styles/app/layouts/owner.sass index 7e6a7c63..b2959c3b 100644 --- a/app/styles/app/layouts/owner.sass +++ b/app/styles/app/layouts/owner.sass @@ -23,6 +23,7 @@ text-decoration: underline img border-radius: 50% + background-color: #F4F3ED .sync-button margin-top: .8rem From 98d9476b7a72322e443f45f94a52c967584dcbe1 Mon Sep 17 00:00:00 2001 From: Lisa Passing Date: Wed, 12 Aug 2015 10:54:59 +0200 Subject: [PATCH 04/15] link from repo header to ownerpage --- app/templates/repo.hbs | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/templates/repo.hbs b/app/templates/repo.hbs index 02a9db1c..5181146e 100644 --- a/app/templates/repo.hbs +++ b/app/templates/repo.hbs @@ -7,7 +7,7 @@ {{#if repo.isLoaded}}
-

{{#link-to "repo" repo}}{{repo.slug}}{{/link-to}}

+

{{#link-to "owner" repo.owner}}{{repo.owner}}{{/link-to}}/{{#link-to "repo" repo}}{{repo.name}}{{/link-to}}

From 5736dbfe4b3e952bc5323a75e8f872994832ea70 Mon Sep 17 00:00:00 2001 From: Lisa Passing Date: Wed, 12 Aug 2015 10:56:18 +0200 Subject: [PATCH 05/15] add more space --- app/templates/repo.hbs | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/templates/repo.hbs b/app/templates/repo.hbs index 5181146e..c8ba1ad3 100644 --- a/app/templates/repo.hbs +++ b/app/templates/repo.hbs @@ -7,7 +7,7 @@ {{#if repo.isLoaded}}
-

{{#link-to "owner" repo.owner}}{{repo.owner}}{{/link-to}}/{{#link-to "repo" repo}}{{repo.name}}{{/link-to}}

+

{{#link-to "owner" repo.owner}}{{repo.owner}}{{/link-to}} / {{#link-to "repo" repo}}{{repo.name}}{{/link-to}}

From bc1db07901808b1e8ac9bf795ab4ea6bb1ff0583 Mon Sep 17 00:00:00 2001 From: Lisa Passing Date: Wed, 12 Aug 2015 11:11:28 +0200 Subject: [PATCH 06/15] fix duplicate owner name in document title on ownerpage --- app/routes/owner.coffee | 3 --- 1 file changed, 3 deletions(-) diff --git a/app/routes/owner.coffee b/app/routes/owner.coffee index dc247146..d7c6ea4f 100644 --- a/app/routes/owner.coffee +++ b/app/routes/owner.coffee @@ -9,9 +9,6 @@ Route = TravisRoute.extend deactivate: -> @controllerFor('loading').set('layoutName', null) - titleToken: (model) -> - "#{model.name}" - model: (params) -> $.get(config.apiEndpoint + "/v3/owner/#{params.owner}") From 7e68915ede0ee1d902f0d86c98756f745a352613 Mon Sep 17 00:00:00 2001 From: Lisa P Date: Wed, 12 Aug 2015 15:58:55 +0200 Subject: [PATCH 07/15] disable /:owner/running route for now --- app/router.coffee | 2 +- app/templates/owner/repositories.hbs | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/app/router.coffee b/app/router.coffee index 2e8c93c2..8808ad21 100644 --- a/app/router.coffee +++ b/app/router.coffee @@ -73,7 +73,7 @@ Router.map -> @resource 'owner', path: '/:owner', -> @route 'repositories', path: '/' - @route 'running', path: '/running' + # @route 'running', path: '/running' @route 'error404', path: '/*path' diff --git a/app/templates/owner/repositories.hbs b/app/templates/owner/repositories.hbs index 82d8a85e..e8ecf3d2 100644 --- a/app/templates/owner/repositories.hbs +++ b/app/templates/owner/repositories.hbs @@ -2,6 +2,6 @@ {{#each repo in repos}} {{owner-repo-tile repo=repo}} {{else}} -
  • No active repos
    • + {{no-repos}} {{/each}} From 6de92f20d9518955508515b67b7060b8ae49c277 Mon Sep 17 00:00:00 2001 From: Lisa P Date: Wed, 12 Aug 2015 15:59:32 +0200 Subject: [PATCH 08/15] add component for no repositories notice --- app/components/no-repos.coffee | 5 +++++ app/templates/components/no-repos.hbs | 9 +++++++++ 2 files changed, 14 insertions(+) create mode 100644 app/components/no-repos.coffee create mode 100644 app/templates/components/no-repos.hbs diff --git a/app/components/no-repos.coffee b/app/components/no-repos.coffee new file mode 100644 index 00000000..92130ae7 --- /dev/null +++ b/app/components/no-repos.coffee @@ -0,0 +1,5 @@ +`import Ember from 'ember'` + +NoReposComponent = Ember.Component.extend() + +`export default NoReposComponent` diff --git a/app/templates/components/no-repos.hbs b/app/templates/components/no-repos.hbs new file mode 100644 index 00000000..7ca860b0 --- /dev/null +++ b/app/templates/components/no-repos.hbs @@ -0,0 +1,9 @@ +
    +
    + +
    + +

    No active repositories could be found

    +

    Want to start testing this project on Travis CI?

    +     Read the Docs on Getting Started +
    From 073fd3feac935b6c0fd8392eb3f39aa5847bae3a Mon Sep 17 00:00:00 2001 From: Lisa P Date: Thu, 13 Aug 2015 14:59:04 +0200 Subject: [PATCH 09/15] slightly tweak copy on no-repos --- app/templates/components/no-repos.hbs | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/templates/components/no-repos.hbs b/app/templates/components/no-repos.hbs index 7ca860b0..d484c40f 100644 --- a/app/templates/components/no-repos.hbs +++ b/app/templates/components/no-repos.hbs @@ -4,6 +4,6 @@

    No active repositories could be found

    -

    Want to start testing this project on Travis CI?

    +

    Want to start testing your projects on Travis CI?

    Read the Docs on Getting Started
    From 8341b2c1cd33802c0addc35b7dcbfe05ab3a3ce6 Mon Sep 17 00:00:00 2001 From: Lisa P Date: Fri, 14 Aug 2015 14:45:27 +0200 Subject: [PATCH 10/15] fix some crossbrowser inconsistencies --- app/styles/app/layouts/owner.sass | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/app/styles/app/layouts/owner.sass b/app/styles/app/layouts/owner.sass index b2959c3b..2c81884c 100644 --- a/app/styles/app/layouts/owner.sass +++ b/app/styles/app/layouts/owner.sass @@ -99,7 +99,7 @@ @mixin statusColors($color, $status) &.#{$status} - background: linear-gradient(to right, $color 0%, $color 9px, transparent 10px, transparent 100%); + background: linear-gradient(to right, $color 0%, $color 9px, transparent 10px, transparent 100%) no-repeat; .build a, .repo-title a color: $color @@ -135,10 +135,10 @@ background-size: 100% .icon--job - height: 1.2em - background-position-y: 0.2em + height: 1em + margin-top: .1em .icon-push - background-position-y: 0.4em + margin-top: .6em .build-status text-transform: capitalize From 1233890a5a460730ff6302a86e7094af1fa1e787 Mon Sep 17 00:00:00 2001 From: Lisa P Date: Fri, 14 Aug 2015 14:47:10 +0200 Subject: [PATCH 11/15] remove more unused styles --- app/styles/app.scss | 4 - app/styles/app/components/travis-switch.sass | 62 ---- app/styles/app/main/sponsors.sass | 5 - app/styles/app/pro.sass | 169 ---------- app/styles/app/settings.sass | 306 ------------------- 5 files changed, 546 deletions(-) delete mode 100644 app/styles/app/components/travis-switch.sass delete mode 100644 app/styles/app/main/sponsors.sass delete mode 100644 app/styles/app/pro.sass delete mode 100644 app/styles/app/settings.sass diff --git a/app/styles/app.scss b/app/styles/app.scss index 21280bee..108cc3d8 100644 --- a/app/styles/app.scss +++ b/app/styles/app.scss @@ -16,13 +16,9 @@ @import "app/main/list"; @import "app/main/log"; -// @import "app/main/sponsors"; @import "app/misc"; @import "app/popup"; -// @import "app/pro"; -// @import "app/settings"; -// @import "app/components/travis-switch"; @import "app/components/sync-button"; @import "app/components/loading-indicator"; diff --git a/app/styles/app/components/travis-switch.sass b/app/styles/app/components/travis-switch.sass deleted file mode 100644 index c78f814f..00000000 --- a/app/styles/app/components/travis-switch.sass +++ /dev/null @@ -1,62 +0,0 @@ -.settings-row - margin-top: 20px - -.settings-row, -.short-settings-element - & > * - box-sizing: content-box - -a.travis-switch - margin: 0 10px 0 0 - -p.settings-row - line-height: 30px - -.travis-switch - box-sizing: content-box - position: relative - display: inline-block - float: left - width: 5em - height: 1.45em - margin: 20px 0 50px 0 - padding: 0.42em 1.5em - background-color: #F5F5F5 - border: 1px solid #E3E1E1 - border-radius: 4px - line-height: 1.58em - font-size: 12px - color: #999999 - cursor: pointer - text-align: right - &:before - content: "" - position: absolute - top: 2px - left: 2px - width: 3.5em - height: 1.9em - background: #e9e9e7 - border: 1px solid #d7d4d4 - border-radius: 2px - -.travis-switch.active - background-color: #607A83 - border-radius: 4px - color: #ffffff - font-weight: 600 - text-align: left - &:before - left: auto - right: 2px - border: 1px solid #9cafb5 - -span.on - background-color: #607A83 - color: #fff - font-weight: 800 - border-radius: 3px - float: left - -span.off - float: right diff --git a/app/styles/app/main/sponsors.sass b/app/styles/app/main/sponsors.sass deleted file mode 100644 index e5c79998..00000000 --- a/app/styles/app/main/sponsors.sass +++ /dev/null @@ -1,5 +0,0 @@ -#main - .sponsor - // float: left - margin-top: 0 - color: #999 diff --git a/app/styles/app/pro.sass b/app/styles/app/pro.sass deleted file mode 100644 index 6314675f..00000000 --- a/app/styles/app/pro.sass +++ /dev/null @@ -1,169 +0,0 @@ - -.pro - #log-container - padding-bottom: 1.2em - - .tip - a - text-decoration: underline - p - margin-top: 12px - margin-bottom: 0px - - #top - li.stats - display: none - - // .profile - // margin-right: 5px - - .legal - min-width: 110px - ul - margin-left: -20px - a - padding: 5px 35px - - #github - display: none - - &#home #main - padding-right: 30px - - #repository .github-stats - display: none - - #empty - font-size: $font-size-big - - h2 - margin-bottom: 37px - - ul - list-style-type: disc - padding-left: 18px - - a - text-decoration: underline - - .sponsor - display: none - - &#profile #main - .tabs .right - float: right - .tabs #tab_billing - margin-right: 0 - - .activate, - .activated - position: absolute - display: block - right: 0 - margin: -54px 30px 0 0 - padding-right: 25px - - &:before - content: "" - position: absolute - top: 5px - right: 7px - width: 12px - height: 12px - - .activate:before - background: inline-image('ui/activate.png') no-repeat 0 0 - background-position: 0px 5px - height: 100% - - .activate:hover:before, - .activate:focus:before, - .activate:active:before - background-position: -12px 5px - - .activated - background: #44a057 - border: 0 - color: white - - .activated:before - background: url(/images/ui/activated.png) no-repeat 0 0 - - #running-jobs - .jobs - margin: 5px 0 5px - .job - list-style-type: disc - list-style-position: inside - .slug - max-width: 150px - overflow: hidden - white-space: nowrap - text-overflow: ellipsis - display: inline-block - display: -moz-inline-stack - .group a - cursor: pointer - - #right - padding-top: 13px - padding-right: 20px - padding-left: 20px - color: $color-link - h4 - margin: 24px 0 0 - ul - @include resetul - margin-top: 10px - li - word-wrap: break-word - - .box - margin-top: 25px - margin-left: -3px - padding: 15px - border: 1px solid #e0e0e0 - background-color: $color-bg-sidebar-box - - h4 - margin: 0 - a - text-decoration: underline - li - list-style-type: square - margin-left: 15px - - #queues - ul - margin: 5px 0 5px - - - #slider - position: absolute - height: 99% - top: 12px - left: 0 - width: 10px - background-color: $color-bg-slider - cursor: pointer - background: transparent url(/images/ui/slider-closed.png) no-repeat 3px 38px - border-top-left-radius: 4px - - &:hover - background-color: $color-border-slider-hover - - #right .show-more-jobs - text-decoration: underline - cursor: pointer - - #right - background-color: $right-bg - border-left: 1px solid $color-border-normal - - #settings li.env-var span.name - width: 210px - - #settings li.env-var span.value - max-width: 265px - #settings - min-width: 675px diff --git a/app/styles/app/settings.sass b/app/styles/app/settings.sass deleted file mode 100644 index bea3d151..00000000 --- a/app/styles/app/settings.sass +++ /dev/null @@ -1,306 +0,0 @@ -#settings - ul - @include resetul - - .settings-form - margin: 30px 0 30px 0 - - p.short-settings-element - display: inline-block - vertical-align: middle - margin: 0 10px 0 0 - float: left - - label - line-height: 30px - - input - display: inline-block - float: left - width: 60px - height: 18px - padding: 5px 18px 5px 18px - background-color: #F5F5F5 - border: 1px solid #E3E1E1 - border-radius: 4px - line-height: 19px - font-size: 11px - color: #999999 - text-align: center - - .field.invalid - input, textarea - border-width: 1px - border-color: #ffb6c1 - background: rgb(252, 227, 230) - - form.env-var, form.ssh-key - margin-top: 20px - - .field - padding-bottom: 10px - clear: left - @media screen and (min-width: 47em) - clear: none - .field:after - visibility: hidden - display: block - font-size: 0 - content: " " - clear: both - height: 0 - - .travis-switch - display: block - - label - display: inline-block - - form.env-var - label - width: 40px - label.value - width: auto - line-height: 1.9em - .travis-switch.value - font-size: 10px - form.ssh-key - span.error - display: block - margin-left: 76px - label - width: 73px - label.value - float: left - textarea - margin-left: 3px - width: 580px - height: 250px - display: inline-block - padding: 0 5px 0 5px - background-color: #fff - border: 1px solid #ddd - line-height: 17px - font-size: 13px - color: #999999 - text-align: left - - span.error - display: inline-block - margin-left: 10px - color: #a80000 - - .env-var input[type=submit].saving, .ssh-key input[type=submit].saving, - .env-var .delete-var.deleting, .delete-ssh-key.deleting - background-color: #bbb - background-image: inline-image('ui/round-spinner.svg') - background-repeat: no-repeat - background-position: center - background-size: 20px - text-indent: -9999px - - .env-var-name - span - font-size: 18px - font-weight: 600 - color: #5e6872 - - span.value.value-display - font-size: 14px - background-color: #efefdf - border-radius: 4px - padding: 0 10px 0 10px - color: #838b8c - font-family: monospace - - span.value.value-display.secure - background-image: inline-image('ui/secure.png') - background-position: 8px center - background-repeat: no-repeat - background-size: 0.5em - padding-left: 26px - - .add-env-var, .add-ssh-key - color: $white - background-color: #97a3aa - border-radius: 4px - padding: 8px 12px 8px 12px - margin-bottom: 20px - font-size: 13px - line-height: 55px - cursor: pointer - - .add-env-var:hover, .add-ssh-key:hover - background-color: #7c878d - - input - display: inline-block - width: 260px - height: 20px - padding: 0 5px 0 5px - background-color: #fff - border: 1px solid #ddd - line-height: 17px - font-size: 13px - color: #999999 - text-align: left - - form.env-var .actions - margin-bottom: 35px - - input.submit-env-var, input.submit-ssh-key - color: #ffffff - background-color: #7ea35a - border-radius: 4px - font-size: 13px - width: 60px - height: 32px - text-align: center - margin: 10px 6px 0 0 - cursor: pointer - - .submit-env-var:hover, .submit-ssh-key:hover - background-color: #6f924f - - .cancel-env-var, .cancel-ssh-key - margin-left: 3px - - .cancel-env-var:hover, .cancel-ssh-key:hover - text-decoration: underline - - input[type="checkbox"] - display: inline-block - vertical-align: middle - - .edit-var - display: inline-block - margin: 6px 10px 7px 0 - color: #ffffff - background-color: #bcbcbb - border-radius: 4px - padding: 4px 15px 4px 15px - font-size: 13px - cursor: pointer - - .edit-var:hover - background-color: #a4a5a4 - - .delete-var, .delete-ssh-key - display: inline-block - margin: 6px 0 7px 0 - color: #ffffff - background-color: #932828 - border-radius: 4px - padding: 4px 15px 4px 15px - font-size: 13px - cursor: pointer - - .delete-var:hover, .delete-ssh-key:hover - background-color: #820b0b - - form.env-var - width: 100% - margin-top: 20px - margin-bottom: 30px - border-bottom: 1px solid #f1f1f1 - - span.error - margin-left: 0 - display: none - - &.show - display: inline-block - - label.name, label.value - display: none - - label.public - width: 80% - - .field.name, .field.value - float: left - padding-bottom: 0 - min-height: 33px - line-height: 2 - - span.equals - float: left - display: block - line-height: 2 - margin: 0 10px 0 14px - - .field.name - margin-bottom: 10px - input - width: 97% - .field.value - width: 45% - input - width: 97% - .actions - margin-bottom: 10px - clear: both - - ul.env-vars - display: block - li.env-var - margin: 10px 40px 0 0 - padding-bottom: 10px - overflow: auto - border-bottom: 1px solid #F1F1F1 - width: 100% - - form.env-var - margin-bottom: 6px - border-bottom: none - - .var - font-size: 13px - display: inline-block - margin-right: 10px - - .row - .label - display: inline-block - border: 1px solid #ddd - font-size: 13px - margin-top: 4px - height: 20px - - .name, - .value - line-height: 20px - position: relative - font-size: 15px - - .equals - margin: 0 10px 0 14px - - .name - width: 250px - text-align: left - - .value - display: block - width: auto - text-align: left - max-width: 390px - min-height: 25px - padding: 7px 12px 3px - - @media #{$medium-up} - .value, - .name - display: inline-block - vertical-align: middle - - .field--switch - display: inline-block - vertical-align: middle - label.public - width: auto - line-height: 1.8 - - .value--extra - padding: 0 !important - width: 250px !important From fa27fae5242aa91252f2501384e0209c14c9a907 Mon Sep 17 00:00:00 2001 From: Lisa P Date: Fri, 14 Aug 2015 14:53:00 +0200 Subject: [PATCH 12/15] remove even more styles --- app/styles/app.scss | 1 - app/styles/app/main/list.sass | 47 ----------------------------------- 2 files changed, 48 deletions(-) delete mode 100644 app/styles/app/main/list.sass diff --git a/app/styles/app.scss b/app/styles/app.scss index 108cc3d8..78f30913 100644 --- a/app/styles/app.scss +++ b/app/styles/app.scss @@ -14,7 +14,6 @@ @import "app/main/annotations"; @import "app/userlike"; -@import "app/main/list"; @import "app/main/log"; @import "app/misc"; @import "app/popup"; diff --git a/app/styles/app/main/list.sass b/app/styles/app/main/list.sass deleted file mode 100644 index e01b9831..00000000 --- a/app/styles/app/main/list.sass +++ /dev/null @@ -1,47 +0,0 @@ - -table.list - width: 100% - margin: 25px 0 0 12px - border-spacing: 0 - - a - text-decoration: underline - - caption - margin-bottom: 8px - text-align: left - color: $color-text - font-size: $font-size-big - font-weight: bold - - td, th - text-align: left - font-size: $font-size-small - padding: 5px 20px 5px 0 - vertical-align: top - - tr - max-height: 20px - - th - font-size: 13px - color: $color-text - white-space: nowrap - border-bottom: 2px solid white - - td - white-space: nowrap - border-bottom: 2px solid white - &.message - overflow: hidden - text-overflow: ellipsis - white-space: normal - - td:first-child - border-left-radius: 4px - - td:last-child - border-right-radius: 4px - - tr.message, td.message - width: 100% From 11b5e2f024c6d3a99638d9d312ef773df279961e Mon Sep 17 00:00:00 2001 From: Lisa P Date: Mon, 17 Aug 2015 11:32:22 +0200 Subject: [PATCH 13/15] add animated booting state icon to ownerpage --- app/components/owner-repo-tile.coffee | 9 +++++++++ app/styles/app/modules/icons.sass | 7 +++++++ app/templates/components/owner-repo-tile.hbs | 6 +++++- 3 files changed, 21 insertions(+), 1 deletion(-) diff --git a/app/components/owner-repo-tile.coffee b/app/components/owner-repo-tile.coffee index db65e286..1f491361 100644 --- a/app/components/owner-repo-tile.coffee +++ b/app/components/owner-repo-tile.coffee @@ -14,6 +14,15 @@ OwnerRepoTileComponent = Ember.Component.extend @get('repo.slug').split(/\//)[1] ).property('repo.slug') + isAnimating: (-> + state = @get('repo.default_branch.last_build.state') + animationStates = ['received', 'queued', 'started', 'booting'] + + unless animationStates.indexOf(state) == -1 + true + + ).property('repo.default_branch.last_build.state') + diff --git a/app/styles/app/modules/icons.sass b/app/styles/app/modules/icons.sass index 815086a7..6534f042 100644 --- a/app/styles/app/modules/icons.sass +++ b/app/styles/app/modules/icons.sass @@ -228,6 +228,13 @@ i:nth-of-type(3) animation-delay: 0.7s +.icon-owner-receiving + @extend .icon-receiving + margin-right: 0.5em !important + i + width: 5px + height: 5px + background-color: #ECCE4B @keyframes bubbleScale 0%, 80%, 100% diff --git a/app/templates/components/owner-repo-tile.hbs b/app/templates/components/owner-repo-tile.hbs index ef232f50..a9cb5749 100644 --- a/app/templates/components/owner-repo-tile.hbs +++ b/app/templates/components/owner-repo-tile.hbs @@ -2,7 +2,11 @@
    {{/if}}
    - + {{#if isAnimating}} + + {{else}} + + {{/if}}

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

    {{#if repo.default_branch.last_build}} From 3d1cbdd1d8c460d6124540af398372ac0ac2d0a5 Mon Sep 17 00:00:00 2001 From: Lisa P Date: Mon, 17 Aug 2015 16:26:38 +0200 Subject: [PATCH 14/15] add tractor illustration --- app/templates/components/no-repos.hbs | 56 ++++++++++++++++++++++++++- 1 file changed, 55 insertions(+), 1 deletion(-) diff --git a/app/templates/components/no-repos.hbs b/app/templates/components/no-repos.hbs index d484c40f..3f2d0657 100644 --- a/app/templates/components/no-repos.hbs +++ b/app/templates/components/no-repos.hbs @@ -1,6 +1,60 @@
    - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

    No active repositories could be found

    From 144c3cd4f8b5711f0bbf95d1525034a2c58c5267 Mon Sep 17 00:00:00 2001 From: Lisa P Date: Mon, 17 Aug 2015 17:34:54 +0200 Subject: [PATCH 15/15] omg add, little animation --- app/styles/app.scss | 2 ++ app/styles/app/animation/tractor.sass | 19 +++++++++++++++++++ app/templates/components/no-repos.hbs | 2 +- 3 files changed, 22 insertions(+), 1 deletion(-) create mode 100644 app/styles/app/animation/tractor.sass diff --git a/app/styles/app.scss b/app/styles/app.scss index 78f30913..1a38e665 100644 --- a/app/styles/app.scss +++ b/app/styles/app.scss @@ -21,6 +21,8 @@ @import "app/components/sync-button"; @import "app/components/loading-indicator"; +@import "app/animation/tractor"; + @import "app/modules/section"; @import "app/modules/loader"; @import "app/modules/tiles"; diff --git a/app/styles/app/animation/tractor.sass b/app/styles/app/animation/tractor.sass new file mode 100644 index 00000000..3b072feb --- /dev/null +++ b/app/styles/app/animation/tractor.sass @@ -0,0 +1,19 @@ +.tractor + @media #{$medium-up} + width: 258px + height: 188px +.tractor-arm + @media #{$medium-up} + width: 90px + height: 71px + transform-origin: 89px 70px + animation: armMovement 1.5s 1 ease + +@keyframes armMovement + 0%, + 100% + transform: rotateZ(0) + 40% + transform: rotateZ(-20deg) + 70% + transform: rotateZ(10deg) \ No newline at end of file diff --git a/app/templates/components/no-repos.hbs b/app/templates/components/no-repos.hbs index 3f2d0657..cbed3683 100644 --- a/app/templates/components/no-repos.hbs +++ b/app/templates/components/no-repos.hbs @@ -43,7 +43,7 @@ c2.3,0,4.5-0.8,6.1-2.2c0.9-1.5,1.4-3.2,1.4-5.1C70,118.4,65.5,113.9,60.1,113.9z"/> - +