try cleanup and modularizing
This commit is contained in:
Lisa Passing
parent
9f4e408242
commit
4dde61bad9
|
|
@ -1,21 +1,17 @@
|
||||||
<div class="wrapper">
|
<div class="centered">
|
||||||
<div id="top">
|
<div class="wrapper">
|
||||||
<div class="row">
|
<div id="top">
|
||||||
<div class="small-2 medium-2 columns" id="logo">
|
<div class="row">
|
||||||
<h1>{{#link-to "main"}}Home{{/link-to}}</h1>
|
<div class="small-2 medium-2 columns" id="logo">
|
||||||
</div>
|
<h1>{{#link-to "main"}}Home{{/link-to}}</h1>
|
||||||
<div class="small-4 medium-3 columns" id="nav">
|
</div>
|
||||||
<ul>
|
<ul>
|
||||||
<li><a href="#">Docs</a></li>
|
<li><a href="#">Docs</a></li>
|
||||||
<li><a href="#">Blog</a></li>
|
<li><a href="#">Blog</a></li>
|
||||||
</ul>
|
<!-- <div class="small-4 medium-3 columns" id="status">
|
||||||
</div>
|
<div class="status-graph">Status Graph</div>
|
||||||
<!-- <div class="small-4 medium-3 columns" id="status">
|
</div> -->
|
||||||
<div class="status-graph">Status Graph</div>
|
<li class="menu float-right user">
|
||||||
</div> -->
|
|
||||||
<div class="small-2 medium-5 columns no-padding" id="user">
|
|
||||||
<ul>
|
|
||||||
<li class="menu">
|
|
||||||
<p class="handle">
|
<p class="handle">
|
||||||
{{#if auth.signedOut}}
|
{{#if auth.signedOut}}
|
||||||
<a class="signed-out" href="#" {{action "signIn" target="auth"}}>Sign in with GitHub</a>
|
<a class="signed-out" href="#" {{action "signIn" target="auth"}}>Sign in with GitHub</a>
|
||||||
|
|
@ -28,59 +24,59 @@
|
||||||
{{/if}}
|
{{/if}}
|
||||||
</p>
|
</p>
|
||||||
<ul>
|
<ul>
|
||||||
<li>Help</li>
|
<li><a href="#" title="">Help</a></li>
|
||||||
<li><a href="/" {{action "signOut" target="auth"}}>Sign Out</a></li>
|
<li><a href="/" {{action "signOut" target="auth"}}>Sign Out</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
{{yield}}
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{{yield}}
|
<footer>
|
||||||
|
<div class="row">
|
||||||
|
<div class="small-6 medium-4 large-4 columns">
|
||||||
|
<img src="/images/dashboard/footer-logo.svg">
|
||||||
|
</div>
|
||||||
|
<div class="small-6 medium-2 large-2 columns">
|
||||||
|
<h3>©Travis CI, GmbH</h3>
|
||||||
|
<ul>
|
||||||
|
<li>Rigaer Straße 8</li>
|
||||||
|
<li>10247 Berlin, Germany</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="small-6 medium-2 large-2 columns">
|
||||||
|
<h3>Help</h3>
|
||||||
|
<ul>
|
||||||
|
<li><a href="#">Documentation</a></li>
|
||||||
|
<li><a href="#">Blog</a></li>
|
||||||
|
<li><a href="#">Email</a></li>
|
||||||
|
<li><a href="#">Live Chat</a></li>
|
||||||
|
<li><a href="#">Twitter</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="small-6 medium-2 large-2 columns">
|
||||||
|
<h3>Legal</h3>
|
||||||
|
<ul>
|
||||||
|
<li><a href="#">Imprint</a></li>
|
||||||
|
<li><a href="#">Terms of Service</a></li>
|
||||||
|
<li><a href="#">Privacy Policy</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="small-6 medium-2 large-2 columns">
|
||||||
|
<h3>Travis CI Status</h3>
|
||||||
|
<ul>
|
||||||
|
<li><div class="status-circle">Status:</div>
|
||||||
|
<a href="#">Travis CI Status</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<footer>
|
|
||||||
<div class="row">
|
|
||||||
<div class="small-6 medium-4 large-4 columns">
|
|
||||||
<img src="/images/dashboard/footer-logo.svg">
|
|
||||||
</div>
|
|
||||||
<div class="small-6 medium-2 large-2 columns">
|
|
||||||
<h3>©Travis CI, GmbH</h3>
|
|
||||||
<ul>
|
|
||||||
<li>Rigaer Straße 8</li>
|
|
||||||
<li>10247 Berlin, Germany</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="small-6 medium-2 large-2 columns">
|
|
||||||
<h3>Help</h3>
|
|
||||||
<ul>
|
|
||||||
<li><a href="#">Documentation</a></li>
|
|
||||||
<li><a href="#">Blog</a></li>
|
|
||||||
<li><a href="#">Email</a></li>
|
|
||||||
<li><a href="#">Live Chat</a></li>
|
|
||||||
<li><a href="#">Twitter</a></li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="small-6 medium-2 large-2 columns">
|
|
||||||
<h3>Legal</h3>
|
|
||||||
<ul>
|
|
||||||
<li><a href="#">Imprint</a></li>
|
|
||||||
<li><a href="#">Terms of Service</a></li>
|
|
||||||
<li><a href="#">Privacy Policy</a></li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="small-6 medium-2 large-2 columns">
|
|
||||||
<h3>Travis CI Status</h3>
|
|
||||||
<ul>
|
|
||||||
<li><div class="status-circle">Status:</div>
|
|
||||||
<a href="#">Travis CI Status</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</footer>
|
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,9 @@
|
||||||
|
|
||||||
|
$blue-grey: #404650
|
||||||
|
|
||||||
$logo-red: #dc4136
|
$logo-red: #dc4136
|
||||||
|
|
||||||
$topbar-bg: #404650
|
$topbar-bg: $blue-grey
|
||||||
$topbar-bg-darker: #31363d
|
$topbar-bg-darker: #31363d
|
||||||
|
|
||||||
$main-repo-link-color: #50555b
|
$main-repo-link-color: #50555b
|
||||||
|
|
@ -10,4 +12,20 @@ $main-repo-hover-color: #607a84
|
||||||
$travis-lint-color: #9b9d9e
|
$travis-lint-color: #9b9d9e
|
||||||
$travis-lint-bg: #fafafa
|
$travis-lint-bg: #fafafa
|
||||||
|
|
||||||
$left-bg: #e9e9e7
|
$left-bg: #e9e9e7
|
||||||
|
|
||||||
|
// dashboard
|
||||||
|
$pass-color: #3ba85d
|
||||||
|
$fail-color: #d04729
|
||||||
|
$error-color: #999999
|
||||||
|
$start-color: #848032
|
||||||
|
$start-bg-color: #D2CA24
|
||||||
|
|
||||||
|
//wrapper
|
||||||
|
$wrapper-bg-color: #f4f3ea
|
||||||
|
|
||||||
|
// footer
|
||||||
|
$footer-color: $blue-grey
|
||||||
|
$footer-bg-color: #e0e0e0
|
||||||
|
$footer-h3-color: #8f9ba2
|
||||||
|
$footer-h3-corder-color: #ccd0d5
|
||||||
89
assets/styles/app/components/loader.sass
Normal file
89
assets/styles/app/components/loader.sass
Normal file
|
|
@ -0,0 +1,89 @@
|
||||||
|
|
||||||
|
|
||||||
|
#loader-container-large
|
||||||
|
margin-top: 2em
|
||||||
|
height : 70px
|
||||||
|
text-align : center
|
||||||
|
|
||||||
|
#loader-container-large .load-text
|
||||||
|
font-size : 25px
|
||||||
|
line-height : 30px
|
||||||
|
font-weight : 300
|
||||||
|
margin-top : 20px
|
||||||
|
font-weight: 400
|
||||||
|
|
||||||
|
.loader-large
|
||||||
|
width : 60px
|
||||||
|
height : 60px
|
||||||
|
position : relative
|
||||||
|
margin : 0 auto
|
||||||
|
|
||||||
|
#loader-container-medium
|
||||||
|
height : 40px
|
||||||
|
margin-top : 15px
|
||||||
|
text-align : center
|
||||||
|
|
||||||
|
#loader-container-medium .load-text
|
||||||
|
vertical-align : 10px
|
||||||
|
display : inline-block
|
||||||
|
|
||||||
|
.loader-medium
|
||||||
|
width : 30px
|
||||||
|
height : 30px
|
||||||
|
position : relative
|
||||||
|
display : inline-block
|
||||||
|
margin : 0 auto
|
||||||
|
margin-right : 10px
|
||||||
|
|
||||||
|
#loader-container-small
|
||||||
|
height : 20px
|
||||||
|
margin-top : 22px
|
||||||
|
text-align : center
|
||||||
|
|
||||||
|
#loader-container-small .load-text
|
||||||
|
vertical-align : 3px
|
||||||
|
display : inline-block
|
||||||
|
|
||||||
|
.loader-small
|
||||||
|
width : 15px
|
||||||
|
height : 15px
|
||||||
|
position : relative
|
||||||
|
display : inline-block
|
||||||
|
margin : 0 auto
|
||||||
|
margin-right : 5px
|
||||||
|
|
||||||
|
.load-circle1, .load-circle2
|
||||||
|
width : 100%
|
||||||
|
height : 100%
|
||||||
|
border-radius : 50%
|
||||||
|
opacity : 0.7
|
||||||
|
position : absolute
|
||||||
|
top : 0
|
||||||
|
left : 0
|
||||||
|
-webkit-animation : bounce 1.5s infinite ease-in-out
|
||||||
|
animation : bounce 1.5s infinite ease-in-out
|
||||||
|
|
||||||
|
.load-circle1
|
||||||
|
background-color : #347389
|
||||||
|
|
||||||
|
.load-circle2
|
||||||
|
background-color : #bdc5c5
|
||||||
|
-webkit-animation-delay : -0.5s
|
||||||
|
animation-delay : -0.5s
|
||||||
|
|
||||||
|
@-webkit-keyframes bounce
|
||||||
|
0%, 100%
|
||||||
|
-webkit-transform : scale(0.0)
|
||||||
|
|
||||||
|
60%
|
||||||
|
-webkit-transform : scale(1.0)
|
||||||
|
|
||||||
|
|
||||||
|
@keyframes bounce
|
||||||
|
0%, 100%
|
||||||
|
transform : scale(0.0)
|
||||||
|
-webkit-transform : scale(0.0)
|
||||||
|
60%
|
||||||
|
transform: scale(1.0)
|
||||||
|
-webkit-transform : scale(1.0)
|
||||||
|
|
||||||
|
|
@ -1,6 +1,11 @@
|
||||||
.settings-row
|
.settings-row
|
||||||
margin-top: 20px
|
margin-top: 20px
|
||||||
|
|
||||||
|
.settings-row,
|
||||||
|
.short-settings-element
|
||||||
|
& > *
|
||||||
|
box-sizing: content-box
|
||||||
|
|
||||||
a.travis-switch
|
a.travis-switch
|
||||||
margin: 0 10px 0 0
|
margin: 0 10px 0 0
|
||||||
|
|
||||||
|
|
@ -26,8 +31,8 @@ p.settings-row
|
||||||
&:before
|
&:before
|
||||||
content: ""
|
content: ""
|
||||||
position: absolute
|
position: absolute
|
||||||
top: 1px
|
top: 2px
|
||||||
left: 1px
|
left: 2px
|
||||||
width: 3.5em
|
width: 3.5em
|
||||||
height: 1.9em
|
height: 1.9em
|
||||||
background: #e9e9e7
|
background: #e9e9e7
|
||||||
|
|
|
||||||
|
|
@ -1,40 +1,13 @@
|
||||||
@import "app/_mixins/all"
|
@import "app/_mixins/all"
|
||||||
|
|
||||||
$left-width: 250px
|
|
||||||
|
|
||||||
// @mixin display-flex
|
.centered .row
|
||||||
// display: -webkit-flex
|
max-width: 1024px
|
||||||
// display: -moz-flex
|
|
||||||
// display: -ms-flexbox
|
|
||||||
// display: flex
|
|
||||||
|
|
||||||
// @mixin flex($grow, $shrink, $size)
|
|
||||||
// -ms-flex: $grow $shrink $size
|
|
||||||
// -webkit-flex: $grow $shrink $size
|
|
||||||
// -moz-flex: $grow $shrink $size
|
|
||||||
// flex: $grow $shrink $size
|
|
||||||
|
|
||||||
// html, body
|
|
||||||
// min-height: 100vh
|
|
||||||
|
|
||||||
// body > div:first-child
|
|
||||||
// min-height: 100vh
|
|
||||||
|
|
||||||
.main, .profile-view
|
.main, .profile-view
|
||||||
position: relative
|
position: relative
|
||||||
width: 100%
|
width: 100%
|
||||||
min-height: 100vh
|
min-height: 100vh
|
||||||
// margin-top: 40px
|
|
||||||
//@include display-flex
|
|
||||||
|
|
||||||
// #top
|
|
||||||
// position: absolute
|
|
||||||
// top: -40px
|
|
||||||
// left: 0
|
|
||||||
// width: 100%
|
|
||||||
// min-width: 930px
|
|
||||||
// height: 55px
|
|
||||||
// z-index: 1000
|
|
||||||
|
|
||||||
#auth, #not-found, #simple
|
#auth, #not-found, #simple
|
||||||
#top
|
#top
|
||||||
|
|
@ -47,7 +20,6 @@ $left-width: 250px
|
||||||
#left, #right
|
#left, #right
|
||||||
position: relative
|
position: relative
|
||||||
min-height: 100%
|
min-height: 100%
|
||||||
//@include flex(0, 0, 25em)
|
|
||||||
|
|
||||||
#left
|
#left
|
||||||
float: left
|
float: left
|
||||||
|
|
@ -55,14 +27,6 @@ $left-width: 250px
|
||||||
background-color: #fbfbfa
|
background-color: #fbfbfa
|
||||||
border-right: 1px solid $color-border-normal
|
border-right: 1px solid $color-border-normal
|
||||||
|
|
||||||
@media #{$medium-up}
|
|
||||||
#left
|
|
||||||
width: grid-calc(8, 24)
|
|
||||||
@media #{$large-up}
|
|
||||||
#left
|
|
||||||
width: grid-calc(5, 24)
|
|
||||||
max-width: 300px
|
|
||||||
|
|
||||||
.duration_label
|
.duration_label
|
||||||
display: inline-block
|
display: inline-block
|
||||||
height: 11px
|
height: 11px
|
||||||
|
|
@ -78,13 +42,27 @@ $left-width: 250px
|
||||||
padding: 20px 30px 80px
|
padding: 20px 30px 80px
|
||||||
|
|
||||||
@media #{$medium-up}
|
@media #{$medium-up}
|
||||||
#main
|
#left
|
||||||
width: grid-calc(16, 24)
|
width: grid-calc(3, 12)
|
||||||
|
float: left
|
||||||
|
#right
|
||||||
|
width: grid-calc(2, 12)
|
||||||
float: right
|
float: right
|
||||||
@media #{$medium-up}
|
// #main
|
||||||
|
// width: grid-calc(16, 12)
|
||||||
|
// float: right
|
||||||
#main
|
#main
|
||||||
width: grid-calc(19, 24)
|
width: grid-calc(7, 12)
|
||||||
float: right
|
float: left
|
||||||
|
|
||||||
|
|
||||||
|
@media #{$large-up}
|
||||||
|
// #left
|
||||||
|
// width: grid-calc(5, 24)
|
||||||
|
// max-width: 300px
|
||||||
|
// #main
|
||||||
|
// width: grid-calc(19, 24)
|
||||||
|
// float: right
|
||||||
|
|
||||||
.travis-lint
|
.travis-lint
|
||||||
background-color: $travis-lint-bg
|
background-color: $travis-lint-bg
|
||||||
|
|
|
||||||
|
|
@ -1,3 +1,9 @@
|
||||||
|
/*
|
||||||
|
* Dashboard
|
||||||
|
* @todo: split into components: filter, search, tiles
|
||||||
|
*/
|
||||||
|
|
||||||
|
@import "app/_mixins/all"
|
||||||
|
|
||||||
.current-org-avatar
|
.current-org-avatar
|
||||||
display : inline-block
|
display : inline-block
|
||||||
|
|
@ -7,7 +13,7 @@
|
||||||
margin : -5px 5px 0 0
|
margin : -5px 5px 0 0
|
||||||
|
|
||||||
#filters-search
|
#filters-search
|
||||||
background : #ffffff
|
background : $white
|
||||||
font-size : 14px
|
font-size : 14px
|
||||||
padding : 5px 0 5px 0
|
padding : 5px 0 5px 0
|
||||||
max-height : 44px
|
max-height : 44px
|
||||||
|
|
@ -24,7 +30,7 @@
|
||||||
z-index : 1000
|
z-index : 1000
|
||||||
|
|
||||||
#filters ul li
|
#filters ul li
|
||||||
background : #fff
|
background : $white
|
||||||
position : relative
|
position : relative
|
||||||
display : inline-block
|
display : inline-block
|
||||||
padding : 10px 0 10px 0
|
padding : 10px 0 10px 0
|
||||||
|
|
@ -32,8 +38,6 @@
|
||||||
margin-top : 0
|
margin-top : 0
|
||||||
cursor : pointer
|
cursor : pointer
|
||||||
border-radius : 0px
|
border-radius : 0px
|
||||||
-webkit-border-radius : 0px
|
|
||||||
-moz-border-radius : 0px
|
|
||||||
|
|
||||||
#filters li.filters-start:hover
|
#filters li.filters-start:hover
|
||||||
background-color : #fff
|
background-color : #fff
|
||||||
|
|
@ -48,8 +52,6 @@
|
||||||
opacity : 0
|
opacity : 0
|
||||||
visibility : hidden
|
visibility : hidden
|
||||||
box-shadow : 2px 1px 4px 0px rgba(148,145,138,0.4)
|
box-shadow : 2px 1px 4px 0px rgba(148,145,138,0.4)
|
||||||
-webkit-box-shadow : 2px 1px 4px 0px rgba(148,145,138,0.4)
|
|
||||||
-moz-box-shadow : 2px 1px 4px 0px rgba(148,145,138,0.4)
|
|
||||||
|
|
||||||
#filters ul li ul li
|
#filters ul li ul li
|
||||||
display : block
|
display : block
|
||||||
|
|
@ -70,29 +72,27 @@
|
||||||
height : 20px
|
height : 20px
|
||||||
margin-right : 5px
|
margin-right : 5px
|
||||||
text-indent : -9999px
|
text-indent : -9999px
|
||||||
border-radius : 100px
|
border-radius : 100px
|
||||||
-webkit-border-radius : 100px
|
|
||||||
-moz-border-radius : 100px
|
|
||||||
|
|
||||||
.org-travisci
|
// .org-travisci
|
||||||
background : url('/images/dashboard/orgs-travisci.png') no-repeat
|
// background : url('/images/dashboard/orgs-travisci.png') no-repeat
|
||||||
background-size : contain
|
// background-size : contain
|
||||||
|
|
||||||
.org-saltinejustine
|
// .org-saltinejustine
|
||||||
background : url('/images/dashboard/orgs-saltinejustine.png') no-repeat
|
// background : url('/images/dashboard/orgs-saltinejustine.png') no-repeat
|
||||||
background-size : contain
|
// background-size : contain
|
||||||
|
|
||||||
.org-openkarma
|
// .org-openkarma
|
||||||
background : url('/images/dashboard/orgs-openkarma.png') no-repeat
|
// background : url('/images/dashboard/orgs-openkarma.png') no-repeat
|
||||||
background-size : contain
|
// background-size : contain
|
||||||
|
|
||||||
.org-eurucamp
|
// .org-eurucamp
|
||||||
background : url('/images/dashboard/orgs-eurucamp.png') no-repeat
|
// background : url('/images/dashboard/orgs-eurucamp.png') no-repeat
|
||||||
background-size : contain
|
// background-size : contain
|
||||||
|
|
||||||
#filters ul li ul li:hover
|
#filters ul li ul li:hover
|
||||||
background : #5e869a
|
background : #5e869a
|
||||||
color : #ffffff
|
color : $white
|
||||||
|
|
||||||
#filters ul li:hover ul
|
#filters ul li:hover ul
|
||||||
display : block
|
display : block
|
||||||
|
|
@ -111,7 +111,7 @@
|
||||||
z-index : 1000
|
z-index : 1000
|
||||||
|
|
||||||
#views ul li
|
#views ul li
|
||||||
background : #fff
|
background : $white
|
||||||
position : relative
|
position : relative
|
||||||
display : inline-block
|
display : inline-block
|
||||||
padding : 10px 0 10px 0
|
padding : 10px 0 10px 0
|
||||||
|
|
@ -151,7 +151,7 @@
|
||||||
|
|
||||||
#views ul li ul li:hover
|
#views ul li ul li:hover
|
||||||
background : #5e869a
|
background : #5e869a
|
||||||
color : #ffffff
|
color : $white
|
||||||
|
|
||||||
#views ul li:hover ul
|
#views ul li:hover ul
|
||||||
display : block
|
display : block
|
||||||
|
|
@ -204,15 +204,13 @@
|
||||||
padding : 30px 0 10px 0
|
padding : 30px 0 10px 0
|
||||||
|
|
||||||
.tile
|
.tile
|
||||||
background : #fff
|
background : $white
|
||||||
min-height : 125px
|
min-height : 125px
|
||||||
color : #9d9fa1
|
color : #9d9fa1
|
||||||
font-size : 14px
|
font-size : 14px
|
||||||
margin-bottom : 20px
|
margin-bottom : 20px
|
||||||
padding : 0 10px 0 0
|
padding : 0 10px 0 0
|
||||||
border-radius : 4px
|
border-radius : 4px
|
||||||
-webkit-border-radius : 4px
|
|
||||||
-moz-border-radius : 4px
|
|
||||||
|
|
||||||
.duration
|
.duration
|
||||||
background-image: url('/images/dashboard/time.svg')
|
background-image: url('/images/dashboard/time.svg')
|
||||||
|
|
@ -225,8 +223,6 @@
|
||||||
background-repeat: no-repeat
|
background-repeat: no-repeat
|
||||||
background-position: 0 1px
|
background-position: 0 1px
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
.finished
|
.finished
|
||||||
background-image: url('/images/dashboard/cal.svg')
|
background-image: url('/images/dashboard/cal.svg')
|
||||||
background-size : 11px 11px
|
background-size : 11px 11px
|
||||||
|
|
@ -239,7 +235,7 @@
|
||||||
margin-bottom: 0
|
margin-bottom: 0
|
||||||
|
|
||||||
.build-bar
|
.build-bar
|
||||||
position : absolute
|
position: absolute
|
||||||
background:
|
background:
|
||||||
repeat: no-repeat
|
repeat: no-repeat
|
||||||
position: 7px 10px
|
position: 7px 10px
|
||||||
|
|
@ -261,53 +257,43 @@
|
||||||
.passed
|
.passed
|
||||||
.build-bar
|
.build-bar
|
||||||
background:
|
background:
|
||||||
color: #3ba85d
|
color: $pass-color
|
||||||
image: url('/images/dashboard/status-passed.svg')
|
image: url('/images/dashboard/status-passed.svg')
|
||||||
|
|
||||||
|
|
||||||
.org,
|
.org,
|
||||||
.repo a,
|
.repo a,
|
||||||
.build-status a
|
.build-status a
|
||||||
color: #3ba85d
|
color: $pass-color
|
||||||
|
|
||||||
|
|
||||||
.failed
|
.failed
|
||||||
.build-bar
|
.build-bar
|
||||||
background:
|
background:
|
||||||
color: #d04729
|
color: $fail-color
|
||||||
image: url('/images/dashboard/status-failed.svg')
|
image: url('/images/dashboard/status-failed.svg')
|
||||||
|
|
||||||
|
|
||||||
.org,
|
.org,
|
||||||
.repo a,
|
.repo a,
|
||||||
.build-status a
|
.build-status a
|
||||||
color: #d04729
|
color: $fail-color
|
||||||
|
|
||||||
|
|
||||||
.started
|
.started
|
||||||
.build-bar
|
.build-bar
|
||||||
background:
|
background:
|
||||||
color: #D2CA24
|
color: $start-bg-color
|
||||||
image: url('/images/dashboard/status-pending.svg')
|
image: url('/images/dashboard/status-pending.svg')
|
||||||
|
|
||||||
|
|
||||||
.org,
|
.org,
|
||||||
.repo a,
|
.repo a,
|
||||||
.build-status a
|
.build-status a
|
||||||
color: #848032
|
color: $start-color
|
||||||
|
|
||||||
|
|
||||||
.errored
|
.errored
|
||||||
.build-bar
|
.build-bar
|
||||||
background:
|
background:
|
||||||
color: #999999
|
color: $error-color
|
||||||
image: url('/images/dashboard/status-errored.svg')
|
image: url('/images/dashboard/status-errored.svg')
|
||||||
|
|
||||||
|
|
||||||
.org,
|
.org,
|
||||||
.repo a,
|
.repo a,
|
||||||
.build-status a
|
.build-status a
|
||||||
color: #999999
|
color: $error-color
|
||||||
|
|
||||||
|
|
||||||
.tile .build-information
|
.tile .build-information
|
||||||
|
|
@ -326,8 +312,6 @@
|
||||||
line-height : 20px
|
line-height : 20px
|
||||||
text-overflow : ellipsis
|
text-overflow : ellipsis
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
.tile .star-feature
|
.tile .star-feature
|
||||||
position : absolute
|
position : absolute
|
||||||
top : 0
|
top : 0
|
||||||
|
|
@ -344,180 +328,19 @@
|
||||||
margin-left : 5px
|
margin-left : 5px
|
||||||
text-indent : -9999px
|
text-indent : -9999px
|
||||||
|
|
||||||
footer
|
|
||||||
padding : 20px 0
|
|
||||||
background-color : #e0e0e0
|
|
||||||
min-height : 334px
|
|
||||||
font-size : 12px
|
|
||||||
line-height : 22px
|
|
||||||
margin-top : -334px /* sticky footer */
|
|
||||||
|
|
||||||
.wrapper
|
|
||||||
padding-bottom: 334px
|
|
||||||
min-height: 100%
|
|
||||||
height: auto
|
|
||||||
background-color: #f4f3ea
|
|
||||||
@media (min-width: 640px)
|
|
||||||
.wrapper
|
|
||||||
padding-bottom: 204px
|
|
||||||
|
|
||||||
footer
|
|
||||||
margin-top: -204px
|
|
||||||
min-height: 204px
|
|
||||||
|
|
||||||
|
|
||||||
footer h3
|
|
||||||
font-size : 15px
|
|
||||||
margin : 0 0 10px 0
|
|
||||||
padding-top : 6px
|
|
||||||
font-weight : 400
|
|
||||||
color : #8f9ba2
|
|
||||||
border-top : solid 4px #ccd0d5
|
|
||||||
|
|
||||||
footer .row p
|
|
||||||
display : inline-block
|
|
||||||
margin : 0
|
|
||||||
|
|
||||||
footer .row ul,
|
|
||||||
footer .row li
|
|
||||||
display : block
|
|
||||||
color : #404650
|
|
||||||
line-height : 22px
|
|
||||||
padding : 0
|
|
||||||
margin-top : 0
|
|
||||||
list-style-type : none
|
|
||||||
|
|
||||||
footer a
|
|
||||||
text-decoration : none
|
|
||||||
display : inline-block
|
|
||||||
color : #404650
|
|
||||||
|
|
||||||
footer a:hover,
|
|
||||||
footer a:active
|
|
||||||
text-decoration : underline
|
|
||||||
|
|
||||||
a
|
|
||||||
text-decoration : none
|
|
||||||
display : block
|
|
||||||
color : #404650
|
|
||||||
|
|
||||||
.status-circle
|
|
||||||
background : #3ba85d
|
|
||||||
display : inline-block
|
|
||||||
height : 11px
|
|
||||||
width : 11px
|
|
||||||
text-indent : -9999px
|
|
||||||
margin-right : 5px
|
|
||||||
border-radius : 100px
|
|
||||||
-webkit-border-radius : 100px
|
|
||||||
-moz-border-radius : 100px
|
|
||||||
vertical-align: middle
|
|
||||||
|
|
||||||
|
|
||||||
@media only screen and (min-width: 64.063em)
|
@media only screen and (min-width: 64.063em)
|
||||||
#top img
|
#top img
|
||||||
margin : -7px 0 0 10px
|
margin : -7px 0 0 10px
|
||||||
|
|
||||||
|
|
||||||
@media only screen and (min-width: 640px)
|
@media only screen and (min-width: 640px)
|
||||||
#top #status li
|
#top #status li
|
||||||
display : inline-block
|
display : inline-block
|
||||||
|
|
||||||
|
|
||||||
#user p
|
#user p
|
||||||
display : inline-block
|
display : inline-block
|
||||||
|
|
||||||
|
|
||||||
#search
|
#search
|
||||||
float : right
|
float : right
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
#loader-container-large
|
|
||||||
margin-top: 2em
|
|
||||||
height : 70px
|
|
||||||
text-align : center
|
|
||||||
|
|
||||||
#loader-container-large .load-text
|
|
||||||
font-size : 25px
|
|
||||||
line-height : 30px
|
|
||||||
font-weight : 300
|
|
||||||
margin-top : 20px
|
|
||||||
font-weight: 400
|
|
||||||
|
|
||||||
.loader-large
|
|
||||||
width : 60px
|
|
||||||
height : 60px
|
|
||||||
position : relative
|
|
||||||
margin : 0 auto
|
|
||||||
|
|
||||||
#loader-container-medium
|
|
||||||
height : 40px
|
|
||||||
margin-top : 15px
|
|
||||||
text-align : center
|
|
||||||
|
|
||||||
#loader-container-medium .load-text
|
|
||||||
vertical-align : 10px
|
|
||||||
display : inline-block
|
|
||||||
|
|
||||||
.loader-medium
|
|
||||||
width : 30px
|
|
||||||
height : 30px
|
|
||||||
position : relative
|
|
||||||
display : inline-block
|
|
||||||
margin : 0 auto
|
|
||||||
margin-right : 10px
|
|
||||||
|
|
||||||
#loader-container-small
|
|
||||||
height : 20px
|
|
||||||
margin-top : 22px
|
|
||||||
text-align : center
|
|
||||||
|
|
||||||
#loader-container-small .load-text
|
|
||||||
vertical-align : 3px
|
|
||||||
display : inline-block
|
|
||||||
|
|
||||||
.loader-small
|
|
||||||
width : 15px
|
|
||||||
height : 15px
|
|
||||||
position : relative
|
|
||||||
display : inline-block
|
|
||||||
margin : 0 auto
|
|
||||||
margin-right : 5px
|
|
||||||
|
|
||||||
.load-circle1, .load-circle2
|
|
||||||
width : 100%
|
|
||||||
height : 100%
|
|
||||||
border-radius : 50%
|
|
||||||
opacity : 0.7
|
|
||||||
position : absolute
|
|
||||||
top : 0
|
|
||||||
left : 0
|
|
||||||
-webkit-animation : bounce 1.5s infinite ease-in-out
|
|
||||||
animation : bounce 1.5s infinite ease-in-out
|
|
||||||
|
|
||||||
.load-circle1
|
|
||||||
background-color : #347389
|
|
||||||
|
|
||||||
.load-circle2
|
|
||||||
background-color : #bdc5c5
|
|
||||||
-webkit-animation-delay : -0.5s
|
|
||||||
animation-delay : -0.5s
|
|
||||||
|
|
||||||
@-webkit-keyframes bounce
|
|
||||||
0%, 100%
|
|
||||||
-webkit-transform : scale(0.0)
|
|
||||||
|
|
||||||
60%
|
|
||||||
-webkit-transform : scale(1.0)
|
|
||||||
|
|
||||||
|
|
||||||
@keyframes bounce
|
|
||||||
0%, 100%
|
|
||||||
transform : scale(0.0)
|
|
||||||
-webkit-transform : scale(0.0)
|
|
||||||
60%
|
|
||||||
transform: scale(1.0)
|
|
||||||
-webkit-transform : scale(1.0)
|
|
||||||
|
|
||||||
|
|
|
||||||
72
assets/styles/app/layouts/footer.sass
Normal file
72
assets/styles/app/layouts/footer.sass
Normal file
|
|
@ -0,0 +1,72 @@
|
||||||
|
/*
|
||||||
|
* Footer on the dashboard
|
||||||
|
*/
|
||||||
|
|
||||||
|
footer
|
||||||
|
padding : 20px 0
|
||||||
|
background-color : $footer-bg-color
|
||||||
|
min-height : 334px
|
||||||
|
font-size : 12px
|
||||||
|
line-height : 22px
|
||||||
|
margin-top : -334px /* sticky footer */
|
||||||
|
|
||||||
|
.wrapper
|
||||||
|
padding-bottom: 334px
|
||||||
|
min-height: 100%
|
||||||
|
height: auto
|
||||||
|
background-color: $wrapper-bg-color
|
||||||
|
@media (min-width: 640px)
|
||||||
|
.wrapper
|
||||||
|
padding-bottom: 204px
|
||||||
|
|
||||||
|
footer
|
||||||
|
margin-top: -204px
|
||||||
|
min-height: 204px
|
||||||
|
|
||||||
|
|
||||||
|
footer h3
|
||||||
|
font-size : 15px
|
||||||
|
margin : 0 0 10px 0
|
||||||
|
padding-top : 6px
|
||||||
|
font-weight : 400
|
||||||
|
color : $footer-h3-color
|
||||||
|
border-top : solid 4px $footer-h3-corder-color
|
||||||
|
|
||||||
|
footer .row p
|
||||||
|
display : inline-block
|
||||||
|
margin : 0
|
||||||
|
|
||||||
|
footer .row ul,
|
||||||
|
footer .row li
|
||||||
|
display : block
|
||||||
|
color : $footer-color
|
||||||
|
line-height : 22px
|
||||||
|
padding : 0
|
||||||
|
margin-top : 0
|
||||||
|
list-style-type : none
|
||||||
|
|
||||||
|
footer a
|
||||||
|
text-decoration : none
|
||||||
|
display : inline-block
|
||||||
|
color : $footer-color
|
||||||
|
|
||||||
|
footer a:hover,
|
||||||
|
footer a:active
|
||||||
|
text-decoration : underline
|
||||||
|
|
||||||
|
a
|
||||||
|
text-decoration : none
|
||||||
|
display : block
|
||||||
|
color : $footer-color
|
||||||
|
|
||||||
|
.status-circle
|
||||||
|
background : $pass-color
|
||||||
|
display : inline-block
|
||||||
|
height : 11px
|
||||||
|
width : 11px
|
||||||
|
text-indent : -9999px
|
||||||
|
margin-right : 5px
|
||||||
|
border-radius : 100px
|
||||||
|
-webkit-border-radius : 100px
|
||||||
|
-moz-border-radius : 100px
|
||||||
|
vertical-align: middle
|
||||||
|
|
@ -11,7 +11,7 @@
|
||||||
& > a.menu-popup-button
|
& > a.menu-popup-button
|
||||||
display: inline-block
|
display: inline-block
|
||||||
text-align: left
|
text-align: left
|
||||||
margin-top: -31px
|
margin-top: -32px
|
||||||
color: #fff
|
color: #fff
|
||||||
font-size: 13px
|
font-size: 13px
|
||||||
padding: 3px 24px 0 25px
|
padding: 3px 24px 0 25px
|
||||||
|
|
@ -33,13 +33,14 @@
|
||||||
display: none
|
display: none
|
||||||
position: absolute
|
position: absolute
|
||||||
right: 0
|
right: 0
|
||||||
top: -3px
|
top: -4px
|
||||||
width: 140px
|
width: 140px
|
||||||
background-color: #a6adad
|
background-color: #a6adad
|
||||||
@include border-bottom-radius(4px)
|
@include border-bottom-radius(4px)
|
||||||
a
|
a
|
||||||
display: block
|
display: block
|
||||||
color: #ffffff
|
color: $white
|
||||||
|
font-size: $font-size-small
|
||||||
padding: 5px 25px 5px 25px
|
padding: 5px 25px 5px 25px
|
||||||
&:hover:not(.disabled)
|
&:hover:not(.disabled)
|
||||||
background-color: #909393
|
background-color: #909393
|
||||||
|
|
|
||||||
|
|
@ -2,11 +2,11 @@
|
||||||
|
|
||||||
#profile
|
#profile
|
||||||
#right
|
#right
|
||||||
min-width: 180px
|
//min-width: 180px
|
||||||
max-width: 180px
|
//max-width: 180px
|
||||||
padding: 13px 20px 80px 20px
|
padding: 13px 20px 80px 20px
|
||||||
background-color: #E9E9E7
|
background-color: #E9E9E7
|
||||||
float: right
|
//float: right
|
||||||
border-left: 1px solid $color-border-normal
|
border-left: 1px solid $color-border-normal
|
||||||
|
|
||||||
h4
|
h4
|
||||||
|
|
|
||||||
|
|
@ -17,9 +17,8 @@
|
||||||
height: 29px
|
height: 29px
|
||||||
li
|
li
|
||||||
display: inline-block
|
display: inline-block
|
||||||
|
&:hover
|
||||||
&:hover
|
background-color: $color-bg-tab-hover
|
||||||
background-color: $color-bg-tab-hover
|
|
||||||
|
|
||||||
.active
|
.active
|
||||||
background-color: $color-bg-tab-active
|
background-color: $color-bg-tab-active
|
||||||
|
|
|
||||||
|
|
@ -101,6 +101,11 @@
|
||||||
.menu.community
|
.menu.community
|
||||||
min-width: 120px
|
min-width: 120px
|
||||||
|
|
||||||
|
.user
|
||||||
|
text-align: right
|
||||||
|
a
|
||||||
|
padding-right: 0
|
||||||
|
|
||||||
.menu.profile
|
.menu.profile
|
||||||
.signing-in
|
.signing-in
|
||||||
background: inline-image('ui/spinner.svg') no-repeat 110px 22px
|
background: inline-image('ui/spinner.svg') no-repeat 110px 22px
|
||||||
|
|
@ -132,9 +137,9 @@
|
||||||
&.signed-in .signed-in
|
&.signed-in .signed-in
|
||||||
display: block
|
display: block
|
||||||
|
|
||||||
img
|
// img
|
||||||
float: right
|
// float: right
|
||||||
margin: 13px 0 0 10px
|
// margin: 13px 0 0 10px
|
||||||
|
|
||||||
&:not(.signed-in):hover ul
|
&:not(.signed-in):hover ul
|
||||||
display: none
|
display: none
|
||||||
|
|
@ -158,61 +163,63 @@
|
||||||
// width : 78px
|
// width : 78px
|
||||||
// text-indent : -9999px
|
// text-indent : -9999px
|
||||||
|
|
||||||
#user
|
// #user
|
||||||
text-align : right
|
// text-align : right
|
||||||
cursor : pointer
|
// cursor : pointer
|
||||||
|
|
||||||
#user p
|
// #user p
|
||||||
display : none
|
// display : none
|
||||||
|
|
||||||
// #top img
|
#top img
|
||||||
// float : right
|
float : right
|
||||||
// margin : -7px 10px 0 10px
|
margin : 14px 0 0 10px
|
||||||
// width : 30px
|
width : 30px
|
||||||
// height : 30px
|
height : 30px
|
||||||
// border-radius: 100px
|
border-radius: 100px
|
||||||
|
|
||||||
#user ul
|
|
||||||
text-align : left
|
|
||||||
display : inline
|
|
||||||
margin : 0
|
|
||||||
padding : 15px 0 17px 0
|
|
||||||
list-style : none
|
|
||||||
z-index : 1000
|
|
||||||
|
|
||||||
#user ul li ul
|
|
||||||
padding : 0
|
|
||||||
position : absolute
|
|
||||||
top : 55px
|
|
||||||
right : 0
|
|
||||||
width : 150px
|
|
||||||
display : none
|
|
||||||
opacity : 0
|
|
||||||
visibility : hidden
|
|
||||||
|
|
||||||
#user ul li ul li
|
|
||||||
background : $topbar-bg
|
|
||||||
color : $white
|
|
||||||
display : block
|
|
||||||
line-height : 18px
|
|
||||||
padding : 8px 18px
|
|
||||||
margin : 0
|
|
||||||
|
|
||||||
#user ul li ul li:last-child
|
|
||||||
border-bottom-left-radius : 4px
|
|
||||||
border-bottom-right-radius : 4px
|
|
||||||
|
|
||||||
#user ul li ul li:hover
|
|
||||||
background : #5e869a
|
|
||||||
color : $white
|
|
||||||
a
|
|
||||||
color: $white
|
|
||||||
|
|
||||||
|
|
||||||
#user ul li:hover ul
|
|
||||||
display : block
|
// #user ul
|
||||||
opacity : 1
|
// text-align : left
|
||||||
visibility : visible
|
// display : inline
|
||||||
#user .handle a
|
// margin : 0
|
||||||
display: inline
|
// padding : 15px 0 17px 0
|
||||||
|
// list-style : none
|
||||||
|
// z-index : 1000
|
||||||
|
|
||||||
|
// #user ul li ul
|
||||||
|
// padding : 0
|
||||||
|
// position : absolute
|
||||||
|
// top : 55px
|
||||||
|
// right : 0
|
||||||
|
// width : 150px
|
||||||
|
// display : none
|
||||||
|
// opacity : 0
|
||||||
|
// visibility : hidden
|
||||||
|
|
||||||
|
// #user ul li ul li
|
||||||
|
// background : $topbar-bg
|
||||||
|
// color : $white
|
||||||
|
// display : block
|
||||||
|
// line-height : 18px
|
||||||
|
// padding : 8px 18px
|
||||||
|
// margin : 0
|
||||||
|
|
||||||
|
// #user ul li ul li:last-child
|
||||||
|
// border-bottom-left-radius : 4px
|
||||||
|
// border-bottom-right-radius : 4px
|
||||||
|
|
||||||
|
// #user ul li ul li:hover
|
||||||
|
// background : #5e869a
|
||||||
|
// color : $white
|
||||||
|
// a
|
||||||
|
// color: $white
|
||||||
|
|
||||||
|
|
||||||
|
// #user ul li:hover ul
|
||||||
|
// display : block
|
||||||
|
// opacity : 1
|
||||||
|
// visibility : visible
|
||||||
|
// #user .handle a
|
||||||
|
// display: inline
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user