start rewriting tooltips

remove some whitespace

app/app.js

@@ -27,21 +27,6 @@ var App = Ember.Application.extend(Ember.Evented, {
     return Travis.lookup('controller:flash').loadFlashes([options]);
   },
 
-  toggleSidebar() {
-    var element;
-    $('body').toggleClass('maximized');
-    element = $('<span></span>');
-    $('#top .profile').append(element);
-    Ember.run.later((function() {
-      return element.remove();
-    }), 10);
-    element = $('<span></span>');
-    $('#repo').append(element);
-    return Ember.run.later((function() {
-      return element.remove();
-    }), 10);
-  },
-
   ready() {
     if (location.hash.slice(0, 2) === '#!') {
       location.href = location.href.replace('#!/', '');

app/components/dashboard-row.js

@@ -5,7 +5,7 @@ import { hasAdminPermission, hasPushPermission } from 'travis/utils/permission';
 
 export default Ember.Component.extend({
   tagName: 'li',
-  classNameBindings: ['repo.default_branch.last_build.state'],
+  classNameBindings: ['repo.default_branch.last_build.state', 'repo.active:is-active'],
   classNames: ['rows', 'rows--dashboard'],
   isLoading: false,
   isTriggering: false,

app/controllers/dashboard/repositories.js

@@ -28,6 +28,7 @@ export default Ember.Controller.extend({
         return item.slug.match(new RegExp(filter));
       });
     }
+    this.inactive();
   }.property('filter', 'model', 'org'),
 
   updateFilter() {

app/controllers/top.js

@@ -11,6 +11,8 @@ export default Ember.Controller.extend({
     return this.get('user.name') || this.get('user.login');
   }.property('user.login', 'user.name'),
 
+  isDashboard: false,
+
   defineTowerColor(broadcastArray) {
     if (!broadcastArray) {
       return '';
@@ -68,6 +70,12 @@ export default Ember.Controller.extend({
   }.property('broadcasts'),
 
   actions: {
+
+    cheatcode() {
+      $('body').toggleClass('cheatcode');
+      this.toggleProperty('isDashboard');
+    },
+
     toggleBurgerMenu() {
       this.toggleProperty('is-open');
       return false;

app/styles/app/layout.sass

@@ -2,6 +2,9 @@
   .row
     max-width: 1024px
 
+  .footer
+    margin-top: 5rem
+
   .main
     margin: auto
     max-width: 1024px
@@ -49,7 +52,6 @@
     margin-bottom: -99999px
     padding-bottom: 100034px
 
-
 @media #{$large-up}
 
   #left, .wrapper-main
@@ -92,3 +94,24 @@
   .non-centered .wrapper-main
     width: grid-calc(31, 36)
     margin-left: grid-calc(5, 36)
+
+
+.cheatcode
+  aside#left
+    display: none
+
+  .wrapper-main
+    width: auto !important
+    min-height: 83vh
+    float: none !important
+    margin: auto !important
+
+  #main,
+  .topbar
+    width: 1024px !important
+    margin: auto !important
+    padding-bottom: 0 !important
+
+  footer.hidden
+    display: block
+    margin-top: 5rem

app/styles/app/layouts/dashboard.sass

@@ -23,12 +23,17 @@
   margin-bottom: 4rem
 
 .starred-empty
-  border: dotted 1px $pebble-grey
+  border: dotted 1px rgba($cement-grey, 0.2)
   border-radius: 2px
   text-align: center
   padding: 2rem 0
-  font-size: 20px
+  font-size: 18px
   color: $cement-grey
+  span
+    @extend %icon-star
+    padding-left: 2em
+    background-size: 24px 24px
+    background-repeat: no-repeat
     
 .dash-star
   &:hover,
@@ -42,6 +47,7 @@
       fill: $canary-yellow
 
 .dash-header
+  position: relative
   order: 2
   flex: 0 0 20%
 
@@ -78,7 +84,7 @@
     padding: 0 1em
   @media #{$medium-up}
     display: flex
-    flex-flow: row wrap
+    flex-flow: row nowrap
     align-items: center
     justify-content: space-between
     height: 80px
@@ -97,9 +103,9 @@
 .dash-last-build
   display: flex
   order: 4
-  flex: 0 0 55%
+  flex: 1 0 30%
-  flex-flow: row wrap
+  flex-flow: row nowrap
-  justify-content: space-between
+  justify-content: flex-start
 
   @media #{$small-only}
     margin-top: 2em
@@ -109,3 +115,17 @@
 
     > div
       flex: 0 0 33%
+
+.dash-button
+  order: 5
+
+.activate-repo-button
+  @extend %button
+  background-color: $pebble-grey
+  color: $cement-grey
+  font-size: 14px
+  cursor: default
+  &.is-active:hover
+    background-color: $turf-green
+    color: white
+    cursor: pointer

app/styles/app/layouts/jobs.sass

@@ -53,6 +53,10 @@
       align-items: center
       height: 34px
 
+  &:hover
+    a
+      margin-left: -2px // related to the width given in color jobs
+
 .section-title
   font-size: 16px
   color: $cement-grey

app/styles/app/layouts/profile.sass

@@ -185,16 +185,15 @@ p.profile-user-last
   +linkStyle
 
 .hooks-error
-  width: 100%;
+  width: 100%
-  padding: 0 $column-gutter/2;
+  margin-top: 1.3rem
-  margin-top: 3.3rem;
   p
     position: relative
-    padding: $column-gutter/2 $column-gutter*2 $column-gutter/2 $column-gutter/2;
+    padding: .7em 1.5em .7em 0.5em
-    color: #de4248
+    color: $brick-red
-    background-color: #f1b6ad
+    background-color: $quartz-red
     a
-      color: #de4248
+      color: $brick-red
       text-decoration: underline
     &:after
       content: ""
@@ -203,14 +202,14 @@ p.profile-user-last
       left: 1.5em
       width: 1.2em
       height: 1.2em
-      background: #f1b6ad
+      background: $quartz-red
       transform: rotate(45deg)
   .close
     @extend .icon
+    @extend %icon-line-cross-red
     position: absolute
     top: 1em
     right: 1em
-    @extend .icon--dismiss-red
 
 .profile-token-toggle
   .icon-eye

app/styles/app/layouts/requests.sass

@@ -1,6 +1,7 @@
 =requestFadeOut($status, $color)
   @media #{$medium-up}
     &.#{$status}:hover
+      padding-left: 0
       .status-icon.api
         svg
           background-color: $color
@@ -19,8 +20,8 @@
   margin-bottom: 5px
   font-size: 15px
   padding-left: 1em
-  @include colorJobs($turf-green, 'accepted', 6px, rgba($turf-green, .1))
+  @include colorJobs($turf-green, 'accepted', 3px, rgba($turf-green, .1))
-  @include colorJobs($brick-red, 'rejected', 6px, rgba($brick-red, .1))
+  @include colorJobs($brick-red, 'rejected', 3px, rgba($brick-red, .1))
 
   @include requestFadeOut('accepted',#ECF6EF)
   @include requestFadeOut('rejected', #FBECEB)
@@ -36,9 +37,9 @@
   @media #{$medium-up}
     display: flex
     justify-content: space-between
-    flex-flow: row wrap
+    flex-flow: row nowrap
     align-items: center
-    padding: .3em 0
+    padding: .3em 0 .3em 2px
     white-space: nowrap
 
     .row-item:first-of-type

app/styles/app/layouts/top.sass

@@ -1,9 +1,9 @@
 .top .cta
-  border-bottom: 2px solid #E4E4E4
+  border-bottom: 2px solid rgba($cement-grey, 0.2)
-  border-top: 2px solid #E4E4E4
+  border-top: 2px solid rgba($cement-grey, 0.2)
   line-height: 2.7em
   font-size: 16px
-  color: #71AE76
+  color: $turf-green
   text-align: right
   padding-right: 1rem
   background-color: #fff
@@ -13,16 +13,24 @@
     position: relative
     margin: auto
     padding: 0
-
+    &:after,
-  .arrow
+    &:before
+      content: ""
       display: block
+      width: 13px
       position: absolute
-    top: -11px
+      transform: rotate(45deg)
-    right: 66px
+    &:after
-    background-image: inline-image('cta-arrow.svg')
+      height: 13px
-    background-repeat: no-repeat
+      background: rgba($cement-grey, 0.1)
-    width: 20px
+      top: -0.4rem
-    height: 12px
+      right: 4rem
+    &:before
+      height: 15px
+      background: white
+      top: -0.3rem
+      right: 57px
+      z-index: 1
 
   @media #{$medium-up}
     display: block
@@ -32,10 +40,10 @@
   display: none !important
 
 .landing-pro .top
-  border-bottom: 1px solid #f1f1f1
+  border-bottom: 1px solid $pebble-grey
 
 .top
-  background-color: #f1f1f1
+  background-color: $pebble-grey
 
 .topbar
   height: $top-height

app/styles/app/mixins.sass

@@ -137,5 +137,3 @@
     &:active
       background-color: $hover
       border-left: $width solid $color
-      a
-        margin-left: - $width + 1px

app/styles/app/modules/buttons.sass

@@ -1,26 +1,30 @@
-$button-border-color: #d4d4d4
+%button
+  font-family: $font-family-sans-serif
+  display: inline-block
+  cursor: pointer
+  white-space: nowrap
+  border-radius: 2px
+  border: none
+  vertical-align: middle
+  padding: 0.8rem
+  line-height: 1
+  text-decoration: none
 
 .button,
 .btn
-  font-family: $font-family-sans-serif
+  @extend %button
   position: relative
   overflow: visible
-  display: inline-block
-  padding: 5px 10px
-  cursor: pointer
   outline: none
-  text-decoration: none
   text-align: center
   color: white
-  white-space: nowrap
-  border-radius: 2px
   background-color: $pebble-grey
 
 .button:hover,
 .button:focus,
 .button:active,
 .button.active
-  border-color: $button-border-color
+  border-color: $pebble-grey
   background-color: $cement-grey
   text-decoration: none
   color: #fff
@@ -31,37 +35,30 @@ $button-border-color: #d4d4d4
   border-bottom-color: #2356c4
   background-color: #40454f
 
-.button--signin,
+.button-signin,
-.button--signingin
+.button-signingin
-  display: inline-block
+  @extend %button
+  height: 36px
   color: #fff
-  font-size: $font-size-s
+  font-size: 14px
-  line-height: 1
+  background-color: $turf-green
-  text-decoration: none
+  .loading-indicator
-  border-radius: 4px
+    vertical-align: top
-  border: none
+    margin-left: .3em
-  vertical-align: middle
+    i
-  background:
+      background-color: white
-    color: $turf-green
+      width: 6px
+      height: 6px
 
-.button--signin
+.button-signin
-  padding: 0.6em 2em 0.55em 0.6em
+  @extend %icon-github-white
-  cursor: pointer
+  padding-right: 2.2em
   background:
-    image: inline-image('ui/github-signin.svg')
+    size: 16px
+    position: 95%
     repeat: no-repeat
-    position: 95.5% 45%
   &:hover
-    background-color: #73c78d
+    background-color: rgba($turf-green, 0.8)
-    text-decoration: none
-
-.button--signingin
-  padding: 0.6em 0.6em 0.45em
-  span
-    display: inline-block
-    padding: 0 .2em
-    position: relative
-    top: -0.15em
 
 .button--green
   border: none
@@ -86,8 +83,8 @@ $button-border-color: #d4d4d4
   &:hover
     background-color: darken(#39a85b, 10)
 
-#auth #navigation .button--signin,
+#auth #navigation .button-signin,
-#auth #navigation .button--signingin
+#auth #navigation .button-signingin
   display: none
 
 .button--grey

app/styles/app/modules/dropdown.sass

@@ -178,7 +178,7 @@ $dropdown-button-margin: -9px
   @media #{$medium-up}
     position: absolute
     right: 0
-    top: -7em
+    bottom: 5em
     margin: 0
     background-color: white
     border: 1px solid $oxide-blue

app/styles/app/modules/flash.sass

@@ -1,6 +1,5 @@
 .flash
   @include resetul
-  font-size: 18px
   text-align: center
   height: 0
   li
@@ -12,8 +11,6 @@
     height: 0
     animation: comeIn 7s 1 ease
     z-index: 90
-  li.broadcast
-    height: auto
 
   .close
     @extend .icon
@@ -27,21 +24,18 @@
     padding: .4em 0
     margin: 0
 
-  li.broadcast p
-    padding: .7em 5em
-
   .success,
   .notice
     color: $turf-green
     background-color: $seed-green
     .close
-      @extend .icon--dismiss-green
+      @extend .icon-line-cross-green
 
   .error
     color: $brick-red
     background-color: $quartz-red
     .close
-      @extend .icon--dismiss-red
+      @extend .icon-line-cross-red
 
 @keyframes comeIn
   0%

app/styles/app/modules/icons.sass

@@ -29,16 +29,6 @@
 .icon--search
   background-image: inline-image('stroke-icons/icon-search.svg')
 
-.icon--dismiss-yellow
-  background-image: inline-image('ui/icon-warning-dismiss.svg')
-.icon--dismiss-green
-  background-image: inline-image('ui/icon-success-dismiss.svg')
-.icon--dismiss-red
-  background-image: inline-image('ui/icon-error-dismiss.svg')
-
-.icon--dismiss-grey
-  background-image: inline-image('ui/dismiss.svg')
-
 %icon-line-trashcan
   background-image: inline-image('stroke-icons/icon-trash.svg')
 %icon-line-trashcan-red
@@ -102,12 +92,14 @@
   @extend %icon
   background-image: inline-image('stroke-icons/icon-builds.svg')
 
-%icon-line-commit,
 %icon-github
   background-image: inline-image('stroke-icons/icon-github.svg')
+%icon-github-white
+  background-image: inline-image('stroke-icons/icon-github-white.svg')
+  
 .icon-line-commit
   @extend %icon
-  @extend %icon-line-commit
+  @extend %icon-github
 
 %icon-line-eye
   background-image:inline-image('stroke-icons/icon-seemore.svg')
@@ -127,7 +119,7 @@
     position: 3px 3px
     size: auto 10px
   display: inline-block
-  border: solid 1px #E4E6E6
+  border: solid 1px $pebble-grey
   border-radius: 50%
   @extend %icon-line-question
   &:hover
@@ -178,6 +170,12 @@
   background-image: inline-image('stroke-icons/icon-failed-white.svg')
 %icon-line-cross-teal
   background-image: inline-image('stroke-icons/icon-failed-teal.svg')
+%icon-line-cross-red
+  background-image: inline-image('stroke-icons/icon-failed-red.svg')
+%icon-line-cross-green
+  background-image: inline-image('stroke-icons/icon-failed-green.svg')
+%icon-line-cross-yellow
+  background-image: inline-image('stroke-icons/icon-failed-yellow.svg')
 
 .icon-deactivate
   @extend .icon
@@ -215,10 +213,15 @@
   text-indent: 999px
   overflow: hidden
 
+%icon-star
+  background-image: inline-image('stroke-icons/icon-star.svg')
+  
 .icon-star
   @extend %icon
   width: 18px
   height: 18px
+  fill: none
+  stroke: $cement-grey
 
 %icon-line-passed
   background-image: inline-image('stroke-icons/icon-passed.svg')

app/styles/app/modules/row.sass

@@ -16,6 +16,7 @@
   display: flex
   flex-flow: column wrap
   margin-bottom: 1rem
+  &.is-active
     @each $key, $value in $stateMap
       +rowColor(#{$key}, map-get($value, color))
 
@@ -46,6 +47,7 @@
   .row-content
     margin: 0
     font-size: 16px
+    white-space: nowrap
     a:hover,
     a:active
       border-bottom: 1px solid $asphalt-grey

app/styles/app/modules/tooltips.sass

@@ -82,44 +82,61 @@
     &:before
       left: 2.5em
 
-.tooltip-jobs
-  display: inline-block
-  position: relative
-  vertical-align: middle
-  @extend %tooltip
-  .tooltip-bubble
-    top: -3.8em
-    left: -.5em
-    height: 3.2em
-    padding: .3em .4em
-    &:before
-      left: 0.6em
-  .tooltip-trigger
-    vertical-align: baseline
 
-.tooltip.job-os
+// trying to rewrite
-  .tooltip-bubble
+
-    top: -2.2em
+$tooltip-spacing: 4em
-    height: 1.6em
+$tooltip-arrow-width: .8em
-    padding: 0.1em .4em
+  
+[data-tooltip]
+  position: relative
+  display: inline-block
+  vertical-align: middle
+  &:after
+    content: attr(data-tooltip)
+    padding: 0.2em 0.3em
+    color: white
+    border-radius: 2px
+    bottom: $tooltip-spacing
+    white-space: normal
+    font-size: 12px
   &:before
+    content: ""
+    width: $tooltip-arrow-width
+    height: $tooltip-arrow-width
+    transform: rotate(45deg)
+    bottom: $tooltip-spacing - $tooltip-arrow-width
+
+  &:after,
+  &:before
+    display: block
+    position: absolute
+    background: $asphalt-grey
     left: 0
     right: 0
     margin: auto
+    display: none
 
-
+  &:hover,
-.tooltip--requests
+  &:active
-  @extend %tooltip
+    &:after,
-  position: absolute
-  right: 0
-  bottom: 0
-  .tooltip-trigger
-    margin: .2em .5em
-  .tooltip-bubble
-    top: -3.6em
-    right: 0
-    width: 10em
-    height: 3em
-    white-space: normal
     &:before
-      right: .8em
+      display: block
+
+.job-os[data-tooltip]
+  $tooltip-spacing: 3em
+  &:after
+    bottom: $tooltip-spacing
+  &:before
+    bottom: $tooltip-spacing - $tooltip-arrow-width 
+
+
+.request-item
+  [data-tooltip]
+    $tooltip-spacing: 3em
+    width: 7em
+    text-align: center
+    &:after
+      bottom: $tooltip-spacing
+    &:before
+      bottom: $tooltip-spacing - $tooltip-arrow-width 

app/styles/app/pages/landing.sass

@@ -7,20 +7,6 @@
 .top.landing-page .topbar
   background-color: #fff
 
-  .button--signin
-    background-color: #ffffff
-    background-image: inline-image('landing-page/signingithub.svg')
-    background-size: 16px 16px
-    border: 2px solid #e4e7e7
-    color: #a0a8a8
-  .button--signingin
-    border: 2px solid #3FA75F
-  .button--signin:hover
-    background-color: #73c78d
-    background-image: inline-image('landing-page/signingithub-hover.svg')
-    border: 2px solid #73c78d
-    color: #fff
-
 .landing-centered-wrapper
   .button
     .sync-spinner
@@ -37,9 +23,14 @@
     font-size: 5em
     line-height: 1em
     font-weight: 300
-    color: #8f9294
+    color: rgba($asphalt-grey, .8)
     margin-bottom: 0
 
+  .hero,
+  .recent-builds,
+  .features-list
+    background-color: $pebble-grey
+
   .hero, .oss-testing, .customers, .recent-builds, .free-for-oss, .private-repos, .features-list, .build-flows, .user-testimonials
     padding: 70px 0 70px 0
 
@@ -52,11 +43,11 @@
       font-size: 3.3em
       line-height: 1.15em
       font-weight: 300
-      color: #39a85b
+      color: $turf-green
 
     p
       line-height: 1.5em
-      font-color: #606162
+      font-color: $asphalt-grey
       font-size: 1.7em
 
   .hero.z-1
@@ -78,13 +69,12 @@
     margin-bottom: -192px
 
   #laptop img
-    border: 2px solid #d8dadc
+    border: 2px solid rgba($cement-grey, 0.2)
     border-radius: 2px
 
   .hero
-    background-color: #f6f6f6
     h1
-      color: #339999
+      color: $oxide-blue
       line-height: 1.2em
       margin-bottom: 0
 
@@ -96,17 +86,15 @@
       display: none
 
     .button
-      background-color: #39a85b
+      background-color: $turf-green
       color: #fff
       font-size: 2em
       font-weight: 300
-      padding: 0.5em
       margin: 1.3em 0 1.3em 0
       border-radius: 2px
-      border: 0
 
       &:hover
-        background-color: #73c78d
+        background-color: rgba($turf-green, .8)
 
     .sign-in-mascot
       padding-right: 10px
@@ -139,19 +127,15 @@
       padding: 0 0 0 12%
 
   .recent-builds
-    background-color: #f6f6f6
     min-height: 44rem
 
   .recent-builds-text
     text-align: center
     h2
-      color: #db4141
+      color: $brick-red
       text-align: right
       margin: 0
 
-    a
-      color: #828282
-
     p
       text-align: right
       margin-top: 0.5em
@@ -196,7 +180,7 @@
     text-align: center
 
     h2
-      color: #339999
+      color: $oxide-blue
       margin: 0
       text-align: right
 
@@ -206,7 +190,12 @@
       text-align: right
 
     a
-      text-decoration: underline
+      text-decoration: none
+      border-bottom: 1px solid $asphalt-grey
+      transition: all 200ms ease
+      &:hover
+        border-bottom: none
+        color: $cement-grey
 
     .mobile-envelope
       display: none
@@ -215,7 +204,6 @@
       display: inline-block
 
   .features-list
-    background-color: #f6f6f6
 
     h2
       margin: 0
@@ -223,16 +211,11 @@
     h3
       font-size: 1.4em
       font-weight: 300
-      color: #413c3c
-      text-align: center
       margin-bottom: 35px
       padding-top: 40px
 
     p
-      font-size: 1.15em
+      font-size: 16px
-      font-weight: 300
-      color: #606162
-      text-align: center
 
     br.mobile-break
       display: none
@@ -278,7 +261,6 @@
       margin-top: 1.6rem;
 
     li
-      font-color: #606162
       font-size: 1.7em
       line-height: 1.7em
       &:before
@@ -293,7 +275,7 @@
     text-align: center
 
     h2
-      color: #909295
+      color: $cement-grey
 
     h2#pr-bf-margin
       margin-top: 90px
@@ -304,9 +286,8 @@
         width: 120px
 
         p
-          font-size: 1em
+          font-size: 13px
           line-height: 1.5em
-          color: #5f6062
 
     .divider-line-horizontal
       width: 50px
@@ -322,13 +303,11 @@
     margin-bottom: 50px
 
     h2
-      color: #418793
+      color: $oxide-blue
       text-align: right
 
     p
       font-size: 1.2em
-      font-weight: 300
-      color: #606162
       margin: 0
       display: inline-block
 
@@ -407,7 +386,7 @@
     .build-flows .branch-bf .divider-line-vertical
       width: 3px
       height: 40px
-      background: #eaeaec
+      background: $pebble-grey
       display: inline-block
       margin-bottom: 10px
 
@@ -472,7 +451,6 @@
     padding-left: .5rem
     font-size: 18px
 
-
 .landing,
 .landing-pro
   background-color: white

app/templates/components/dashboard-row.hbs

@@ -1,6 +1,6 @@
 <div class="dash-head">
-    <a href="#" class="dash-star is-starred" title="(un-) star this repo"><span class="icon-star">
+    <a href="#" class="dash-star {{if repo.starred 'is-starred'}}" title="{{if repo.starred 'un'}}star this repo"><span class="icon-star">
-      <svg version="1.1" id="icon-star" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 15 15" style="enable-background:new 0 0 15 15;" xml:space="preserve" alt="star repository">
+      <svg version="1.1" id="icon-star" x="0px" y="0px" viewBox="0 0 15 15" xml:space="preserve" alt="star repository">
       <path id="star" d="M7.159,1.035c0.188-0.38,0.495-0.38,0.683,0l1.596,3.234c0.188,0.38,0.685,0.741,1.105,0.802
 	l3.569,0.519c0.42,0.061,0.515,0.353,0.211,0.649l-2.583,2.517c-0.304,0.296-0.494,0.88-0.422,1.298l0.61,3.555
 	c0.072,0.418-0.177,0.599-0.552,0.401l-3.192-1.678c-0.375-0.197-0.99-0.197-1.365,0l-3.192,1.678
@@ -8,7 +8,9 @@
 	C0.374,5.944,0.469,5.652,0.889,5.591l3.569-0.519c0.42-0.061,0.917-0.422,1.105-0.802L7.159,1.035z"/>
         </svg>
     </span></a>
+    {{#if config.pro}}
       <span class="icon-lock">private repo</span>
+    {{/if}}
   </div>
   <div class="dash-body">
     <div class="dash-main">
@@ -21,11 +23,15 @@
         <h3 class="label">Default branch</h3>
         <p class="row-content color">
           {{request-icon event=repo.default_branch.last_build.event_type state=repo.default_branch.last_build.state}}
-          {{repo.default_branch.name}} is {{repo.default_branch.last_build.state}}
+          {{repo.default_branch.name}}
+          {{#if repo.active}}is {{repo.default_branch.last_build.state}}{{/if}}
         </p>
       </section>
 
+    {{#if repo.default_branch.last_build}}
       <section class="dash-last-build">
+
+      {{#if repo.active}}
         <div>
           <h3 class="label">Last build</h3>
           <p class="row-content color">
@@ -35,6 +41,8 @@
             {{/link-to}}
           </p>
         </div>
+      {{/if}}
+
         <div>
           <h3 class="label">Last commit</h3>
           <p class="row-content">
@@ -59,7 +67,10 @@
           </p>
         </div>
       </section>
+    {{/if}}
 
+
+    {{#if repo.active}}
       {{#if displayMenuTofu}}
         <div class="dash-menu">
           <div class="dropup {{if dropupIsOpen "is-open"}}">
@@ -82,11 +93,22 @@
           </div>
         </div>
       {{/if}}
+    {{else}}
+      <div class="dash-button">
+        {{#if displayActivateLink}}
+          <button type="button" class="activate-repo-button is-active" {{action 'activateRepo'}}>Activate repository</button>
+        {{else}}
+          <p class="activate-repo-button" data-tooltip="You need admin rights to activate a repository">Actiavte repository</p>
+        {{/if}}
+      </div>
+    {{/if}}
     </div>
 
+    {{#if repo.active}}
       <aside class="dash-aside">
         <ul class="lastbuilds">
           {{lastbuild-tile repo=repo build=repo.default_branch.last_build}}
         </ul>
       </aside>
+    {{/if}}
   </div>

app/templates/components/jobs-item.hbs

@@ -8,10 +8,9 @@
     <span class="label-align" aria-label="Job number">{{job.number}}</span>
   </div>
 
-  <div class="job-os {{job.config.os}} tooltip">
+  <div class="job-os {{job.config.os}} tooltip" data-tooltip="{{job.config.os}}">
     {{#if job.config.os}}
-      <span class="icon tooltip-trigger" aria-label="Operating System">{{job.config.os}}</span>
+      <span class="icon" aria-label="{{job.config.os}} operating system">{{job.config.os}}</span>
-      <div class="tooltip-bubble" aria-hidden="true">{{job.config.os}}</div>
     {{/if}}
   </div>
 

app/templates/components/jobs-list.hbs

@@ -4,10 +4,9 @@
     <h2 class="section-title">Build Jobs</h2>
   {{else}}
     <h2 class="section-title">Allowed Failures
-      <div class="tooltip-jobs">
+      <span class="tooltip-jobs" data-tooltip="These are jobs you can allow to fail <br> without failing your entire build">
         <span class="icon-question tooltip-trigger"></span>
-        <p class="tooltip-bubble">These are jobs you can allow to fail <br> without failing your entire build</p>
+      </span>
-      </div>
     </h2>
   {{/if}}
 

app/templates/components/landing-row.hbs

@@ -1,4 +1,3 @@
-
 <div class="two-line row-header fade-out">
   <div class="row-name row-color">
     <h3>{{#link-to "owner" repo.owner}}
@@ -14,20 +13,9 @@
 
 <div class="two-line">
   <div class="row-number">
-    <div class="row-item row-color">
+    <div class="row-item">
       {{#link-to "build" repo repo.lastBuildId}}
-      <span class="icon">
+      <span class="icon-hash"></span>
-        <svg version="1.1" id="Layer_1" x="0px" y="0px"
-           viewBox="-289 191 20 20" style="enable-background:new -289 191 20 20;" xml:space="preserve">
-        <path fill="#A5ACAD" class="st0" d="M-272.4,198.4C-272.4,198.4-272.4,198.4-272.4,198.4l-3.4,0l0.3-3.3c0-0.3-0.2-0.6-0.5-0.6
-          c-0.3,0-0.6,0.2-0.6,0.5l-0.3,3.4l-3.2,0l0.3-3.6c0-0.3-0.2-0.6-0.5-0.6c-0.3,0-0.6,0.2-0.6,0.5l-0.3,3.7l-3.2,0
-          c-0.3,0-0.5,0.2-0.5,0.6c0,0.3,0.2,0.5,0.5,0.5c0,0,0,0,0,0l3.1,0l-0.2,2.9l-3.5,0c-0.3,0-0.5,0.2-0.5,0.6c0,0.3,0.2,0.5,0.5,0.5
-          c0,0,0,0,0,0l3.4,0l-0.3,3.3c0,0.3,0.2,0.6,0.5,0.6c0,0,0,0,0,0c0.3,0,0.5-0.2,0.5-0.5l0.3-3.4l3.2,0l-0.3,3.6
-          c0,0.3,0.2,0.6,0.5,0.6c0,0,0,0,0,0c0.3,0,0.5-0.2,0.5-0.5l0.3-3.7l3.2,0c0.3,0,0.5-0.2,0.5-0.6c0-0.3-0.2-0.5-0.5-0.5c0,0,0,0,0,0
-          l-3.1,0l0.2-2.9l3.5,0c0.3,0,0.5-0.2,0.5-0.6C-271.8,198.7-272.1,198.4-272.4,198.4z M-277.2,202.4l-3.2,0l0.2-2.9l3.2,0
-          L-277.2,202.4z"/>
-        </svg>
-      </span>
       <span class="label-align">
         {{repo.lastBuildNumber}} {{repo.lastBuildState}}</span>
       {{/link-to}}
@@ -36,22 +24,7 @@
 
   <div class="row-calendar">
     <div class="row-item" title="{{repo.lastBuildFinishedAt}}">
-      <span class="icon">
+      <span class="icon-calendar"> </span>
-        <svg viewBox="0 0 20 20">
-          <g id="Cal">
-            <path fill="#A7AEAE" d="M16.7,2.5H3.3C3,2.5,2.8,2.7,2.8,3V17c0,0.3,0.2,0.5,0.5,0.5h13.4c0.3,0,0.5-0.2,0.5-0.5V3
-              C17.2,2.7,17,2.5,16.7,2.5z M16.2,3.4v3.1H3.8V3.4H16.2z M3.8,16.6v-9h12.5v9H3.8z"/>
-            <path fill="#A7AEAE" d="M8.7,13.4c-0.1,0-0.3,0-0.4,0c0.2-0.2,0.4-0.4,0.5-0.6c0.2-0.2,0.3-0.4,0.5-0.6c0.1-0.2,0.2-0.4,0.3-0.6
-              c0.1-0.2,0.1-0.4,0.1-0.6c0-0.2,0-0.4-0.1-0.6c-0.1-0.2-0.2-0.3-0.3-0.4C9.2,10,9.1,9.9,8.9,9.8C8.7,9.7,8.5,9.7,8.3,9.7
-              C8,9.7,7.7,9.8,7.5,9.9C7.2,10,7,10.2,6.8,10.4L7.3,11c0.1-0.1,0.2-0.2,0.4-0.3c0.1-0.1,0.3-0.1,0.4-0.1c0.2,0,0.4,0.1,0.5,0.2
-              c0.1,0.1,0.2,0.3,0.2,0.5c0,0.2,0,0.3-0.1,0.5c-0.1,0.2-0.2,0.4-0.4,0.6c-0.2,0.2-0.4,0.4-0.6,0.7c-0.2,0.2-0.5,0.5-0.8,0.8v0.6
-              H10v-0.9H9.1C9,13.4,8.8,13.4,8.7,13.4z"/>
-            <path fill="#A7AEAE" d="M10.6,10.7h2c-0.2,0.3-0.4,0.6-0.5,0.8c-0.1,0.3-0.3,0.6-0.4,0.8c-0.1,0.3-0.2,0.6-0.2,0.9
-              c0,0.3-0.1,0.7-0.1,1h1c0-0.4,0-0.8,0.1-1.2c0-0.3,0.1-0.7,0.2-0.9c0.1-0.3,0.2-0.6,0.4-0.9c0.2-0.3,0.4-0.6,0.6-0.9V9.8h-3.1
-              V10.7z"/>
-          </g>
-        </svg>
-      </span>
       <time class="label-align" datetime="{{repo.lastBuildFinishedAt}}">
         {{landing-page-last-build-time repo.lastBuildFinishedAt}}</time>
     </div>
@@ -61,48 +34,15 @@
 <div class="two-line">
   <div class="row-commit">
     <div class="row-item">
-      <span class="icon">
+      <span class="icon-github"></span>
-        <svg x="0px" y="0px" viewBox="2 0 20 20" xml:space="preserve">
-          <g id="Commit">
-            <path fill="#A7AEAE" d="M7.8,17.5c-0.3,0-0.5-0.2-0.5-0.5l0-1c-0.4,0-1,0.1-1.4-0.1c-0.4-0.1-1.3-0.5-1.8-1.7
-              c-0.1-0.2-0.3-0.4-0.4-0.6c-0.1-0.1-0.2-0.3-0.3-0.4C3,12.8,3,12,3.3,11.5c0.3-0.4,0.7-0.5,1.2-0.3c0.7,0.2,1.1,0.9,1.4,1.3
-              c0.1,0.1,0.1,0.2,0.2,0.2c0.4,0.4,1,0.3,1.4,0.1c0.1-0.1,0.2-0.2,0.3-0.3c-0.1,0-0.1,0-0.2,0c-0.7-0.1-1.3-0.4-1.9-0.7
-              c-0.2-0.2-0.6-0.4-0.8-0.7c-0.3-0.3-0.5-0.7-0.7-1.2C4.1,9.4,4,9,3.9,8.5c0-0.4-0.1-0.9,0-1.4C4,6.5,4.2,6,4.5,5.5
-              c0.1-0.1,0.1-0.2,0.2-0.3c0,0,0-0.1,0-0.1c-0.1-0.3-0.1-0.6-0.1-1c0-0.4,0.1-0.8,0.3-1.2C5,2.6,5.2,2.5,5.5,2.5
-              c0.3,0,0.8,0.1,1.2,0.3c0.4,0.2,0.8,0.4,1.2,0.7c0.5-0.1,1-0.2,1.6-0.2c0.4,0,1.6,0,2,0c0.5,0,1,0.1,1.4,0.2l0.2-0.1
-              c0.2-0.1,0.5-0.3,0.7-0.4c0.4-0.2,0.7-0.3,1.1-0.3c0.1,0,0.2,0,0.3,0c0.3,0,0.5,0.1,0.6,0.4c0.2,0.6,0.4,1.2,0.2,2l0,0.1
-              c0,0.1,0,0.2-0.1,0.3c0.5,0.6,0.7,1.3,0.8,2.1c0,0.3,0,0.6,0,0.9c0,0.5-0.1,1-0.2,1.4c-0.2,0.5-0.4,1-0.7,1.4
-              c-0.3,0.4-0.7,0.6-1,0.8c-0.6,0.3-1.2,0.6-1.8,0.7c0.2,0.4,0.3,0.8,0.3,1.3c0,0,0,0,0,0c0,0.8,0,3.2,0,3.2c0,0.3-0.2,0.5-0.5,0.5
-              L7.8,17.5L7.8,17.5z M7.8,15.1c0.1,0,0.2,0,0.3,0.1c0.1,0.1,0.2,0.2,0.2,0.3l0,1l4.2,0c0-0.7,0-2.1,0-2.7c0-0.4-0.1-0.7-0.2-1
-              c-0.1-0.2-0.1-0.3-0.2-0.3l0.3-0.4l0,0L12,12.5c-0.1-0.1-0.1-0.3-0.1-0.5c0.1-0.2,0.2-0.3,0.4-0.3l0.3,0c0.7-0.1,1.3-0.3,1.9-0.7
-              c0.3-0.2,0.6-0.4,0.7-0.6c0.2-0.3,0.4-0.6,0.5-1C15.9,9,15.9,8.6,16,8.1c0-0.2,0-0.5,0-0.7c-0.1-0.7-0.3-1.2-0.7-1.7
-              c-0.2-0.2-0.2-0.4-0.1-0.6c0-0.1,0.1-0.2,0.1-0.3l0-0.1c0.1-0.4,0-0.8-0.1-1.2c0,0,0,0-0.1,0c-0.2,0-0.5,0.1-0.7,0.2
-              c-0.2,0.1-0.4,0.2-0.7,0.4l-0.4,0.2c-0.1,0.1-0.3,0.1-0.4,0.1c-0.5-0.1-0.9-0.2-1.4-0.2c-0.4,0-1.5,0-1.9,0C9,4.1,8.5,4.2,8,4.4
-              c-0.1,0-0.3,0-0.5-0.1C7.1,4,6.7,3.8,6.3,3.6C6.1,3.5,5.9,3.5,5.7,3.5C5.6,3.7,5.6,4,5.6,4.2c0,0.3,0,0.5,0.1,0.7
-              c0,0.1,0,0.1,0.1,0.2c0.1,0.2,0,0.4-0.1,0.5L5.5,5.8C5.5,5.9,5.4,6,5.3,6.1C5.1,6.4,4.9,6.8,4.8,7.3c-0.1,0.4,0,0.8,0,1.1
-              c0,0.4,0.1,0.8,0.2,1.2c0.1,0.4,0.3,0.7,0.5,0.9C5.8,10.7,6,10.9,6.2,11c0.5,0.3,1,0.5,1.6,0.6c0.2,0,0.7,0.1,0.7,0.1
-              c0.1,0,0.3,0.1,0.3,0.2c0.1,0.1,0.1,0.2,0.1,0.4c0,0.1-0.3,1-0.9,1.4c-0.7,0.4-1.8,0.5-2.5-0.3c-0.1-0.1-0.2-0.2-0.3-0.3
-              c-0.2-0.3-0.6-0.8-1-1c-0.1,0-0.1,0-0.1,0c0,0,0,0-0.1,0.1c0,0.2,0,0.4,0.1,0.6c0.1,0.1,0.2,0.2,0.3,0.4c0.2,0.3,0.4,0.5,0.5,0.8
-              c0.4,0.8,1,1.1,1.2,1.2C6.6,15.2,7.4,15.1,7.8,15.1C7.7,15.1,7.7,15.1,7.8,15.1z"/>
-          </g>
-        </svg>
-      </span>
       <span class="label-align">
         {{format-sha repo.lastBuild.commit.sha}}</span>
     </div>
   </div>
   <div class="row-commiter">
-    <div class="row-item">
+    <div class="row-item color">
-      <span class="icon">
+      {{request-icon event=repo.lastBuild.eventType}}
-        <svg version="1.1" id="Layer_1" x="0px" y="0px"
+      <span class="label-align">{{repo.lastBuild.commit.branch}}</span>
-           viewBox="0 0 20 20" enable-background="new 0 0 20 20" xml:space="preserve">
-          <g id="Push">
-            <path fill="#A7AEAE" d="M16.9,9.4h-3.5c-0.3-1.6-1.7-2.8-3.4-2.8S6.9,7.8,6.6,9.4H3.1c-0.3,0-0.6,0.3-0.6,0.6s0.3,0.6,0.6,0.6h3.5
-              c0.3,1.6,1.7,2.8,3.4,2.8s3.1-1.2,3.4-2.8h3.5c0.3,0,0.6-0.3,0.6-0.6S17.2,9.4,16.9,9.4z M10,12.2c-1.2,0-2.2-1-2.2-2.2
-              c0-1.2,1-2.2,2.2-2.2c1.2,0,2.2,1,2.2,2.2c0,0,0,0,0,0c0,0,0,0,0,0C12.2,11.2,11.2,12.2,10,12.2z"/>
-          </g>
-        </svg>
-      </span><span class="label-align">{{repo.lastBuild.commit.branch}}</span>
     </div>
   </div>
 </div>

app/templates/components/requests-item.hbs

@@ -37,8 +37,7 @@
 </div>
 
 {{#if isGHPages}}
-  <a class="tooltip--requests" href="https://docs.travis-ci.com/user/customizing-the-build/#Whitelisting-or-blacklisting-branches" title="Branch whitelisting - Travis CI Docs">
+  <a class="tooltip" href="https://docs.travis-ci.com/user/customizing-the-build/#Whitelisting-or-blacklisting-branches" title="Branch whitelisting - Travis CI Docs" data-tooltip="Read about branch whitelisting">
-    <span class="icon-question tooltip-trigger" aria-label="Help"></span>
+    <span class="icon-question" aria-label="Help"></span>
-    <span class="tooltip-bubble">Read about branch whitelisting</span>
   </a>
 {{/if}}

app/templates/dashboard.hbs

@@ -1,3 +1,3 @@
-{{#travis-layout layoutName="layouts/dashboard" class="dashboard"}}
+{{#travis-layout layoutName="layouts/simple" class="dashboard"}}
   {{outlet}}
 {{/travis-layout}}

app/templates/home.hbs

@@ -7,7 +7,7 @@
 	<p>Easily sync your GitHub projects with Travis CI<br class="mobile-break"> and you’ll be testing your code in minutes!</p>
 
 	{{#if auth.signedOut}}
-				  <button {{action "signIn" target="auth"}} class="button"><img src="../images/landing-page/sign-in-mascot.svg" class="sign-in-mascot">Sign Up</button>
+	<button {{action "signIn" target="auth"}} class="button"><img src="../images/landing-page/sign-in-mascot.svg" class="sign-in-mascot"><span class="label-align">Sign Up</span></button>
 	{{/if}}
 	{{#if auth.signingIn}}
 	<button class="button"><span class="loading-indicator--white"><i></i><i></i><i></i></span>Signing In</button>

app/templates/layouts/dashboard.hbs

@@ -1,15 +0,0 @@
-<div class="wrapper">
-  <header id="top" class="top">
-    <div class="centered">
-      {{render "top"}}
-    </div>
-  </header>
-
-  <div class="centered">
-    {{yield}}
-  </div>
-</div>
-
-<footer>
-  {{render "footer"}}
-</footer>

app/templates/layouts/profile.hbs

@@ -15,6 +15,4 @@
   </div>
 </div>
 
-<footer>
 {{render "footer"}}
-</footer>

app/templates/layouts/simple.hbs

@@ -13,6 +13,4 @@
   </div>
 </div>
 
-<footer>
 {{render "footer"}}
-</footer>

app/templates/owner.hbs

@@ -1,4 +1,4 @@
-{{#travis-layout layoutName="layouts/profile" class="owner"}}
+{{#travis-layout layoutName="layouts/simple" class="owner"}}
 <header class="owner-header row">
   <div class="owner-avatar">
     <img src={{avatarURL}} alt="" width="125" height="125">

app/templates/top.hbs

@@ -1,6 +1,11 @@
 <div class="topbar {{if is-open 'has-autoheight'}} {{if showBroadcasts 'has-autoheight'}}">
-  <h1 id="logo" class="logo">{{#link-to "main" alt="Travis CI"}}Travis CI{{/link-to}}</h1>
+  <h1 id="logo" class="logo" {{action "cheatcode" on="doubleClick"}}>
-
+    {{#if isDashboard}}
+      {{#link-to "dashboard" alt="Travis CI"}}Travis CI{{/link-to}}
+    {{else}}
+      {{#link-to "main" alt="Travis CI"}}Travis CI{{/link-to}}
+    {{/if}}
+    </h1>
   <div class="navigation-toggle">
     <button type="button" id="tofuburger" class="tofuburger" {{action 'toggleBurgerMenu'}}>Toggle Menu</button>
   </div>
@@ -62,7 +67,7 @@
 
       <li class="{{classProfile}}">
         {{#if auth.signedOut}}
-          <button class="signed-out button--signin" {{action "signIn" target="auth"}}>Sign in with GitHub</button>
+          <button class="signed-out button-signin" {{action "signIn" target="auth"}}>Sign in with GitHub</button>
         {{/if}}
         {{#if auth.signedIn}}
           {{#link-to "profile" class="navigation-anchor signed-in"}}
@@ -71,7 +76,7 @@
           {{/link-to}}
         {{/if}}
         {{#if auth.signingIn}}
-          <button class="signing-in button--signingin">Signing In <span class="loading-indicator--white"><i></i><i></i><i></i></span></button>
+          <button class="signing-in button-signingin">Signing In {{loading-indicator inline=true}}</button>
         {{/if}}
         {{#if auth.signedIn}}
           <ul class="navigation-nested">
@@ -98,7 +103,6 @@
 {{#if showCta}}
   <div class="cta">
     <p class="row">
-      <span class="arrow"></span>
       Help make Open Source a better place and start building better software today!
     </p>
   </div>

mirage/config.js

@@ -56,6 +56,9 @@ export default function() {
       return new Mirage.Response(404, {}, {});
     }
   });
+  this.get('/dashboard', function(schema, request) {
+    // repos and orgs?
+  });
 
   // These comments are here to help you get started. Feel free to delete them.
 

public/images/cta-arrow.svg

@@ -1,7 +0,0 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<svg width="20" height="12" version="1.1" xmlns="http://www.w3.org/2000/svg">
-  <g transform="translate(10, 1), rotate(45)" fill="white">
-    <rect x="0" y="0" width="20" height="20"
-          style="fill: white; stroke-width: 2; stroke: #E4E4E4;" />
-  </g>
-</svg>

public/images/stroke-icons/icon-failed-green.svg

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 19.2.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="icon-failed" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
+	 y="0px" viewBox="0 0 15 15" style="enable-background:new 0 0 15 15;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:none;stroke:#39aa56;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}
+</style>
+<g id="failed">
+	<line class="st0" x1="0.5" y1="0.5" x2="14.5" y2="14.5"/>
+	<line class="st0" x1="14.5" y1="0.5" x2="0.5" y2="14.5"/>
+</g>
+</svg>

public/images/stroke-icons/icon-failed-red.svg

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 19.2.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="icon-failed" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
+	 y="0px" viewBox="0 0 15 15" style="enable-background:new 0 0 15 15;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:none;stroke:#db4545;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}
+</style>
+<g id="failed">
+	<line class="st0" x1="0.5" y1="0.5" x2="14.5" y2="14.5"/>
+	<line class="st0" x1="14.5" y1="0.5" x2="0.5" y2="14.5"/>
+</g>
+</svg>

public/images/stroke-icons/icon-failed-yellow.svg

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 19.2.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="icon-failed" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
+	 y="0px" viewBox="0 0 15 15" style="enable-background:new 0 0 15 15;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:none;stroke:cdb62c;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}
+</style>
+<g id="failed">
+	<line class="st0" x1="0.5" y1="0.5" x2="14.5" y2="14.5"/>
+	<line class="st0" x1="14.5" y1="0.5" x2="0.5" y2="14.5"/>
+</g>
+</svg>

public/images/stroke-icons/icon-github-white.svg

@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 19.2.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="icon-github" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
+	 y="0px" viewBox="0 0 15 15" style="enable-background:new 0 0 15 15;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:none;stroke:#ffffff;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}
+</style>
+<path id="github" class="st0" d="M10.384,11.324c0-0.408-0.06-0.807-0.243-1.179c-0.085-0.173-0.186-0.335-0.33-0.467
+	C9.805,9.672,9.799,9.664,9.787,9.65c0.099-0.011,0.191-0.021,0.283-0.031c0.753-0.082,1.451-0.324,2.098-0.716
+	c0.318-0.193,0.618-0.409,0.848-0.706c0.275-0.355,0.456-0.757,0.58-1.188c0.124-0.43,0.186-0.87,0.221-1.315
+	c0.021-0.265,0.031-0.529,0.002-0.795c-0.083-0.743-0.35-1.405-0.853-1.964c-0.034-0.038-0.042-0.066-0.02-0.115
+	c0.08-0.175,0.095-0.366,0.126-0.553c0.1-0.597-0.039-1.162-0.229-1.72c-0.013-0.038-0.039-0.046-0.071-0.045
+	c-0.131,0.008-0.263,0.015-0.394,0.026c-0.326,0.029-0.628,0.14-0.912,0.293c-0.352,0.19-0.696,0.397-1.044,0.595
+	c-0.022,0.012-0.055,0.017-0.079,0.011c-0.494-0.13-0.995-0.213-1.504-0.254C8.43,1.14,7.317,1.138,6.908,1.164
+	C6.36,1.198,5.82,1.284,5.289,1.428c-0.038,0.01-0.064,0.003-0.096-0.017c-0.405-0.262-0.824-0.5-1.264-0.699
+	c-0.33-0.15-0.679-0.195-1.035-0.211c-0.092-0.004-0.095,0-0.124,0.085C2.648,0.951,2.55,1.32,2.525,1.706
+	C2.507,1.999,2.55,2.286,2.608,2.571c0.018,0.092,0.05,0.183,0.082,0.271c0.013,0.034,0.004,0.051-0.015,0.076
+	C2.571,3.05,2.462,3.18,2.366,3.318C2.072,3.737,1.918,4.21,1.832,4.71c-0.07,0.409-0.043,0.819-0.001,1.228
+	c0.044,0.431,0.121,0.854,0.258,1.266c0.129,0.39,0.312,0.751,0.576,1.067c0.201,0.24,0.45,0.424,0.714,0.59
+	c0.526,0.332,1.094,0.563,1.704,0.683c0.226,0.044,0.752,0.105,0.752,0.105s-0.186,1.31-0.674,1.589
+	c-0.538,0.307-1.365,0.371-1.929-0.192C3.03,10.844,2.536,9.892,1.847,9.635c-0.879-0.327-1.044,0.816-0.628,1.399
+	c0.261,0.367,0.625,0.761,0.77,1.078c0.404,0.886,1.056,1.281,1.521,1.416c0.619,0.18,1.688-0.016,1.688-0.016l0.06,0.989
+	l5.112-0.006C10.368,14.494,10.384,12.127,10.384,11.324z"/>
+</svg>

public/images/stroke-icons/icon-star.svg

@@ -2,7 +2,7 @@
 <!-- Generator: Adobe Illustrator 19.2.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
 <svg version="1.1" id="icon-star" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
 	 viewBox="0 0 15 15" style="enable-background:new 0 0 15 15;" xml:space="preserve">
-<path id="star" class="st0" d="M7.159,1.035c0.188-0.38,0.495-0.38,0.683,0l1.596,3.234c0.188,0.38,0.685,0.741,1.105,0.802
+<path id="star" fill="none" stroke="#9d9d9d" class="st0" d="M7.159,1.035c0.188-0.38,0.495-0.38,0.683,0l1.596,3.234c0.188,0.38,0.685,0.741,1.105,0.802
 	l3.569,0.519c0.42,0.061,0.515,0.353,0.211,0.649l-2.583,2.517c-0.304,0.296-0.494,0.88-0.422,1.298l0.61,3.555
 	c0.072,0.418-0.177,0.599-0.552,0.401l-3.192-1.678c-0.375-0.197-0.99-0.197-1.365,0l-3.192,1.678
 	c-0.375,0.197-0.624,0.017-0.552-0.401l0.61-3.555c0.072-0.418-0.118-1.002-0.422-1.298L0.678,6.24

public/images/ui/travis-ci-logo-hover.svg

@@ -37,18 +37,18 @@
 		l1.225,4.03l6.557,0.745l2.086-1.459l0.591-4.146c-1.67-0.305-4.111-0.671-7.103-0.9C24.561,21.237,22.299,21.514,22.164,21.523z
 		 M29.298,23.734c0.028,0.368-0.011,0.636-0.103,0.834c0.79-0.094,0.97,0.441,0.979,0.474c-0.573-0.276-1.2,0.073-2.342,0.095
 		c-0.849,0.031-1.562,0.041-1.609-1.292c-0.047-1.336,0.498-2.441,1.347-2.471C28.419,21.345,29.195,22.402,29.298,23.734z"/>
-	<path fill="#A0A1A2" d="M26.223,23.845c0.048,1.333,0.761,1.323,1.609,1.292c1.142-0.021,1.769-0.371,2.342-0.095
+	<path fill="#9d9d9d" d="M26.223,23.845c0.048,1.333,0.761,1.323,1.609,1.292c1.142-0.021,1.769-0.371,2.342-0.095
 		c-0.009-0.032-0.188-0.567-0.979-0.474c0.092-0.198,0.131-0.466,0.103-0.834c-0.104-1.332-0.879-2.39-1.729-2.36
 		C26.721,21.403,26.176,22.509,26.223,23.845z M27.489,22.22c0.239-0.005,0.438,0.186,0.441,0.426
 		c0.005,0.239-0.187,0.438-0.425,0.442c-0.24,0.004-0.438-0.188-0.442-0.428C27.058,22.421,27.25,22.224,27.489,22.22z"/>
-	<path fill="#A0A1A2" d="M14.581,25.377c0.088,0.002,0.18,0,0.274-0.002c0.082,0,0.164-0.002,0.25-0.005
+	<path fill="#9d9d9d" d="M14.581,25.377c0.088,0.002,0.18,0,0.274-0.002c0.082,0,0.164-0.002,0.25-0.005
 		c0.851-0.008,1.556,0.072,1.545-1.262c-0.014-1.334-0.606-2.414-1.457-2.405c-0.849,0.008-1.671,1.102-1.622,2.435
 		c0.015,0.348,0.066,0.598,0.148,0.779c-0.74,0.187-0.945,0.644-0.957,0.673C13.228,25.339,13.755,25.375,14.581,25.377z
 		 M15.312,22.542c0.24-0.008,0.439,0.182,0.447,0.422c0.006,0.239-0.184,0.439-0.423,0.445c-0.24,0.008-0.44-0.183-0.446-0.422
 		C14.883,22.748,15.072,22.547,15.312,22.542z"/>
-	<polygon fill="#A0A1A2" points="17.309,8.327 19.695,8.327 19.695,7.343 20.232,7.343 20.232,11.889 19.421,11.889 19.421,14.432 
+	<polygon fill="#9d9d9d" points="17.309,8.327 19.695,8.327 19.695,7.343 20.232,7.343 20.232,11.889 19.421,11.889 19.421,14.432
 		23.598,14.432 23.598,11.889 22.786,11.889 22.786,7.343 23.324,7.343 23.324,8.327 25.712,8.327 25.712,4.958 17.309,4.958 	"/>
-	<path fill="#A0A1A2" d="M39.689,14.823c-0.015-0.289-0.043-0.577-0.082-0.861c-0.02-0.144-0.041-0.288-0.071-0.429
+	<path fill="#9d9d9d" d="M39.689,14.823c-0.015-0.289-0.043-0.577-0.082-0.861c-0.02-0.144-0.041-0.288-0.071-0.429
 		c-0.028-0.146-0.056-0.281-0.103-0.44l-0.03-0.112l-0.079-0.063c-0.455-0.356-0.944-0.626-1.441-0.864
 		c-0.411-0.194-0.828-0.363-1.249-0.518c-1.177-3.264-3.197-6.158-5.856-8.173c-2.747-2.084-5.978-3.187-9.342-3.187
 		c-3.366,0-6.596,1.103-9.344,3.187C9.999,4.949,8.304,7.081,7.103,9.508H7.097c-0.325,0.657-0.617,1.333-0.867,2.028

public/images/ui/travis-ci-logo.svg

@@ -4,25 +4,25 @@
 <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
 	 width="100.266px" height="22px" viewBox="0 0 100.266 22" enable-background="new 0 0 100.266 22" xml:space="preserve">
 <g>
-	<path fill="#A3A3A3" d="M5.759,4.603H0V1.635h15.021v2.967H9.295v16.833H5.759V4.603z"/>
+	<path fill="#9d9d9d" d="M5.759,4.603H0V1.635h15.021v2.967H9.295v16.833H5.759V4.603z"/>
-	<path fill="#A3A3A3" d="M14.709,6.57h2.894l0.245,2.633h0.123c1.064-1.936,2.649-2.995,4.237-2.995c0.76,0,1.247,0.09,1.705,0.301
+	<path fill="#9d9d9d" d="M14.709,6.57h2.894l0.245,2.633h0.123c1.064-1.936,2.649-2.995,4.237-2.995c0.76,0,1.247,0.09,1.705,0.301
 		l-0.61,3.028c-0.518-0.152-0.914-0.242-1.554-0.242c-1.188,0-2.62,0.817-3.534,3.059v9.082h-3.504V6.57H14.709z"/>
-	<path fill="#A3A3A3" d="M33.481,11.93c-0.032-1.574-0.702-2.907-2.713-2.907c-1.492,0-2.895,0.665-4.205,1.452l-1.281-2.331
+	<path fill="#9d9d9d" d="M33.481,11.93c-0.032-1.574-0.702-2.907-2.713-2.907c-1.492,0-2.895,0.665-4.205,1.452l-1.281-2.331
 		c1.646-1.03,3.748-1.937,6.125-1.937c3.75,0,5.578,2.271,5.578,6.417v8.812H34.12l-0.272-1.634h-0.094
 		c-1.34,1.12-2.864,1.998-4.631,1.998c-2.622,0-4.45-1.758-4.45-4.36C24.673,14.26,27.355,12.595,33.481,11.93z M30.219,19.075
 		c1.22,0,2.165-0.605,3.263-1.636v-3.33c-4.056,0.516-5.396,1.574-5.396,3.059C28.085,18.499,28.97,19.075,30.219,19.075z"/>
-	<path fill="#A3A3A3" d="M37.988,6.57h3.566l2.376,7.721c0.396,1.453,0.854,2.967,1.249,4.48h0.123
+	<path fill="#9d9d9d" d="M37.988,6.57h3.566l2.376,7.721c0.396,1.453,0.854,2.967,1.249,4.48h0.123
 		c0.428-1.515,0.853-3.027,1.28-4.48l2.376-7.721h3.384l-5.089,14.866h-4.054L37.988,6.57z"/>
-	<path fill="#A3A3A3" d="M53.655,1.999C53.655,0.817,54.569,0,55.817,0c1.25,0,2.164,0.817,2.164,1.999
+	<path fill="#9d9d9d" d="M53.655,1.999C53.655,0.817,54.569,0,55.817,0c1.25,0,2.164,0.817,2.164,1.999
 		c0,1.15-0.914,1.968-2.164,1.968C54.569,3.966,53.655,3.148,53.655,1.999z M54.051,6.57h3.505v14.866h-3.505V6.57z"/>
-	<path fill="#A3A3A3" d="M61.21,17.501c1.341,1.026,2.62,1.664,4.144,1.664c1.617,0,2.377-0.757,2.377-1.785
+	<path fill="#9d9d9d" d="M61.21,17.501c1.341,1.026,2.62,1.664,4.144,1.664c1.617,0,2.377-0.757,2.377-1.785
 		c0-1.243-1.613-1.789-3.201-2.394c-1.979-0.728-4.202-1.848-4.202-4.327c0-2.607,2.102-4.452,5.454-4.452
 		c2.071,0,3.75,0.848,4.967,1.786l-1.614,2.119c-1.036-0.756-2.102-1.271-3.291-1.271c-1.495,0-2.194,0.696-2.194,1.634
 		c0,1.151,1.493,1.636,3.106,2.21c2.044,0.758,4.298,1.728,4.298,4.513c0,2.542-2.042,4.603-5.819,4.603
 		c-2.041,0-4.207-0.878-5.668-2.061L61.21,17.501z"/>
-	<path fill="#A3A3A3" d="M88.242,1.272c2.436,0,4.418,1.18,5.667,2.512l-1.95,2.181c-1.036-1-2.162-1.635-3.688-1.635
+	<path fill="#9d9d9d" d="M88.242,1.272c2.436,0,4.418,1.18,5.667,2.512l-1.95,2.181c-1.036-1-2.162-1.635-3.688-1.635
 		c-3.263,0-5.607,2.726-5.607,7.176c0,4.512,2.164,7.234,5.483,7.234c1.77,0,3.077-0.725,4.207-1.965l1.949,2.148
 		c-1.614,1.846-3.685,2.876-6.216,2.876c-5.06,0-9.05-3.636-9.05-10.204C79.038,5.117,83.121,1.272,88.242,1.272z"/>
-	<path fill="#A3A3A3" d="M96.467,1.635H100v19.801h-3.533V1.635z"/>
+	<path fill="#9d9d9d" d="M96.467,1.635H100v19.801h-3.533V1.635z"/>
 </g>
 </svg>

tests/pages/dashboard.js

@@ -0,0 +1,11 @@
+import PageObject from 'travis/tests/page-object';
+
+let {
+  visitable
+} = PageObject;
+
+export default PageObject.create({
+
+
+
+});