suzanne.soy/travis-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add new tab styles

Browse Source
This commit is contained in:
Lisa Passing 2015-03-09 14:58:38 +01:00
parent c77ed00425
commit 1483a0e86c
7 changed files with 119 additions and 119 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/styles/app.scss
View File

@ -21,7 +21,7 @@
@import "app/main/annotations"; @import "app/main/annotations";
@import "app/main/list"; @import "app/main/list";
@import "app/main/log"; @import "app/main/log";
@import "app/main/repository"; // @import "app/main/repository";
@import "app/main/sponsors"; @import "app/main/sponsors";
@import "app/main/summary"; @import "app/main/summary";
// @import "app/main/tools"; // @import "app/main/tools";

6
app/styles/app/_mixins/vars.sass
View File

@ -1,4 +1,8 @@
// colors
$teal1: #5FA5A4
$teal2: #63A4A3
$blue-grey: #404650 $blue-grey: #404650
$blue-grey-light: #d8e2e6 $blue-grey-light: #d8e2e6
$light-gray: #e9e9e7 $light-gray: #e9e9e7
@ -26,7 +30,7 @@ $error-color: $fail-color
$start-color: #D2C93B $start-color: #D2C93B
$start-bg-color: #D2CA24 $start-bg-color: #D2CA24
$cancel-color: #A1A0A0 $cancel-color: #A1A0A0
$dropdown-color: #5FA5A4 $dropdown-color: $teal1
$dashboard-text-color: #9d9fa1 $dashboard-text-color: #9d9fa1

20
app/styles/app/layouts/buildheader.sass
View File

@ -9,8 +9,6 @@
.repo .repo
font-size: $font-size-normal font-size: $font-size-normal
color: $grey color: $grey
// a
// color: $grey
.repo-header .repo-header
header header
@ -59,12 +57,18 @@
.repo-menus .repo-menus
@media #{$medium-up} @media #{$medium-up}
.dropdown .dropdown
float: right position: absolute
top: -1.1em
right: 0
z-index: 50
.tabnav .tabnav
float: left position: absolute
margin-bottom: .7em top: -0.6em
.tabbody .repo-menu-header
clear: both position: relative
height: 1.6em
margin-bottom: 1em
border-bottom: solid $cream-dark 2px
.repo-main-commit .repo-main-commit
&, &,
@ -94,7 +98,7 @@
width: 22px width: 22px
height: 22px height: 22px
margin-right: .4em margin-right: .4em
vertical-align: middle vertical-align: top
border-radius: 50% border-radius: 50%
@media #{$medium-up} @media #{$medium-up}
position: absolute position: absolute

158
app/styles/app/main/repository.sass
View File

@ -1,94 +1,94 @@
#repo // #repo
position: relative // position: relative
width: 100% // width: 100%
overflow-x: hidden // overflow-x: hidden
padding: 1px 0 0 10px // padding: 1px 0 0 10px
h3 // h3
margin-right: 5px // margin-right: 5px
.status-image // .status-image
display: inline-block // display: inline-block
position: relative // position: relative
width: 90px // width: 90px
height: 25px // height: 25px
vertical-align: top // vertical-align: top
a#status-image-popup // a#status-image-popup
display: inline-block // display: inline-block
opacity: 1.0 // opacity: 1.0
img // img
border: none // border: none
.github-icon // .github-icon
width: 21px // width: 21px
height: 21px // height: 21px
display: inline-block // display: inline-block
position: relative // position: relative
vertical-align: top // vertical-align: top
img // img
opacity: 0.65 // opacity: 0.65
.not-found // .not-found
display: block // display: block
padding: 10px 5px // padding: 10px 5px
font-size: 12px // font-size: 12px
.description, .language // .description, .language
font-weight: normal // font-weight: normal
font-size: 15px // font-size: 15px
.description // .description
margin: 10px 0 35px 0 // margin: 10px 0 35px 0
color: #9ca0a7 // color: #9ca0a7
.language // .language
display: none // display: none
padding-right: 5px // padding-right: 5px
color: #666a72 // color: #666a72
.github-stats // .github-stats
position: absolute // position: absolute
top: 15px // top: 15px
right: 10px // right: 10px
> * // > *
float: left // float: left
a // a
height: 16px // height: 16px
display: block // display: block
font-size: $font-size-smaller // font-size: $font-size-smaller
font-weight: bold // font-weight: bold
text-decoration: none // text-decoration: none
margin-left: 10px // margin-left: 10px
padding-left: 20px // padding-left: 20px
background: no-repeat 0px 2px // background: no-repeat 0px 2px
color: $color-text-light // color: $color-text-light
&.watchers // &.watchers
background-image: inline-image('ui/github-watchers.png') // background-image: inline-image('ui/github-watchers.png')
&.forks // &.forks
background-image: inline-image('ui/github-forks.png') // background-image: inline-image('ui/github-forks.png')
.tab dd // .tab dd
a[href^="https://github.com"], // a[href^="https://github.com"],
a[href^="http://github.com"], // a[href^="http://github.com"],
a[href^="https://www.github.com"], // a[href^="https://www.github.com"],
a[href^="http://www.github.com"] // a[href^="http://www.github.com"]
&:hover // &:hover
background: transparent url(/images/icons/github.png) center right no-repeat // background: transparent url(/images/icons/github.png) center right no-repeat
background-size: 12px // background-size: 12px
opacity: 1 // opacity: 1
padding-right: 16px // padding-right: 16px
@media #{$large-up} // @media #{$large-up}
h3 // h3
display: inline-block // display: inline-block
.github-icon // .github-icon
display: inline-block // display: inline-block
top: 17px // top: 17px
margin-right: 1em // margin-right: 1em
.status-image // .status-image
top: 18px // top: 18px

39
app/styles/app/modules/tabs.sass
View File

@ -2,46 +2,37 @@
.tabnav .tabnav
ul ul
@include resetul @include resetul
@include border-top-radius(4px)
width: 100% width: 100%
background-color: $cream-light background-color: $cream-light
clear: both clear: both
@media #{$small-only} @media #{$small-only}
margin-top: 2em margin-top: 2em
li li
&:first-child a @media #{$small-only}
border-top-left-radius: 4px margin-bottom: .8em
&:last-child a
border-top-right-radius: 4px
a a
@extend %inline-block @extend %inline-block
width: 100% width: 100%
border: 2px solid transparent color: $grey2
padding: .3em 1em .2em padding: .2em 0
.active .active
position: relative
a a
border-top-color: $cream-dark color: $teal2
border-left-color: $cream-dark
border-right-color: $cream-dark
background-color: $white
&:after &:after
content: none content: ""
position: absolute
left: 0
bottom: -4px
width: 100%
height: 2px
background-color: $teal2
@media #{$medium-up} @media #{$medium-up}
ul ul
@extend %inline-block @extend %inline-block
li li
float: left float: left
// &:last-child padding-right: 2em
// a:after
// content: none
// a
// &:after
// content: ""
// position: relative
// left: 1.3em
// display: inline-block
// width: 2px
// height: 10px
// background-color: $cream-dark

2
app/styles/app/modules/tiles.sass
View File

@ -16,6 +16,8 @@
@include grid-column(9) @include grid-column(9)
.tile-additional .tile-additional
@media #{$small-only}
margin-top: 1em
@media #{$xlarge-up} @media #{$xlarge-up}
@include grid-column(3) @include grid-column(3)

5
app/templates/repo.hbs
View File

@ -17,15 +17,14 @@
<p class="description">{{description}}</p> <p class="description">{{description}}</p>
</header> </header>
<div class="repo-menus"> <div class="repo-menus">
<div class="repo-menu-header">
{{view 'repo-show-tools'}} {{view 'repo-show-tools'}}
{{view 'repo-show-tabs'}} {{view 'repo-show-tabs'}}
</div>
<div class="tabbody repo-main"> <div class="tabbody repo-main">
{{outlet}} {{outlet}}
</div> </div>
</div>
</article> </article>
{{else}} {{else}}