From fd885304f6fa517b7e6aeaa359a79b2b47a9242f Mon Sep 17 00:00:00 2001 From: Lisa P Date: Wed, 25 Nov 2015 17:20:06 +0100 Subject: [PATCH] remove old build header styles delete old job styles cleanup templates and prepare for jobs list --- app/components/jobs-item.coffee | 2 +- app/components/jobs-list.coffee | 4 + app/styles/app.scss | 4 +- app/styles/app/_mixins/mixins.sass | 26 ++-- app/styles/app/layouts/build-job.sass | 129 -------------------- app/styles/app/layouts/buildheader.sass | 152 ------------------------ app/styles/app/layouts/jobs.sass | 11 ++ app/templates/components/jobs-list.hbs | 8 +- 8 files changed, 33 insertions(+), 303 deletions(-) delete mode 100644 app/styles/app/layouts/build-job.sass delete mode 100644 app/styles/app/layouts/buildheader.sass create mode 100644 app/styles/app/layouts/jobs.sass diff --git a/app/components/jobs-item.coffee b/app/components/jobs-item.coffee index eb87dcfc..dfe687f0 100644 --- a/app/components/jobs-item.coffee +++ b/app/components/jobs-item.coffee @@ -5,7 +5,7 @@ JobsItemComponent = Ember.Component.extend tagName: 'li' classNameBindings: ['job.state'] - classNames: ['tile', 'tile--jobs', 'row'] + classNames: ['jobs-item'] isAnimating: (-> state = @get('job.state') diff --git a/app/components/jobs-list.coffee b/app/components/jobs-list.coffee index 65e26d5d..9ecf3b2b 100644 --- a/app/components/jobs-list.coffee +++ b/app/components/jobs-list.coffee @@ -1,6 +1,10 @@ `import Ember from 'ember'` JobsListComponent = Ember.Component.extend + + tagName: 'section' + classNames: ['jobs'] + jobTableId: Ember.computed(-> if @get('required') 'jobs' diff --git a/app/styles/app.scss b/app/styles/app.scss index 76d94260..fdf959ee 100644 --- a/app/styles/app.scss +++ b/app/styles/app.scss @@ -49,9 +49,6 @@ @import "app/layouts/dashboard"; @import "app/layouts/error"; @import "app/layouts/footer"; -// @import "app/layouts/buildheader"; -// @import "app/layouts/build-job"; -@import "app/layouts/sidebar"; @import "app/layouts/sidebar"; @import "app/layouts/profile"; @import "app/layouts/top"; @@ -59,6 +56,7 @@ @import "app/layouts/branches"; @import "app/layouts/broadcasts"; @import "app/layouts/repo"; +@import "app/layouts/jobs"; @import "app/layouts/requests"; @import "app/layouts/caches"; diff --git a/app/styles/app/_mixins/mixins.sass b/app/styles/app/_mixins/mixins.sass index 48374955..6a9def98 100644 --- a/app/styles/app/_mixins/mixins.sass +++ b/app/styles/app/_mixins/mixins.sass @@ -62,19 +62,19 @@ svg g > * fill: $color -@mixin colorTiles($color, $status, $extra-bg: $color) - &.#{$status} - border-color: $extra-bg - .tile-status - background-color: $color - .repo-header-title a, - .repo-build-status a, - .build-status a, - .tile-header, - .tile-header a, - .tile-title a - color: $color - @include colorStatusIcons($color, $status) +// @mixin colorTiles($color, $status, $extra-bg: $color) +// &.#{$status} +// border-color: $extra-bg +// .tile-status +// background-color: $color +// .repo-header-title a, +// .repo-build-status a, +// .build-status a, +// .tile-header, +// .tile-header a, +// .tile-title a +// color: $color +// @include colorStatusIcons($color, $status) @mixin statusColors($color, $status, $width, $color2: $color) &.#{$status} diff --git a/app/styles/app/layouts/build-job.sass b/app/styles/app/layouts/build-job.sass deleted file mode 100644 index 8d431a02..00000000 --- a/app/styles/app/layouts/build-job.sass +++ /dev/null @@ -1,129 +0,0 @@ - -@mixin colorJobs($color, $color-bg) - .job-id - color: $color - &:hover - background-color: $color-bg - .job-anchor, - .job-env, - .job-lang - background-color: $color-bg - .job-env - &:after - content: none - .job-anchor, - .job-lang - &:after - @include fadeOut(right, -90deg, $color-bg) - -.job-anchor - position: relative - -.build-title - .icon--question - width: 1.3em; - height: 1.3em; - transform: translate(0.3em, 0.2em); - cursor: pointer - -// job matrix -.tile--jobs - @extend .tile--xs - font-size: $font-size-sm - padding-left: 3.5rem - p - white-space: normal - a - color: $grey-medium - .tile-status--job - width: 2em - - .svg-booting - margin: 0.7em 0.3em - - .jobs-item - padding: .1em 0 - .icon - height: 1.2em - margin-right: .1em - .job-os .icon - height: 1.3em - .icon--lang - height: 1em - width: 1.4em - .icon--env - width: 1.1em - .icon.api - height: 1.5em - - @media #{$medium-up} - height: 36px - p - white-space: nowrap - .icon--lang, - .icon--env - margin-right: .4em - .jobs-item - position: relative - float: left - white-space: nowrap - padding: 0 - overflow: hidden - .job-id - width: grid-calc(3, 24) - border-right: solid 1px $cream-dark - .job-os - width: grid-calc(1, 24) - text-align: center - .job-lang - width: grid-calc(6, 24) - &:after - @include fadeOut(right, -90deg, $cream-light) - .job-anchor - width: grid-calc(14, 24) - &:after - @include fadeOut(right, -90deg, $cream-light) - z-index: 999 - .job-env - min-width: grid-calc(16, 24) - width: grid-calc(16, 24) - &:after - @include fadeOut(right, -90deg, $cream-light) - &:hover - position: absolute - width: auto - padding-right: 1em - z-index: 88 - .job-duration - width: grid-calc(8, 24) - max-width: 165px - float: right - - @media #{$xlarge-up} - .job-id - width: grid-calc(2, 24) - .job-os - margin: 0 1em - .job-lang - width: grid-calc(4, 24) - margin-right: 2em - - &.failed, - &.errored - @include colorJobs($fail-color, #fbebe6) - &.passed - @include colorJobs($pass-color, #e5efe4) - &.canceled - @include colorJobs($cancel-color, #e5e5e5) - &.started, - &.created, - &.received, - &.queued - @include colorJobs($created-color, #f4efd8) - -.is-empty - opacity: .5 - -.jobs-list - @include resetul - diff --git a/app/styles/app/layouts/buildheader.sass b/app/styles/app/layouts/buildheader.sass deleted file mode 100644 index 421ccc42..00000000 --- a/app/styles/app/layouts/buildheader.sass +++ /dev/null @@ -1,152 +0,0 @@ - -.repo - font-size: $font-size-m - color: $grey-medium - -.repo-header - header - margin: .5rem 0 2.6rem - > * - vertical-align: middle - -.repo-header-title - @extend %inline-block - margin: 0 - font-weight: 400 - font-size: 35px - line-height: 1 - a - color: $grey-dark - &:hover - text-decoration: underline - -.repo-header-icons - line-height: 1 - vertical-align: middle - a - @extend %inline-block - height: 1.7em - margin-left: .7em - .icon - width: 1.5em - height: 100% - position: relative - top: 0.65em - - @media #{$medium-up} - @extend %inline-block - -.repo-menus - @media #{$medium-up} - .dropdown - position: absolute - top: -0.8em - right: 0 - z-index: 50 - .tabnav - position: absolute - top: -0.4em - .repo-menu-header - position: relative - height: 1.6em - margin-bottom: 1em - border-bottom: solid $cream-dark 2px - -.repo-main - .button--showmore - margin-top: 2em - .build-title - margin-top: 2.5rem - font-size: $font-size-sm - font-weight: 400 - & span:hover + .tooltip - display: block - -.repo-main-commit - position: relative - padding-bottom: 0.5em - font-weight: 400 - color: $grey-dark - &, - small - margin: 0 - font-size: $font-size-m - line-height: 1 - small - margin-right: .3em - font-weight: 600 - @media #{$medium-up} - white-space: nowrap - overflow: hidden - &:after - @include fadeOut(right, -90deg, $cream-light) - -.repo-main-description - p - margin: 0 - @media #{$medium-up} - position: relative - height: 4.9em - overflow: hidden - &:after - @include fadeOut(bottom, 0deg, $cream-light) - - .body - display: block - font-size: 13px - font-family: Monaco, monospace - margin-top: 0.6em - overflow: hidden - word-break: break-word - white-space: pre-wrap - -.repo-main-info - @include resetul - position: relative - padding-right: 2em - margin-right: 1.4em - border-right: $cream-dark 1px solid - line-height: $line-height-m - overflow: hidden - &:after - @include fadeOut(right, -90deg, $cream-light) - white-space: nowrap - &:hover - text-decoration: underline - li - white-space: nowrap - -.repo-main-tools - position: absolute - top: 0 - bottom: 0 - right: 0 - a - display: block - margin-bottom: .5em - background-color: $grey-lighter - line-height: 24px - &:hover - background-color: darken($grey-medium, 10) - .icon--trigger - width: 15px - height: 19px - margin-left: 6px - .icon--cancel - width: 16px - height: 16px - margin-left: 6px - .icon--codeclimate - width: 1.2em - height: 1.1em - margin-left: 4px - -.build-os.linux - text-transform: capitalize -.build-os.osx - text-transform: uppercase - -.build-list - padding: 0 - margin: 0 - diff --git a/app/styles/app/layouts/jobs.sass b/app/styles/app/layouts/jobs.sass new file mode 100644 index 00000000..bd78f197 --- /dev/null +++ b/app/styles/app/layouts/jobs.sass @@ -0,0 +1,11 @@ +.jobs + + +.jobs-list + + +.section-title + font-size: 16px + color: $grey + font-weight: 400 + margin: 3rem 0 1rem \ No newline at end of file diff --git a/app/templates/components/jobs-list.hbs b/app/templates/components/jobs-list.hbs index aa686c43..80b77179 100644 --- a/app/templates/components/jobs-list.hbs +++ b/app/templates/components/jobs-list.hbs @@ -1,12 +1,11 @@ {{#if jobs.length}} -
{{#if required}} -

Build Jobs

+

Build Jobs

{{else}} -

Allowed Failures +

Allowed Failures
- +

These are jobs you can allow to fail
without failing your entire build

@@ -17,5 +16,4 @@ {{jobs-item job=job repo=repo}} {{/each}} -
{{/if}}