mirror of
https://github.com/codeninjasllc/codecombat.git
synced 2025-05-04 18:03:45 -04:00
Added new level loading bar art. Using illustrated Start Level button.
This commit is contained in:
parent
f6bcc94bf8
commit
3da36ccc5d
5 changed files with 31 additions and 10 deletions
app
assets/images/level
styles/play/level
templates/play/level
BIN
app/assets/images/level/loading_bar_back.png
Normal file
BIN
app/assets/images/level/loading_bar_back.png
Normal file
Binary file not shown.
After ![]() (image error) Size: 489 B |
Binary file not shown.
Before ![]() (image error) Size: 6 KiB After ![]() (image error) Size: 622 B ![]() ![]() |
Binary file not shown.
Before ![]() (image error) Size: 2.4 KiB After ![]() (image error) Size: 30 KiB ![]() ![]() |
|
@ -52,26 +52,42 @@
|
||||||
.progress-or-start-container
|
.progress-or-start-container
|
||||||
position: absolute
|
position: absolute
|
||||||
bottom: 95px
|
bottom: 95px
|
||||||
width: 261px
|
width: 325px
|
||||||
height: 80px
|
height: 80px
|
||||||
left: 80px
|
left: 48px
|
||||||
|
|
||||||
.load-progress
|
.load-progress
|
||||||
width: 100%
|
width: 100%
|
||||||
height: 36px
|
height: 45px
|
||||||
margin: 20px auto 0 auto
|
margin: 20px auto 0 auto
|
||||||
|
|
||||||
.progress
|
.progress
|
||||||
height: 100%
|
height: 100%
|
||||||
position: relative
|
position: relative
|
||||||
background-color: transparent
|
background-color: transparent
|
||||||
|
@include box-shadow(none)
|
||||||
|
|
||||||
.progress-bar
|
.progress-background
|
||||||
width: 1%
|
width: 100%
|
||||||
height: 100%
|
height: 100%
|
||||||
transition-duration: 0
|
background: transparent url(/images/level/loading_bar_back.png) no-repeat
|
||||||
border-radius: 9px
|
background-size: 100% 100%
|
||||||
background: transparent url(/images/level/loading_bar_fill.png) no-repeat
|
position: absolute
|
||||||
|
z-index: -1
|
||||||
|
|
||||||
|
.progress-bar-container
|
||||||
|
width: 75%
|
||||||
|
height: 100%
|
||||||
|
left: 10%
|
||||||
|
position: absolute
|
||||||
|
|
||||||
|
.progress-bar
|
||||||
|
width: 1%
|
||||||
|
height: 100%
|
||||||
|
transition-duration: 0
|
||||||
|
background: transparent url(/images/level/loading_bar_fill.png) no-repeat
|
||||||
|
background-size: 325px 100%
|
||||||
|
@include box-shadow(none)
|
||||||
|
|
||||||
&.active .progress-bar
|
&.active .progress-bar
|
||||||
transition-duration: 1.2s
|
transition-duration: 1.2s
|
||||||
|
@ -88,9 +104,12 @@
|
||||||
.start-level-button
|
.start-level-button
|
||||||
display: none
|
display: none
|
||||||
width: 100%
|
width: 100%
|
||||||
|
height: auto
|
||||||
margin: 0px auto
|
margin: 0px auto
|
||||||
font-size: 40px
|
font-size: 40px
|
||||||
|
line-height: 45px
|
||||||
font-variant: small-caps
|
font-variant: small-caps
|
||||||
|
text-transform: none
|
||||||
|
|
||||||
.subscription-required
|
.subscription-required
|
||||||
display: none
|
display: none
|
||||||
|
|
|
@ -11,11 +11,13 @@
|
||||||
.errors
|
.errors
|
||||||
|
|
||||||
.progress-or-start-container
|
.progress-or-start-container
|
||||||
button.start-level-button.btn.btn-lg.btn-success.header-font.needsclick(data-i18n="play_level.loading_start") Start Level
|
button.start-level-button.btn.btn-lg.btn-success.btn-illustrated.header-font.needsclick(data-i18n="play_level.loading_start") Start Level
|
||||||
|
|
||||||
.load-progress
|
.load-progress
|
||||||
.progress
|
.progress
|
||||||
.progress-bar.progress-bar-success
|
.progress-background
|
||||||
|
.progress-bar-container
|
||||||
|
.progress-bar.progress-bar-success
|
||||||
.rim
|
.rim
|
||||||
|
|
||||||
.subscription-required
|
.subscription-required
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue