try cleanup and modularizing
This commit is contained in:
Lisa Passing
parent
9f4e408242
commit
4dde61bad9
|
|
@ -1,21 +1,17 @@
|
|||
<div class="wrapper">
|
||||
<div id="top">
|
||||
<div class="row">
|
||||
<div class="small-2 medium-2 columns" id="logo">
|
||||
<h1>{{#link-to "main"}}Home{{/link-to}}</h1>
|
||||
</div>
|
||||
<div class="small-4 medium-3 columns" id="nav">
|
||||
<div class="centered">
|
||||
<div class="wrapper">
|
||||
<div id="top">
|
||||
<div class="row">
|
||||
<div class="small-2 medium-2 columns" id="logo">
|
||||
<h1>{{#link-to "main"}}Home{{/link-to}}</h1>
|
||||
</div>
|
||||
<ul>
|
||||
<li><a href="#">Docs</a></li>
|
||||
<li><a href="#">Blog</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- <div class="small-4 medium-3 columns" id="status">
|
||||
<div class="status-graph">Status Graph</div>
|
||||
</div> -->
|
||||
<div class="small-2 medium-5 columns no-padding" id="user">
|
||||
<ul>
|
||||
<li class="menu">
|
||||
<!-- <div class="small-4 medium-3 columns" id="status">
|
||||
<div class="status-graph">Status Graph</div>
|
||||
</div> -->
|
||||
<li class="menu float-right user">
|
||||
<p class="handle">
|
||||
{{#if auth.signedOut}}
|
||||
<a class="signed-out" href="#" {{action "signIn" target="auth"}}>Sign in with GitHub</a>
|
||||
|
|
@ -28,59 +24,59 @@
|
|||
{{/if}}
|
||||
</p>
|
||||
<ul>
|
||||
<li>Help</li>
|
||||
<li><a href="#" title="">Help</a></li>
|
||||
<li><a href="/" {{action "signOut" target="auth"}}>Sign Out</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{yield}}
|
||||
|
||||
</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>
|
||||
|
||||
<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
|
||||
|
||||
$topbar-bg: #404650
|
||||
$topbar-bg: $blue-grey
|
||||
$topbar-bg-darker: #31363d
|
||||
|
||||
$main-repo-link-color: #50555b
|
||||
|
|
@ -10,4 +12,20 @@ $main-repo-hover-color: #607a84
|
|||
$travis-lint-color: #9b9d9e
|
||||
$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
|
||||
margin-top: 20px
|
||||
|
||||
.settings-row,
|
||||
.short-settings-element
|
||||
& > *
|
||||
box-sizing: content-box
|
||||
|
||||
a.travis-switch
|
||||
margin: 0 10px 0 0
|
||||
|
||||
|
|
@ -26,8 +31,8 @@ p.settings-row
|
|||
&:before
|
||||
content: ""
|
||||
position: absolute
|
||||
top: 1px
|
||||
left: 1px
|
||||
top: 2px
|
||||
left: 2px
|
||||
width: 3.5em
|
||||
height: 1.9em
|
||||
background: #e9e9e7
|
||||
|
|
|
|||
|
|
@ -1,40 +1,13 @@
|
|||
@import "app/_mixins/all"
|
||||
|
||||
$left-width: 250px
|
||||
|
||||
// @mixin display-flex
|
||||
// display: -webkit-flex
|
||||
// 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
|
||||
.centered .row
|
||||
max-width: 1024px
|
||||
|
||||
.main, .profile-view
|
||||
position: relative
|
||||
width: 100%
|
||||
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
|
||||
#top
|
||||
|
|
@ -47,7 +20,6 @@ $left-width: 250px
|
|||
#left, #right
|
||||
position: relative
|
||||
min-height: 100%
|
||||
//@include flex(0, 0, 25em)
|
||||
|
||||
#left
|
||||
float: left
|
||||
|
|
@ -55,14 +27,6 @@ $left-width: 250px
|
|||
background-color: #fbfbfa
|
||||
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
|
||||
display: inline-block
|
||||
height: 11px
|
||||
|
|
@ -78,13 +42,27 @@ $left-width: 250px
|
|||
padding: 20px 30px 80px
|
||||
|
||||
@media #{$medium-up}
|
||||
#main
|
||||
width: grid-calc(16, 24)
|
||||
#left
|
||||
width: grid-calc(3, 12)
|
||||
float: left
|
||||
#right
|
||||
width: grid-calc(2, 12)
|
||||
float: right
|
||||
@media #{$medium-up}
|
||||
// #main
|
||||
// width: grid-calc(16, 12)
|
||||
// float: right
|
||||
#main
|
||||
width: grid-calc(19, 24)
|
||||
float: right
|
||||
width: grid-calc(7, 12)
|
||||
float: left
|
||||
|
||||
|
||||
@media #{$large-up}
|
||||
// #left
|
||||
// width: grid-calc(5, 24)
|
||||
// max-width: 300px
|
||||
// #main
|
||||
// width: grid-calc(19, 24)
|
||||
// float: right
|
||||
|
||||
.travis-lint
|
||||
background-color: $travis-lint-bg
|
||||
|
|
|
|||
|
|
@ -1,3 +1,9 @@
|
|||
/*
|
||||
* Dashboard
|
||||
* @todo: split into components: filter, search, tiles
|
||||
*/
|
||||
|
||||
@import "app/_mixins/all"
|
||||
|
||||
.current-org-avatar
|
||||
display : inline-block
|
||||
|
|
@ -7,7 +13,7 @@
|
|||
margin : -5px 5px 0 0
|
||||
|
||||
#filters-search
|
||||
background : #ffffff
|
||||
background : $white
|
||||
font-size : 14px
|
||||
padding : 5px 0 5px 0
|
||||
max-height : 44px
|
||||
|
|
@ -24,7 +30,7 @@
|
|||
z-index : 1000
|
||||
|
||||
#filters ul li
|
||||
background : #fff
|
||||
background : $white
|
||||
position : relative
|
||||
display : inline-block
|
||||
padding : 10px 0 10px 0
|
||||
|
|
@ -32,8 +38,6 @@
|
|||
margin-top : 0
|
||||
cursor : pointer
|
||||
border-radius : 0px
|
||||
-webkit-border-radius : 0px
|
||||
-moz-border-radius : 0px
|
||||
|
||||
#filters li.filters-start:hover
|
||||
background-color : #fff
|
||||
|
|
@ -48,8 +52,6 @@
|
|||
opacity : 0
|
||||
visibility : hidden
|
||||
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
|
||||
display : block
|
||||
|
|
@ -70,29 +72,27 @@
|
|||
height : 20px
|
||||
margin-right : 5px
|
||||
text-indent : -9999px
|
||||
border-radius : 100px
|
||||
-webkit-border-radius : 100px
|
||||
-moz-border-radius : 100px
|
||||
border-radius : 100px
|
||||
|
||||
.org-travisci
|
||||
background : url('/images/dashboard/orgs-travisci.png') no-repeat
|
||||
background-size : contain
|
||||
// .org-travisci
|
||||
// background : url('/images/dashboard/orgs-travisci.png') no-repeat
|
||||
// background-size : contain
|
||||
|
||||
.org-saltinejustine
|
||||
background : url('/images/dashboard/orgs-saltinejustine.png') no-repeat
|
||||
background-size : contain
|
||||
// .org-saltinejustine
|
||||
// background : url('/images/dashboard/orgs-saltinejustine.png') no-repeat
|
||||
// background-size : contain
|
||||
|
||||
.org-openkarma
|
||||
background : url('/images/dashboard/orgs-openkarma.png') no-repeat
|
||||
background-size : contain
|
||||
// .org-openkarma
|
||||
// background : url('/images/dashboard/orgs-openkarma.png') no-repeat
|
||||
// background-size : contain
|
||||
|
||||
.org-eurucamp
|
||||
background : url('/images/dashboard/orgs-eurucamp.png') no-repeat
|
||||
background-size : contain
|
||||
// .org-eurucamp
|
||||
// background : url('/images/dashboard/orgs-eurucamp.png') no-repeat
|
||||
// background-size : contain
|
||||
|
||||
#filters ul li ul li:hover
|
||||
background : #5e869a
|
||||
color : #ffffff
|
||||
color : $white
|
||||
|
||||
#filters ul li:hover ul
|
||||
display : block
|
||||
|
|
@ -111,7 +111,7 @@
|
|||
z-index : 1000
|
||||
|
||||
#views ul li
|
||||
background : #fff
|
||||
background : $white
|
||||
position : relative
|
||||
display : inline-block
|
||||
padding : 10px 0 10px 0
|
||||
|
|
@ -151,7 +151,7 @@
|
|||
|
||||
#views ul li ul li:hover
|
||||
background : #5e869a
|
||||
color : #ffffff
|
||||
color : $white
|
||||
|
||||
#views ul li:hover ul
|
||||
display : block
|
||||
|
|
@ -204,15 +204,13 @@
|
|||
padding : 30px 0 10px 0
|
||||
|
||||
.tile
|
||||
background : #fff
|
||||
background : $white
|
||||
min-height : 125px
|
||||
color : #9d9fa1
|
||||
font-size : 14px
|
||||
margin-bottom : 20px
|
||||
padding : 0 10px 0 0
|
||||
border-radius : 4px
|
||||
-webkit-border-radius : 4px
|
||||
-moz-border-radius : 4px
|
||||
|
||||
.duration
|
||||
background-image: url('/images/dashboard/time.svg')
|
||||
|
|
@ -225,8 +223,6 @@
|
|||
background-repeat: no-repeat
|
||||
background-position: 0 1px
|
||||
|
||||
|
||||
|
||||
.finished
|
||||
background-image: url('/images/dashboard/cal.svg')
|
||||
background-size : 11px 11px
|
||||
|
|
@ -239,7 +235,7 @@
|
|||
margin-bottom: 0
|
||||
|
||||
.build-bar
|
||||
position : absolute
|
||||
position: absolute
|
||||
background:
|
||||
repeat: no-repeat
|
||||
position: 7px 10px
|
||||
|
|
@ -261,53 +257,43 @@
|
|||
.passed
|
||||
.build-bar
|
||||
background:
|
||||
color: #3ba85d
|
||||
color: $pass-color
|
||||
image: url('/images/dashboard/status-passed.svg')
|
||||
|
||||
|
||||
.org,
|
||||
.repo a,
|
||||
.build-status a
|
||||
color: #3ba85d
|
||||
|
||||
color: $pass-color
|
||||
|
||||
.failed
|
||||
.build-bar
|
||||
background:
|
||||
color: #d04729
|
||||
color: $fail-color
|
||||
image: url('/images/dashboard/status-failed.svg')
|
||||
|
||||
|
||||
.org,
|
||||
.repo a,
|
||||
.build-status a
|
||||
color: #d04729
|
||||
|
||||
color: $fail-color
|
||||
|
||||
.started
|
||||
.build-bar
|
||||
background:
|
||||
color: #D2CA24
|
||||
color: $start-bg-color
|
||||
image: url('/images/dashboard/status-pending.svg')
|
||||
|
||||
|
||||
.org,
|
||||
.repo a,
|
||||
.build-status a
|
||||
color: #848032
|
||||
color: $start-color
|
||||
|
||||
|
||||
.errored
|
||||
.build-bar
|
||||
background:
|
||||
color: #999999
|
||||
color: $error-color
|
||||
image: url('/images/dashboard/status-errored.svg')
|
||||
|
||||
|
||||
.org,
|
||||
.repo a,
|
||||
.build-status a
|
||||
color: #999999
|
||||
color: $error-color
|
||||
|
||||
|
||||
.tile .build-information
|
||||
|
|
@ -326,8 +312,6 @@
|
|||
line-height : 20px
|
||||
text-overflow : ellipsis
|
||||
|
||||
|
||||
|
||||
.tile .star-feature
|
||||
position : absolute
|
||||
top : 0
|
||||
|
|
@ -344,180 +328,19 @@
|
|||
margin-left : 5px
|
||||
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)
|
||||
#top img
|
||||
margin : -7px 0 0 10px
|
||||
|
||||
|
||||
@media only screen and (min-width: 640px)
|
||||
#top #status li
|
||||
display : inline-block
|
||||
|
||||
|
||||
#user p
|
||||
display : inline-block
|
||||
|
||||
|
||||
#search
|
||||
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
|
||||
display: inline-block
|
||||
text-align: left
|
||||
margin-top: -31px
|
||||
margin-top: -32px
|
||||
color: #fff
|
||||
font-size: 13px
|
||||
padding: 3px 24px 0 25px
|
||||
|
|
@ -33,13 +33,14 @@
|
|||
display: none
|
||||
position: absolute
|
||||
right: 0
|
||||
top: -3px
|
||||
top: -4px
|
||||
width: 140px
|
||||
background-color: #a6adad
|
||||
@include border-bottom-radius(4px)
|
||||
a
|
||||
display: block
|
||||
color: #ffffff
|
||||
color: $white
|
||||
font-size: $font-size-small
|
||||
padding: 5px 25px 5px 25px
|
||||
&:hover:not(.disabled)
|
||||
background-color: #909393
|
||||
|
|
|
|||
|
|
@ -2,11 +2,11 @@
|
|||
|
||||
#profile
|
||||
#right
|
||||
min-width: 180px
|
||||
max-width: 180px
|
||||
//min-width: 180px
|
||||
//max-width: 180px
|
||||
padding: 13px 20px 80px 20px
|
||||
background-color: #E9E9E7
|
||||
float: right
|
||||
//float: right
|
||||
border-left: 1px solid $color-border-normal
|
||||
|
||||
h4
|
||||
|
|
|
|||
|
|
@ -17,9 +17,8 @@
|
|||
height: 29px
|
||||
li
|
||||
display: inline-block
|
||||
|
||||
&:hover
|
||||
background-color: $color-bg-tab-hover
|
||||
&:hover
|
||||
background-color: $color-bg-tab-hover
|
||||
|
||||
.active
|
||||
background-color: $color-bg-tab-active
|
||||
|
|
|
|||
|
|
@ -101,6 +101,11 @@
|
|||
.menu.community
|
||||
min-width: 120px
|
||||
|
||||
.user
|
||||
text-align: right
|
||||
a
|
||||
padding-right: 0
|
||||
|
||||
.menu.profile
|
||||
.signing-in
|
||||
background: inline-image('ui/spinner.svg') no-repeat 110px 22px
|
||||
|
|
@ -132,9 +137,9 @@
|
|||
&.signed-in .signed-in
|
||||
display: block
|
||||
|
||||
img
|
||||
float: right
|
||||
margin: 13px 0 0 10px
|
||||
// img
|
||||
// float: right
|
||||
// margin: 13px 0 0 10px
|
||||
|
||||
&:not(.signed-in):hover ul
|
||||
display: none
|
||||
|
|
@ -158,61 +163,63 @@
|
|||
// width : 78px
|
||||
// text-indent : -9999px
|
||||
|
||||
#user
|
||||
text-align : right
|
||||
cursor : pointer
|
||||
// #user
|
||||
// text-align : right
|
||||
// cursor : pointer
|
||||
|
||||
#user p
|
||||
display : none
|
||||
// #user p
|
||||
// display : none
|
||||
|
||||
// #top img
|
||||
// float : right
|
||||
// margin : -7px 10px 0 10px
|
||||
// width : 30px
|
||||
// height : 30px
|
||||
// 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
|
||||
#top img
|
||||
float : right
|
||||
margin : 14px 0 0 10px
|
||||
width : 30px
|
||||
height : 30px
|
||||
border-radius: 100px
|
||||
|
||||
|
||||
#user ul li:hover ul
|
||||
display : block
|
||||
opacity : 1
|
||||
visibility : visible
|
||||
#user .handle a
|
||||
display: inline
|
||||
|
||||
// #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
|
||||
// opacity : 1
|
||||
// visibility : visible
|
||||
// #user .handle a
|
||||
// display: inline
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user