challenges: move challenge specs to accordion header, add subscribers count

This commit is contained in:
Tyler Renelle 2013-05-31 19:26:11 -04:00
parent 5f78d801a8
commit 780e3ccabc
4 changed files with 35 additions and 10 deletions

View file

@ -0,0 +1,7 @@
ul.challenge-accordion-header-specs
list-style:none
li
background-color: darken($neutral, 10%)
margin: 2px 5px
float:left

View file

@ -26,6 +26,7 @@
@import "./game-pane.styl";
@import "./backer.styl";
@import "./npcs.styl";
@import "./challenges.styl";
// fix exploding to very wide for some reason
.datepicker

View file

@ -42,6 +42,14 @@
width:34px
height:34px
.Pet_Currency_Gem, .Pet_Currency_Gem2x, .Pet_Currency_Gem1x
background: url("/img/sprites/Egg_Sprite_Sheet.png") no-repeat
display:block
.Pet_Currency_Gem {background-position: 0px -510px; width: 51px; height: 45px} /* Not an egg or potion so has a different size */
.Pet_Currency_Gem2x {background-position: -55px -513px; width: 34px; height: 30px}
.Pet_Currency_Gem1x {background-position: -63px -542px; width: 19px; height: 17px}
.inventory-list li
clear:both
.pets-menu > div

View file

@ -64,22 +64,31 @@
<listing:>
<div class="accordion-group">
<div class="accordion-heading">
<ul class='pull-right challenge-accordion-header-specs'>
<li>
{count(@challenge.users)} Subscribers
</li>
<li>
<!-- prize -->
{#if @challenge.prize}
<table><tr><td>{@challenge.prize}</td><td><span class="Pet_Currency_Gem1x"></span></td><td> Prize</td></tr></table>
{/}
</li>
<li>
<!-- subscribe / unsubscribe -->
<a x-bind="click:challengeUnsubscribe" class='btn btn-small btn-danger {#unless indexOf(_user.challenges,@challenge.id)}hidden{/}'><i class='icon-ban-circle'></i> Unsubscribe</a>
<a x-bind="click:challengeSubscribe" class='btn btn-small btn-success {#if indexOf(_user.challenges,@challenge.id)}hidden{/}'><i class='icon-ok'></i> Subscribe</a>
</li>
</ul>
<a class="accordion-toggle" data-toggle="collapse" href="#accordion-challenge-{{@challenge.id}}">{@challenge.name} (by {@challenge.user})</a>
</div>
<div id="accordion-challenge-{{@challenge.id}}" class="accordion-body collapse">
<div class="accordion-inner">
<div>
<a x-bind="click:challengeUnsubscribe" class='btn btn-small btn-danger {#unless indexOf(_user.challenges,@challenge.id)}hidden{/}'><i class='icon-ban-circle'></i> Unsubscribe</a>
<a x-bind="click:challengeSubscribe" class='btn btn-small btn-success {#if indexOf(_user.challenges,@challenge.id)}hidden{/}'><i class='icon-ok'></i> Subscribe</a>
</div>
<!-- prize -->
{#if @challenge.prize}
<a class="gem-wallet">
<span class="task-action-btn tile flush neutral"><div class="Gems"></div> {@challenge.prize} Gem Prize</span>
</a>
{/}
<!-- Edit button -->
<span style='position:absolute; right:0;'>