|
Before Width: | Height: | Size: 2 KiB |
|
Before Width: | Height: | Size: 1.4 KiB |
|
Before Width: | Height: | Size: 1.3 KiB |
|
Before Width: | Height: | Size: 3.3 KiB |
|
Before Width: | Height: | Size: 1.7 KiB |
|
Before Width: | Height: | Size: 7.6 KiB |
|
Before Width: | Height: | Size: 2.1 KiB |
|
Before Width: | Height: | Size: 4.8 KiB |
|
Before Width: | Height: | Size: 2.9 KiB |
|
Before Width: | Height: | Size: 1.1 KiB |
|
Before Width: | Height: | Size: 1.9 KiB |
|
Before Width: | Height: | Size: 4.7 KiB |
|
Before Width: | Height: | Size: 12 KiB |
|
|
@ -8,9 +8,9 @@
|
|||
|
||||
// Bailey
|
||||
.NPC-Bailey
|
||||
background-position: -162px -41px
|
||||
background-position: -162px -42px
|
||||
width: 60px
|
||||
height: 73px
|
||||
height: 72px
|
||||
float:left
|
||||
.NPC-Bailey-Head
|
||||
background-position: -168px -42px
|
||||
|
|
@ -24,4 +24,4 @@
|
|||
.static-popover
|
||||
z-index 0
|
||||
display block
|
||||
position:relative
|
||||
position:relative
|
||||
|
|
|
|||
|
|
@ -1,45 +1,42 @@
|
|||
<header:>
|
||||
{#unless equal(_user.preferences.hideHeader,true)}
|
||||
<header class="site-header" role="banner" data-partySize="{#if gt(_partyMembers.length,1)}{truarr(_partyMembers.length)}{else}0{/}">
|
||||
<!-- avatar -->
|
||||
<div class="herobox-wrap main-herobox">
|
||||
<app:avatar:avatar profile={_user} main=true>
|
||||
<header class="site-header {#if _user.preferences.hideHeader}hidden{/}" role="banner" data-partySize="{#if gt(_partyMembers.length,1)}{truarr(_partyMembers.length)}{else}0{/}">
|
||||
<!-- avatar -->
|
||||
<div class="herobox-wrap main-herobox">
|
||||
<app:avatar:avatar profile={_user} main=true>
|
||||
</div>
|
||||
|
||||
<!-- stat bars -->
|
||||
<div class="hero-stats">
|
||||
<div class="meter health" title="Health">
|
||||
<div class="bar" style="width: {percent(_user.stats.hp, 50)}%;"></div>
|
||||
<span class="meter-text"><i class=icon-heart></i> {ceil(_user.stats.hp)} / 50</span>
|
||||
</div>
|
||||
|
||||
<!-- stat bars -->
|
||||
<div class="hero-stats">
|
||||
<div class="meter health" title="Health">
|
||||
<div class="bar" style="width: {percent(_user.stats.hp, 50)}%;"></div>
|
||||
<span class="meter-text"><i class=icon-heart></i> {ceil(_user.stats.hp)} / 50</span>
|
||||
</div>
|
||||
|
||||
<div class="meter experience" title="Experience">
|
||||
<div class="bar" style="width: {percent(_user.stats.exp,tnl(_user.stats.lvl))}%;"></div>
|
||||
<span class="meter-text">
|
||||
{#if _user.history.exp}
|
||||
<a x-bind=click:toggleChart data-toggle-id="exp-chart" data-history-path="_user.history.exp" rel=tooltip title="Progress"><i class=icon-signal></i></a>
|
||||
{/}
|
||||
<i class=icon-star></i> {floor(_user.stats.exp)} / {tnl(_user.stats.lvl)}
|
||||
</span>
|
||||
</div>
|
||||
<div class="meter experience" title="Experience">
|
||||
<div class="bar" style="width: {percent(_user.stats.exp,tnl(_user.stats.lvl))}%;"></div>
|
||||
<span class="meter-text">
|
||||
{#if _user.history.exp}
|
||||
<a x-bind=click:toggleChart data-toggle-id="exp-chart" data-history-path="_user.history.exp" rel=tooltip title="Progress"><i class=icon-signal></i></a>
|
||||
{/}
|
||||
<i class=icon-star></i> {floor(_user.stats.exp)} / {tnl(_user.stats.lvl)}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- party -->
|
||||
<!-- I have an idea to use this loop for the user's herobox/avatar as well
|
||||
NOTE TO SELF: Ask Tyler if some kind of inter-leaving is possible
|
||||
where we can put ONE of the results of this loop BEFORE the progress bars, and the rest after-->
|
||||
{{#each _partyMembers as :member}}
|
||||
<div class="herobox-wrap" style="{{#if equal(:member.id, _userId)}}display:none;{{/}}">
|
||||
{{#unless equal(:member.id, _userId)}}
|
||||
<app:avatar:avatar profile={{:member}} party="true" />
|
||||
<!-- Would be way cleaner as a Derby template `data-content="<app:party:member-stats profile={{:member}} />"`, but it was just printing HTML as text -->
|
||||
<!-- I've re-implemented the rollover using the actual `herobox`/avatar template and data-attributes.
|
||||
This Derby template idea would have been really handy but this is pretty versatile, and keeps it all in the avatar section -->
|
||||
{{/}}
|
||||
</div>
|
||||
{{/}}
|
||||
<!-- party -->
|
||||
<!-- I have an idea to use this loop for the user's herobox/avatar as well
|
||||
NOTE TO SELF: Ask Tyler if some kind of inter-leaving is possible
|
||||
where we can put ONE of the results of this loop BEFORE the progress bars, and the rest after-->
|
||||
{{#each _partyMembers as :member}}
|
||||
<div class="herobox-wrap" style="{{#if equal(:member.id, _userId)}}display:none;{{/}}">
|
||||
{{#unless equal(:member.id, _userId)}}
|
||||
<app:avatar:avatar profile={{:member}} party="true" />
|
||||
<!-- Would be way cleaner as a Derby template `data-content="<app:party:member-stats profile={{:member}} />"`, but it was just printing HTML as text -->
|
||||
<!-- I've re-implemented the rollover using the actual `herobox`/avatar template and data-attributes.
|
||||
This Derby template idea would have been really handy but this is pretty versatile, and keeps it all in the avatar section -->
|
||||
{{/}}
|
||||
</div>
|
||||
{{/}}
|
||||
|
||||
<app:alerts:hiding-bailey />
|
||||
|
||||
</header>
|
||||
{/}
|
||||
<app:alerts:hiding-bailey />
|
||||
</header>
|
||||
|
|
@ -38,6 +38,7 @@
|
|||
<div id="notification-area"></div>
|
||||
<div id="wrap">
|
||||
<app:alerts:flash />
|
||||
{#if _user.preferences.hideHeader}<app:settings:menu />{/} <!-- if they hide the header, we still need user-menu visible -->
|
||||
<div id="exp-chart" style="display:none;"></div>
|
||||
|
||||
<div id=main class="grid">
|
||||
|
|
|
|||