Enhance calculator modifiers and UI styling
This commit is contained in:
@@ -148,12 +148,47 @@
|
||||
<section class="af-grid">
|
||||
<div class="af-card">
|
||||
<div class="af-card-header">
|
||||
<h2>Modifier library</h2>
|
||||
<p>No live modifiers yet. Use this space to jot down prototype buffs.</p>
|
||||
<h2>Modifiers & operatives</h2>
|
||||
<p>Stack items, perks, and abilities with operative-specific bonuses.</p>
|
||||
</div>
|
||||
<div class="af-empty">
|
||||
<p>Modifier slots are empty.</p>
|
||||
<button type="button" class="af-muted-button">Add placeholder</button>
|
||||
<div class="af-modifier-stack" data-source="{{ url_for('static', filename='json/modifiers.json') }}">
|
||||
<label>
|
||||
Operative
|
||||
<select id="af-operative-select" name="operativeSelect"
|
||||
data-source="{{ url_for('static', filename='json/operative.json') }}">
|
||||
<option value="">No operative selected</option>
|
||||
</select>
|
||||
<span class="af-field-hint">Pick an operative to load their unique modifiers.</span>
|
||||
</label>
|
||||
|
||||
<div class="af-modifier-subset">
|
||||
<p class="af-modifier-title">Operative modifiers</p>
|
||||
<div class="af-checkbox-grid" id="af-operative-modifiers">
|
||||
<p class="af-empty-hint">Select an operative to see perk modifiers.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="af-modifier-subset">
|
||||
<p class="af-modifier-title">Item buffs</p>
|
||||
<div class="af-checkbox-grid" id="af-item-modifiers"></div>
|
||||
</div>
|
||||
|
||||
<div class="af-modifier-subset">
|
||||
<p class="af-modifier-title">Operative perks</p>
|
||||
<div class="af-checkbox-grid" id="af-perk-modifiers"></div>
|
||||
</div>
|
||||
|
||||
<div class="af-modifier-subset">
|
||||
<p class="af-modifier-title">Ability perks</p>
|
||||
<div class="af-checkbox-grid" id="af-ability-modifiers"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="af-active-modifiers">
|
||||
<p class="af-modifier-title">Active stack</p>
|
||||
<div class="af-tag-list" id="af-active-modifiers">
|
||||
<span class="af-tag">No modifiers selected</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="af-card">
|
||||
|
||||
Reference in New Issue
Block a user