mirror of
https://github.com/codeninjasllc/codecombat.git
synced 2024-11-25 00:28:31 -05:00
98 lines
2.1 KiB
Sass
98 lines
2.1 KiB
Sass
@import "../../../bootstrap/mixins"
|
|
|
|
// keyframes mixin from https://gist.github.com/ericam/1607696
|
|
=keyframes($name)
|
|
@-webkit-keyframes #{$name}
|
|
@content
|
|
@-moz-keyframes #{$name}
|
|
@content
|
|
@-ms-keyframes #{$name}
|
|
@content
|
|
@-o-keyframes #{$name}
|
|
@content
|
|
@keyframes #{$name}
|
|
@content
|
|
|
|
+keyframes(castablePulse)
|
|
from
|
|
@include box-shadow(0px 0px 8px #333)
|
|
50%
|
|
@include box-shadow(0px 0px 35px skyblue)
|
|
to
|
|
@include box-shadow(0px 0px 8px #333)
|
|
|
|
+keyframes(castablePulseButton)
|
|
from
|
|
color: white
|
|
50%
|
|
color: skyblue
|
|
to
|
|
color: white
|
|
|
|
#cast-button-view
|
|
display: none
|
|
position: absolute
|
|
width: 35%
|
|
|
|
.cast-button-group
|
|
z-index: 2
|
|
@include opacity(0.77)
|
|
width: 100%
|
|
border-radius: 6px
|
|
|
|
.button-progress-overlay
|
|
position: absolute
|
|
left: 0
|
|
top: 0
|
|
bottom: 0
|
|
border-radius: 6px
|
|
// This transition time should roughly match the world progress update interval
|
|
@include transition(width .2s linear)
|
|
|
|
&.castable .button-progress-overlay, &.casting .button-progress-overlay
|
|
background-color: rgba(255, 255, 255, 0.5)
|
|
|
|
&:hover, &.castable
|
|
@include opacity(1)
|
|
|
|
&.castable
|
|
-webkit-animation-name: castablePulse
|
|
-webkit-animation-duration: 3s
|
|
-webkit-animation-iteration-count: infinite
|
|
|
|
.cast-button
|
|
font-weight: bold
|
|
-webkit-animation-name: castablePulseButton
|
|
-webkit-animation-duration: 3s
|
|
-webkit-animation-iteration-count: infinite
|
|
|
|
&:not(.castable):not(:hover)
|
|
.cast-options-button
|
|
// Mimic the disabled visuals
|
|
@include opacity(0.65)
|
|
background-image: none
|
|
@include box-shadow(none)
|
|
|
|
.btn
|
|
padding: 3px 10px
|
|
height: 40px
|
|
|
|
.cast-button
|
|
width: 80%
|
|
width: -webkit-calc(100% - 40px)
|
|
width: calc(100% - 40px)
|
|
|
|
.cast-options-button
|
|
width: 20%
|
|
width: -webkit-calc(40px)
|
|
width: calc(40px)
|
|
|
|
.autocast-delays
|
|
min-width: 0
|
|
right: 0
|
|
left: auto
|
|
li
|
|
a, .dropdown-menu-header
|
|
padding: 3px 15px
|
|
a.selected
|
|
font-weight: bold
|