diff --git a/app/styles/app.scss b/app/styles/app.scss index 46d67ebd..8aa8626b 100644 --- a/app/styles/app.scss +++ b/app/styles/app.scss @@ -62,5 +62,6 @@ @import "app/layouts/sidebar"; @import "app/layouts/build-job"; @import "app/layouts/sidebar"; -@import "app/top"; @import "app/layouts/profile"; +@import "app/layouts/top"; +// @import "app/top"; diff --git a/app/styles/app/layouts/top.sass b/app/styles/app/layouts/top.sass new file mode 100644 index 00000000..2fc8f5a1 --- /dev/null +++ b/app/styles/app/layouts/top.sass @@ -0,0 +1,117 @@ +$top-height: 55px + +.logo + position: relative + margin: 0 1.5rem 0 1.3rem + float: left + a + display: block + width: 100px + height: $top-height + z-index: 999 + border: none !important + text-indent : -9999px + transition: background-color 200ms ease + background : inline-image('svg/travis-ci-logo.svg') no-repeat 0 50% + &:hover + background : $cream-light inline-image('svg/travis-ci-logo-hover.svg') no-repeat 50% + +.burger + overflow: auto + height: $top-height + @media #{$medium-up} + display: none + + .burger-btn + float: right + font-size: 50px + background: none + border: none + line-height: 1 + color: $grey1 + outline: none !important + @include clearfix + &:hover + cursor: pointer + + +.topbar + font-size: $font-size-m + background-color: #eff0ec + color: $grey1 + + a + display: block + color: #898989 + border-bottom: solid 1px #eff0ec + padding: 0 .2em + + @media #{$small-only} + .navigation + height: 0 + overflow: hidden + &.is-open + height: auto + a + padding: .5em 1em + + .navigation, + .navigation-nested + @include resetul + + .navigation-handle + position: relative + margin: 0 + + .navigation--profile + img + border-radius: 50%; + width: 2.7rem; + height: 2.7rem; + margin-left: 1rem; + transform: translateY(-0.1rem); + + .navigation-sub + position: relative + + @media #{$medium-up} + height: $top-height + + .navigation + height: $top-height + > li + display: inline-block + margin-right: 1rem + a + height: $top-height + line-height: $top-height + 2px + border: none + &:hover + text-decoration: underline + + .navigation--profile + float: right + + .navigation--profile.signed-out, + .navigation--profile.signing-in + line-height: $top-height - 5px + + .navigation-nested + display: none + position: absolute + top: $top-height + left: -1em + z-index: 90 + background-color: #eff0ec + a + height: 35px + line-height: 35px + padding: 0 2em + white-space: nowrap + &:hover + text-decoration: none + background-color: $cream-light + + .navigation-handle:hover + .navigation-nested, + .navigation-nested:hover + display: block diff --git a/app/styles/app/modules/buttons.sass b/app/styles/app/modules/buttons.sass index 079305aa..e8d35b10 100644 --- a/app/styles/app/modules/buttons.sass +++ b/app/styles/app/modules/buttons.sass @@ -52,39 +52,37 @@ $button-border-color: #d4d4d4 border: 1px solid #40454F cursor: pointer -#top - .button--signin, - .button--signingin - display: inline-block - margin-right: 1em - color: $white - font-size: $font-size-small - line-height: 1 +.button--signin, +.button--signingin + display: inline-block + color: $white + font-size: $font-size-small + line-height: 1 + text-decoration: none + border-radius: 4px + border: none + vertical-align: middle + background: + color: $pass-color + +.button--signin + padding: 0.6em 2em 0.55em 0.6em + cursor: pointer + background: + image: inline-image('ui/github-signin.svg') + repeat: no-repeat + position: 95.5% 45% + &:hover + background-color: #73c78d text-decoration: none - border-radius: 4px - border: none - vertical-align: middle - background: - color: $pass-color - .button--signin - padding: 0.6em 2em 0.55em 0.6em - cursor: pointer - background: - image: inline-image('ui/github-signin.svg') - repeat: no-repeat - position: 95.5% 45% - &:hover - background-color: #73c78d - 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--signingin + padding: 0.6em 0.6em 0.45em + span + display: inline-block + padding: 0 .2em + position: relative + top: -0.15em .btn @extend .button diff --git a/app/templates/build.hbs b/app/templates/build.hbs index bc4998ae..d467cdb4 100644 --- a/app/templates/build.hbs +++ b/app/templates/build.hbs @@ -61,7 +61,7 @@
  • {{#if build.isFinished}}ran{{else}}running{{/if}} for {{format-duration build.duration}} -
  • +
  • {{format-time build.finishedAt}}
    • diff --git a/app/templates/top.hbs b/app/templates/top.hbs index cd09b2a9..741760d1 100644 --- a/app/templates/top.hbs +++ b/app/templates/top.hbs @@ -1,52 +1,33 @@ -
    - {{#link-to "main"}} - - {{/link-to}} - +
    +

    {{#link-to "main"}}Travis{{/link-to}}

    \ No newline at end of file diff --git a/public/images/svg/travis-ci-logo-hover.svg b/public/images/svg/travis-ci-logo-hover.svg new file mode 100644 index 00000000..65180c03 --- /dev/null +++ b/public/images/svg/travis-ci-logo-hover.svg @@ -0,0 +1,106 @@ + + + + + + + + + + + + + + + + + + + + diff --git a/public/images/svg/travis-ci-logo.svg b/public/images/svg/travis-ci-logo.svg new file mode 100644 index 00000000..f6631801 --- /dev/null +++ b/public/images/svg/travis-ci-logo.svg @@ -0,0 +1,28 @@ + + + + + + + + + + + + + + +