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:
@@ -1,70 +1,67 @@
|
||||
<div class="{{cssClass}} itemsheet">
|
||||
<div class="itemsheet-header"><label>{{ localize 'MGT2.Specie' }}</label></div>
|
||||
<div class="itemsheet-panel">
|
||||
<div class="itemsheet-maincol">
|
||||
<img class="profile-img" src="{{item.img}}" data-edit="img" data-tooltip="{{item.name}}" />
|
||||
</div>
|
||||
<div class="w-100" style="display: flex;flex-direction: column;justify-content: flex-start;align-items: stretch;">
|
||||
<input class="field item-name" name="name" type="text" value="{{item.name}}" />
|
||||
<div class="field-group mt-1">
|
||||
<div class="item-type-bar">
|
||||
<span class="item-type-label"><i class="fas fa-dna"></i> {{ localize 'MGT2.Specie' }}</span>
|
||||
</div>
|
||||
<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>
|
||||
<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.DetailedDescription' }}</a>
|
||||
<a class="item tab-select" data-tab="tab3">{{ localize 'MGT2.Items.Details' }}</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>
|
||||
<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.DetailedDescription' }}</a>
|
||||
<a class="item tab-select" data-tab="tab3">{{ localize 'MGT2.Items.Details' }}</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>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tab w100 h100" data-group="primary" data-tab="tab2">
|
||||
{{editor system.descriptionLong target="system.descriptionLong" button=true editable=true}}
|
||||
</div>
|
||||
<div class="tab" data-group="primary" data-tab="tab3">
|
||||
<div class="table-container">
|
||||
<div class="table-row heading color-2">
|
||||
<div class="row-item row-item-left upcase">{{ localize 'MGT2.Items.Characteristics' }}</div>
|
||||
<div class="row-item row-item-center row-item-15 flex-fix">{{ localize 'MGT2.Items.Modifiers' }}</div>
|
||||
<div class="row-item row-item-15 item-controls flex-fix"><a class="modifiers-create"><i class="fas fa-plus"></i></a></div>
|
||||
</div>
|
||||
{{#each system.modifiers as |modifier i| }}
|
||||
<div class="table-row modifiers-part" data-modifiers-part="{{i}}" role="rowgroup">
|
||||
<div class="row-item row-item-left">
|
||||
<select name="system.modifiers.{{i}}.characteristic">
|
||||
{{selectOptions ../config.Characteristics selected=modifier.characteristic localize = true}}
|
||||
</select>
|
||||
</div>
|
||||
<div class="row-item row-item-left row-item-15 flex-fix">
|
||||
<input type="number" name="system.modifiers.{{i}}.value" value="{{modifier.value}}" />
|
||||
</div>
|
||||
<div class="row-item row-item-15 item-controls flex-fix">
|
||||
<a class="item-control modifiers-delete" title="Delete Trait"><i class="fas fa-trash"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
{{/each}}
|
||||
</div>
|
||||
<div class="table-container mt-1">
|
||||
<div class="table-row heading color-2">
|
||||
<div class="row-item row-item-30 row-item-left upcase">{{ localize 'MGT2.Items.Traits' }}</div>
|
||||
<div class="row-item row-item-left">{{ localize 'MGT2.Items.Description' }}</div>
|
||||
<div class="row-item row-item-15 item-controls flex-fix"><a class="options-create" data-property="traits"><i class="fas fa-plus"></i></a></div>
|
||||
</div>
|
||||
{{#each system.traits as |trait i| }}
|
||||
<div class="table-row options-part" data-options-part="{{i}}" data-property="traits" role="rowgroup">
|
||||
<div class="row-item row-item-30 row-item-left"><input type="text" name="system.traits.{{i}}.name" value="{{trait.name}}" /></div>
|
||||
<div class="row-item row-item-left">
|
||||
<textarea name="system.traits.{{i}}.description" rows="3">{{trait.description}}</textarea>
|
||||
</div>
|
||||
<div class="row-item row-item-15 item-controls flex-fix">
|
||||
<a class="item-control options-delete" title="Delete Trait"><i class="fas fa-trash"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
{{/each}}
|
||||
</div>
|
||||
</div>
|
||||
<textarea name="system.description" rows="6">{{system.description}}</textarea>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tab" data-group="primary" data-tab="tab2">
|
||||
{{editor system.descriptionLong target="system.descriptionLong" button=true editable=true}}
|
||||
</div>
|
||||
<div class="tab" data-group="primary" data-tab="tab3">
|
||||
<div class="table-container">
|
||||
<div class="table-row heading">
|
||||
<div class="row-item row-item-left">{{ localize 'MGT2.Items.Characteristics' }}</div>
|
||||
<div class="row-item row-item-left" style="flex:0 0 120px;">{{ localize 'MGT2.Items.Modifiers' }}</div>
|
||||
<div class="row-item row-item-right item-controls"><a class="modifiers-create"><i class="fas fa-plus"></i></a></div>
|
||||
</div>
|
||||
{{#each system.modifiers as |modifier i| }}
|
||||
<div class="table-row modifiers-part" data-modifiers-part="{{i}}" role="rowgroup">
|
||||
<div class="row-item row-item-left">
|
||||
<select name="system.modifiers.{{i}}.characteristic">
|
||||
{{selectOptions ../config.Characteristics selected=modifier.characteristic localize=true}}
|
||||
</select>
|
||||
</div>
|
||||
<div class="row-item row-item-left" style="flex:0 0 120px;">
|
||||
<input type="number" name="system.modifiers.{{i}}.value" value="{{modifier.value}}" />
|
||||
</div>
|
||||
<div class="row-item row-item-right item-controls">
|
||||
<a class="item-control modifiers-delete" title="Delete Trait"><i class="fas fa-trash"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
{{/each}}
|
||||
</div>
|
||||
<div class="table-container" style="margin-top:8px;">
|
||||
<div class="table-row heading">
|
||||
<div class="row-item row-item-left" style="flex:0 0 30%;">{{ localize 'MGT2.Items.Traits' }}</div>
|
||||
<div class="row-item row-item-left">{{ localize 'MGT2.Items.Description' }}</div>
|
||||
<div class="row-item row-item-right item-controls"><a class="options-create" data-property="traits"><i class="fas fa-plus"></i></a></div>
|
||||
</div>
|
||||
{{#each system.traits as |trait i| }}
|
||||
<div class="table-row options-part" data-options-part="{{i}}" data-property="traits" role="rowgroup">
|
||||
<div class="row-item row-item-left" style="flex:0 0 30%;"><input type="text" name="system.traits.{{i}}.name" value="{{trait.name}}" /></div>
|
||||
<div class="row-item row-item-left">
|
||||
<textarea name="system.traits.{{i}}.description" rows="2">{{trait.description}}</textarea>
|
||||
</div>
|
||||
<div class="row-item row-item-right item-controls">
|
||||
<a class="item-control options-delete" title="Delete Trait"><i class="fas fa-trash"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
{{/each}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
Reference in New Issue
Block a user