codecombat/app/styles/play/ladder_home.sass

69 lines
1.5 KiB
Sass

@import "app/styles/mixins"
@import "app/styles/bootstrap/variables"
#ladder-home-view
.level
width: 100%
position: relative
margin-bottom: 20px
text-shadow: 2px 2px 5px black
&:hover div, &:hover .dynamic-level-name
color: lighten($yellow, 20%)
&:hover img
filter: brightness(1.2)
-webkit-filter: brightness(1.2)
box-shadow: 0 0 5px black
.level-image
width: 100%
.dynamic-level-name
position: absolute
z-index: 1
top: 40px
width: 100%
text-align: center
text-shadow: 0px 5px 5px black, -2px 0px 2px black, 2px 0px 2px black, 0px -2px 2px black
font-size: 72px
color: $yellow
font-family: $headings-font-family
font-variant: small-caps
@include transition(color .10s linear)
.overlay-text
color: $yellow
font-family: $headings-font-family
font-variant: small-caps
@include transition(color .10s linear)
.level-difficulty
position: absolute
left: 0px
bottom: 0px
font-size: 25px
padding-right: 10px
background-color: rgba(255, 255, 255, 0.75)
border-radius: 6px
.play-text-container
position: absolute
left: 50%
bottom: -10px
.play-text
margin-left: -50%
font-size: 50px
a[disabled] .level
opacity: 0.7
a.complete .level-difficulty:after
content: " - Complete!"
color: $yellow
a.started .level-difficulty:after
content: " - Started"
color: desaturate($yellow, 50%)