Implemented George's gold design.

This commit is contained in:
Nick Winter 2014-05-02 15:12:30 -07:00
parent e610ecb476
commit a04f74de8b
6 changed files with 15 additions and 18 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 5.2 KiB

View file

@ -7,28 +7,31 @@
top: 42px
user-select: none
-webkit-user-select: none
@include transition(background-color .2s linear)
@include transition(box-shadow .2s linear)
padding: 4px
background: transparent url(/images/level/gold_background.png) no-repeat
background-size: 100% 100%
border-radius: 4px
&:hover
background-color: rgba(255, 255, 255, 0.75)
box-shadow: 2px 2px 2px black
.team-gold
font-size: 16px
margin: 0
line-height: 20px
color: hsla(205,0%,31%,1)
text-shadow: 0px 1px 1px white, 0px -1px 1px white, 1px 0px 1px white, -1px 0px 1px white
color: hsla(205,0%,51%,1)
display: inline-block
padding: 0px 4px
&.team-humans
color: hsla(4,80%,51%,1)
&.team-ogres
color: hsla(205,100%,31%,1)
color: hsla(205,100%,51%,1)
&.team-allies, &.team-minions
color: hsla(116,80%,31%,1)
color: hsla(116,80%,51%,1)
img
width: 16px
@ -36,17 +39,7 @@
border-radius: 2px
padding: 1px
margin-top: -1px
@include gradient-radial-custom-stops(hsla(205,0%,74%,1), 20%, hsla(205,0%,31%,1), 70%)
&.team-humans img
@include gradient-radial-custom-stops(hsla(4,80%,74%,1), 20%, hsla(4,80%,51%,1), 70%)
&.team-ogres img
@include gradient-radial-custom-stops(hsla(205,100%,74%,1), 20%, hsla(205,100%,31%,1), 70%)
&.team-allies img, &.team-minions img
@include gradient-radial-custom-stops(hsla(116,80%,74%,1), 20%, hsla(116,80%,31%,1), 70%)
.gold-amount
display: inline-block
min-width: 20px

View file

@ -0,0 +1,3 @@
div(class="team-gold team-" + team, title="Gold: " + team)
img(src="/images/level/gold_icon.png", alt="")
div(class="gold-amount team-" + team)

View file

@ -1,5 +1,6 @@
View = require 'views/kinds/CocoView'
template = require 'templates/play/level/gold'
teamTemplate = require 'templates/play/level/team_gold'
module.exports = class GoldView extends View
id: "gold-view"
@ -13,9 +14,9 @@ module.exports = class GoldView extends View
@$el.show()
goldEl = @$el.find('.gold-amount.team-' + e.team)
unless goldEl.length
teamEl = $("<div class='team-gold team-#{e.team}' title='Gold: #{e.team}'><img src='/images/level/prop_gold.png'> <div class='gold-amount team-#{e.team}'></div></div>")
teamEl = teamTemplate team: e.team
@$el.append(teamEl)
goldEl = teamEl.find('.gold-amount.team-' + e.team)
goldEl = $('.gold-amount.team-' + e.team, teamEl)
text = '' + e.gold
if e.goldEarned and e.goldEarned > e.gold
text += " (#{e.goldEarned})"