codecombat/app/styles/terrain_randomise.sass

128 lines
2.5 KiB
Sass
Raw Normal View History

#terrain-randomise-modal
.choose-option
margin-bottom: 15px
width: 100%
height: 100px
overflow: hidden
background: white
border: 1px solid #333
position: relative
-webkit-transition: opacity 0.3s ease-in-out
-moz-transition: opacity 0.3s ease-in-out
-ms-transition: opacity 0.3s ease-in-out
-o-transition: opacity 0.3s ease-in-out
transition: opacity 0.3s ease-in-out
opacity: 0.4
border-radius: 5px
.only-one
-webkit-transition: opacity 0.3s ease-in-out
-moz-transition: opacity 0.3s ease-in-out
-ms-transition: opacity 0.3s ease-in-out
-o-transition: opacity 0.3s ease-in-out
transition: opacity 0.3s ease-in-out
opacity: 0
.choose-option:hover
opacity: 1
.only-one
opacity: 1
.my-icon
position: relative
left: 0
top: -10px
z-index: 1
.my-team-icon
height: 60px
position: relative
top: -10px
left: 10px
z-index: 0
.opponent-team-icon
height: 60px
position: relative
top: 10px
right: 10px
z-index: 0
float: right
-moz-transform: scaleX(-1)
-o-transform: scaleX(-1)
-webkit-transform: scaleX(-1)
transform: scaleX(-1)
filter: FlipH
-ms-filter: "FlipH"
.opponent-icon
position: relative
float: right
right: 0
top: -10px
-moz-transform: scaleX(-1)
-o-transform: scaleX(-1)
-webkit-transform: scaleX(-1)
transform: scaleX(-1)
filter: FlipH
-ms-filter: "FlipH"
z-index: 1
.name-label
border-bottom: 20px solid lightslategray
height: 0
width: 40%
position: absolute
bottom: 0
color: black
font-weight: bold
text-align: center
z-index: 2
span
position: relative
top: 1px
.my-name
border-right: 15px solid transparent
left: 0
span
left: 3px
.preset-size
border-left: 15px solid transparent
right: 0
//text-align: right
span
right: 3px
.preset-name
border-top: 25px solid darkgray
border-left: 20px solid transparent
border-right: 20px solid transparent
height: 0
width: 30%
position: absolute
left: 35%
top: 0
color: black
text-align: center
font-size: 18px
font-weight: bold
span
position: relative
top: -25px
.easy-option .preset-name
border-top: 25px solid limegreen
.medium-option .preset-name
border-top: 25px solid darkorange
.hard-option .preset-name
border-top: 25px solid black
color: white