feat: complete visual redesign of all item sheets + compact chat roll messages

- Rewrote _item.sass with unified layout: type-bar + dark header + stats pills + tabs
 - All 11 item templates converted to new pill-based stats bar
 - Chat roll message font sizes and padding compacted
 - Physical item partial rewritten as stat pills (QTY/WEIGHT/COST/TL)
 - Legacy itemsheet-header and itemsheet-maincol hidden
This commit is contained in:
2026-04-19 21:31:52 +02:00
parent d62d14c1da
commit df0a93d715
15 changed files with 978 additions and 679 deletions

View File

@@ -1,57 +1,57 @@
<div class="{{cssClass}} itemsheet">
<div class="itemsheet-header">
<div class="item-type-bar">
{{#if (eq system.subType "augment")}}
<label>{{localize 'MGT2.EquipmentSubType.augment'}}</label>
<span class="item-type-label"><i class="fas fa-dna"></i> {{localize 'MGT2.EquipmentSubType.augment'}}</span>
{{else if (eq system.subType "trinket")}}
<label>{{localize 'MGT2.EquipmentSubType.trinket'}}</label>
<span class="item-type-label"><i class="fas fa-gem"></i> {{localize 'MGT2.EquipmentSubType.trinket'}}</span>
{{else if (eq system.subType "clothing")}}
<label>{{localize 'MGT2.EquipmentSubType.clothing'}}</label>
<span class="item-type-label"><i class="fas fa-shirt"></i> {{localize 'MGT2.EquipmentSubType.clothing'}}</span>
{{else}}
<label>{{localize 'MGT2.EquipmentSubType.equipment'}}</label>
<span class="item-type-label"><i class="fas fa-toolbox"></i> {{localize 'MGT2.EquipmentSubType.equipment'}}</span>
{{/if}}
</div>
<div class="itemsheet-panel">
<div class="itemsheet-maincol">
<img class="profile-img" src="{{item.img}}" data-edit="img" data-tooltip="{{item.name}}" />
<div class="field-group mt-1">
<label>{{ localize 'MGT2.Items.Type' }}</label>
<select name="system.subType">
{{selectOptions config.EquipmentSubType selected = system.subType localize = true}}
</select>
</div>
{{> systems/mgt2/templates/items/parts/sheet-physical-item.html }}
<div class="item-sheet-header">
<img class="item-header-img" src="{{item.img}}" data-edit="img" data-tooltip="{{item.name}}" />
<input class="item-header-name" name="name" type="text" value="{{item.name}}" />
</div>
<div class="item-stats-bar">
<div class="item-stat-pill">
<span class="stat-label">{{ localize 'MGT2.Items.Type' }}</span>
<select name="system.subType" style="font-size:0.75rem;">
{{selectOptions config.EquipmentSubType selected=system.subType localize=true}}
</select>
</div>
<div class="w-100">
<input class="field field-item-name" name="name" type="text" value="{{item.name}}" />
<nav class="horizontal-tabs tabs mt-1" data-group="primary">
<a class="item tab-select" data-tab="tab1">{{ localize 'MGT2.Items.Description' }}</a>
<a class="item tab-select" data-tab="tab2">{{ localize 'MGT2.Items.Details' }}</a>
<a class="item tab-select" data-tab="tab3">{{ localize 'MGT2.Items.Configuration' }}</a>
</nav>
<div class="tab" data-group="primary" data-tab="tab1">
<div class="field-group mt-1">
<label>{{ localize 'MGT2.Items.Description' }}</label>
<textarea name="system.description" rows="6">{{system.description}}</textarea>
{{> systems/mgt2/templates/items/parts/sheet-physical-item.html }}
</div>
<nav class="horizontal-tabs tabs" data-group="primary">
<a class="item tab-select" data-tab="tab1">{{ localize 'MGT2.Items.Description' }}</a>
<a class="item tab-select" data-tab="tab2">{{ localize 'MGT2.Items.Details' }}</a>
<a class="item tab-select" data-tab="tab3">{{ localize 'MGT2.Items.Configuration' }}</a>
</nav>
<div class="tab-content-area">
<div class="tab" data-group="primary" data-tab="tab1">
<div class="field-group">
<label>{{ localize 'MGT2.Items.Description' }}</label>
<textarea name="system.description" rows="6">{{system.description}}</textarea>
</div>
</div>
<div class="tab" data-group="primary" data-tab="tab2">
<div class="field-groups">
<div class="field-group">
<label class="mgt2-checkbox"><input type="checkbox" name="system.equipped" data-dtype="Boolean" {{checked system.equipped}} />Equipped</label>
</div>
</div>
<div class="tab" data-group="primary" data-tab="tab2">
<div class="field-groups mt-1">
<div class="field-group">
<label class="mgt2-checkbox"><input type="checkbox" name="system.equipped" data-dtype="Boolean" {{checked system.equipped}} />Equipped</label>
</div>
{{#if hadContainer}}
<div class="field-group">
<label>{{ localize 'MGT2.Items.Storage' }}</label>
<select name="system.container.id">
{{selectOptions containers selected=system.container.id valueAttr="_id" labelAttr="name"}}
</select>
</div>
{{/if}}
{{#if hadContainer}}
<div class="field-group">
<label>{{ localize 'MGT2.Items.Storage' }}</label>
<select name="system.container.id">
{{selectOptions containers selected=system.container.id valueAttr="_id" labelAttr="name"}}
</select>
</div>
{{/if}}
</div>
<div class="tab" data-group="primary" data-tab="tab3">
{{> systems/mgt2/templates/items/parts/sheet-configuration.html }}
</div>
</div>
<div class="tab" data-group="primary" data-tab="tab3">
{{> systems/mgt2/templates/items/parts/sheet-configuration.html }}
</div>
</div>
</div>