-
Notifications
You must be signed in to change notification settings - Fork 4.1k
/
cast_button.sass
147 lines (112 loc) · 3.63 KB
/
cast_button.sass
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
@import "app/styles/mixins"
@import "app/styles/bootstrap/variables"
+keyframes(castablePulse)
from
@include box-shadow(0px 0px 8px #333)
color: white
50%
@include box-shadow(0px 0px 35px skyblue)
color: skyblue
to
@include box-shadow(0px 0px 8px #333)
color: white
+keyframes(winnablePulse)
from
@include box-shadow(0px 0px 8px #333)
color: white
50%
@include box-shadow(0px 0px 35px #87CEFF)
color: #87CEFF
to
@include box-shadow(0px 0px 8px #333)
color: white
#cast-button-view
display: none
position: absolute
z-index: 2
width: 100%
left: -15px
right: 15px
.btn.btn-illustrated
height: 46px
font-size: 24px
line-height: 24px
width: 45%
width: -webkit-calc(50% - 10px)
width: calc(50% - 10px)
border-style: solid
border-image: url(/images/level/code_toolbar_run_button_active.png) 14 20 20 20 fill round
border-width: 7px 10px 10px 10px
&.full-width
width: 100%
&:active
border-image: url(/images/level/code_toolbar_run_button_active_pressed.png) 14 20 20 20 fill round
padding: 2px 0 0 2px
&.submit-button, &.done-button, &.rank-button
margin-left: 10px
border-image: url(/images/level/code_toolbar_submit_button_active.png) 14 20 20 20 fill round
&:active
border-image: url(/images/level/code_toolbar_submit_button_active_pressed.png) 14 20 20 20 fill round
.ladder-submission-view
width: 45%
width: -webkit-calc(50% - 10px)
width: calc(50% - 10px)
display: inline-block
.btn.btn-illustrated
width: 100%
font-size: 18px
.last-submitted
float: right
margin-top: -4px
width: calc(100% - 20px)
text-align: center
.cast-button
@include opacity(0.77)
&:hover, &.castable
@include opacity(1)
.submit-button > *, .done-button > *
@include opacity(0.9)
&:hover
@include opacity(1)
&:not(.winnable)
.btn.btn-illustrated
&.cast-button.castable
font-weight: bold
@include animation(castablePulse 3s infinite)
border-image: url(/images/level/code_toolbar_run_button_zazz.png) 14 20 20 20 fill round
&:active
border-image: url(/images/level/code_toolbar_run_button_zazz_pressed.png) 14 20 20 20 fill round
&.submit-button
font-size: 16px
&.winnable .btn.btn-illustrated.cast-button
font-size: 16px
&.winnable.has-seen-winning-replay
.btn.btn-illustrated
&.submit-button, &.done-button
font-weight: bold
@include animation(winnablePulse 3s infinite)
border-image: url(/images/level/code_toolbar_submit_button_zazz.png) 14 20 20 20 fill round
&:active
border-image: url(/images/level/code_toolbar_submit_button_zazz_pressed.png) 14 20 20 20 fill round
#stop-cinematic-playback-button
display: none
#level-view.junior &
.btn.btn-illustrated
width: 100%
border-image: url(/images/level/code_toolbar_submit_button_active.png) 14 20 20 20 fill round
&.cast-button
@include opacity(0.95)
&:hover, &.castable
filter: brightness(1.5)
&:active
border-image: url(/images/level/code_toolbar_submit_button_active_pressed.png) 14 20 20 20 fill round
.glyphicon
font-size: 28px
&:not(.winnable)
.btn.btn-illustrated
&.cast-button.castable
border-image: url(/images/level/code_toolbar_submit_button_zazz.png) 14 20 20 20 fill round
&:active
border-image: url(/images/level/code_toolbar_submit_button_zazz_pressed.png) 14 20 20 20 fill round
&:not(.text-code) &
right: -15px