Mirror corrected spell slot template from canonical PWA

This commit is contained in:
Admin 2026-10-08 03:17:56 +00:00
parent c39f777478
commit 29b2d5567e

View File

@ -50,17 +50,17 @@ function change(kind:SpellSlotKind,level:number,amount:number){error.value='';tr
<div class="spell-slot-list"> <div class="spell-slot-list">
<div v-for="pool in regular" :key="pool.level" class="spell-slot-row"> <div v-for="pool in regular" :key="pool.level" class="spell-slot-row">
<div class="slot-level"><span class="slot-sigil">✦</span><div><small>SPELL LEVEL</small><strong>{{pool.level}}</strong></div></div> <div class="slot-level"><span class="slot-sigil">✦</span><div><small>SPELL LEVEL</small><strong>{{pool.level}}</strong></div></div>
<div class="spell-slot-track" :aria-label="\`Level \${pool.level}: \${pool.remaining} of \${pool.max} slots remaining\`" role="img"> <div class="spell-slot-track" :aria-label="`Level ${pool.level}: ${pool.remaining} of ${pool.max} slots remaining`" role="img">
<span v-for="index in pool.max" :key="index" class="spell-slot-pip" :class="{spent:index>pool.remaining}" aria-hidden="true">✦</span> <span v-for="index in pool.max" :key="index" class="spell-slot-pip" :class="{spent:index>pool.remaining}" aria-hidden="true">✦</span>
</div> </div>
<div class="spell-slot-controls"><span class="slot-fraction">{{pool.remaining}} / {{pool.max}}</span> <div class="spell-slot-controls"><span class="slot-fraction">{{pool.remaining}} / {{pool.max}}</span>
<button class="quiet" @click="change('standard',pool.level,-1)" :disabled="pool.remaining===0" :aria-label="\`Expend level \${pool.level} spell slot\`">−</button> <button class="quiet" @click="change('standard',pool.level,-1)" :disabled="pool.remaining===0" :aria-label="`Expend level ${pool.level} spell slot`">−</button>
<button class="quiet" @click="change('standard',pool.level,1)" :disabled="pool.remaining===pool.max" :aria-label="\`Restore level \${pool.level} spell slot\`">+</button> <button class="quiet" @click="change('standard',pool.level,1)" :disabled="pool.remaining===pool.max" :aria-label="`Restore level ${pool.level} spell slot`">+</button>
</div> </div>
</div> </div>
<div v-if="pact" class="spell-slot-row pact-slot-row"> <div v-if="pact" class="spell-slot-row pact-slot-row">
<div class="slot-level"><span class="slot-sigil">☾</span><div><small>PACT MAGIC</small><strong>Lvl {{pact.level}}</strong></div></div> <div class="slot-level"><span class="slot-sigil">☾</span><div><small>PACT MAGIC</small><strong>Lvl {{pact.level}}</strong></div></div>
<div class="spell-slot-track" :aria-label="\`Pact Magic level \${pact.level}: \${pact.remaining} of \${pact.max} slots remaining\`" role="img"> <div class="spell-slot-track" :aria-label="`Pact Magic level ${pact.level}: ${pact.remaining} of ${pact.max} slots remaining`" role="img">
<span v-for="index in pact.max" :key="index" class="spell-slot-pip pact-pip" :class="{spent:index>pact.remaining}" aria-hidden="true">✦</span> <span v-for="index in pact.max" :key="index" class="spell-slot-pip pact-pip" :class="{spent:index>pact.remaining}" aria-hidden="true">✦</span>
</div> </div>
<div class="spell-slot-controls"><span class="slot-fraction">{{pact.remaining}} / {{pact.max}}</span> <div class="spell-slot-controls"><span class="slot-fraction">{{pact.remaining}} / {{pact.max}}</span>