ENH: Item sheets styling
U~man
parent
dad790090e
commit
e9f3dc2247
|
|
@ -60,7 +60,8 @@
|
|||
"OSE.ArmorClass": "Armor Class",
|
||||
"OSE.ArmorClassShort": "AC",
|
||||
"OSE.AscArmorClassShort": "AAC",
|
||||
"OSE.SpellDC": "DC",
|
||||
"OSE.SpellDC": "Spell DC",
|
||||
"OSE.SpellDCShort": "DC",
|
||||
"OSE.Thac0": "THAC0",
|
||||
"OSE.MeleeShort": "MEL",
|
||||
"OSE.Melee": "Melee",
|
||||
|
|
@ -98,7 +99,7 @@
|
|||
"OSE.items.Misc": "Misc",
|
||||
"OSE.items.Weapons": "Weapons",
|
||||
"OSE.items.Armors": "Armors",
|
||||
"OSE.items.Weight": "Wght.",
|
||||
"OSE.items.Weight": "Wgt.",
|
||||
"OSE.items.Qualities": "Qualities",
|
||||
"OSE.items.Notes": "Notes",
|
||||
"OSE.items.Cost": "Cost",
|
||||
|
|
|
|||
|
|
@ -55,6 +55,12 @@
|
|||
&:nth-child(even) {
|
||||
background: rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
&:hover {
|
||||
.item-image {
|
||||
background-image: url("/icons/svg/d20-grey.svg") !important;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
.item {
|
||||
line-height: 30px;
|
||||
|
|
@ -77,10 +83,6 @@
|
|||
flex-grow: 0;
|
||||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
&:hover {
|
||||
background-image: url("/icons/svg/d20-grey.svg") !important;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
h4 {
|
||||
margin: 0;
|
||||
|
|
@ -106,9 +108,9 @@
|
|||
flex-grow: 0;
|
||||
text-align: center;
|
||||
&.quantity {
|
||||
margin: 4px 0;
|
||||
display: flex;
|
||||
input {
|
||||
margin: 3px 0;
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,8 +4,26 @@
|
|||
}
|
||||
.sheet-body {
|
||||
.stats {
|
||||
flex: 0 0 70px;
|
||||
flex: 0 0 90px;
|
||||
border-right: 1px groove rgba(0, 0, 0, 0.2);
|
||||
padding-right: 2px;
|
||||
.form-group {
|
||||
margin: 2px;
|
||||
border: 1px solid rgba(0, 0, 0, 0.15);
|
||||
label {
|
||||
background: rgba(0, 0, 0, 0.1);
|
||||
padding: 0 4px;
|
||||
}
|
||||
input {
|
||||
border-bottom: none;
|
||||
margin: auto 0;
|
||||
}
|
||||
}
|
||||
.block-input {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
.editor {
|
||||
height: 255px;
|
||||
|
|
|
|||
|
|
@ -9,9 +9,6 @@
|
|||
<a class="item" data-tab="attributes">
|
||||
{{localize "OSE.category.attributes"}}
|
||||
</a>
|
||||
<a class="item" data-tab="inventory">
|
||||
{{localize "OSE.category.inventory"}}
|
||||
</a>
|
||||
<a class="item" data-tab="abilities">
|
||||
{{localize "OSE.category.abilities"}}
|
||||
</a>
|
||||
|
|
@ -20,6 +17,9 @@
|
|||
{{localize "OSE.category.spells"}}
|
||||
</a>
|
||||
{{/if}}
|
||||
<a class="item" data-tab="inventory">
|
||||
{{localize "OSE.category.inventory"}}
|
||||
</a>
|
||||
<a class="item" data-tab="notes">
|
||||
{{localize "OSE.category.notes"}}
|
||||
</a>
|
||||
|
|
@ -30,9 +30,6 @@
|
|||
<div class="tab" data-group="primary" data-tab="attributes">
|
||||
{{> "systems/ose/templates/actors/partials/character-attributes-tab.html"}}
|
||||
</div>
|
||||
<div class="tab" data-group="primary" data-tab="inventory">
|
||||
{{> "systems/ose/templates/actors/partials/character-inventory-tab.html"}}
|
||||
</div>
|
||||
<div class="tab" data-group="primary" data-tab="abilities">
|
||||
{{> "systems/ose/templates/actors/partials/character-abilities-tab.html"}}
|
||||
</div>
|
||||
|
|
@ -41,6 +38,9 @@
|
|||
{{> "systems/ose/templates/actors/partials/character-spells-tab.html"}}
|
||||
</div>
|
||||
{{/if}}
|
||||
<div class="tab" data-group="primary" data-tab="inventory">
|
||||
{{> "systems/ose/templates/actors/partials/character-inventory-tab.html"}}
|
||||
</div>
|
||||
<div class="tab" data-group="primary" data-tab="notes">
|
||||
{{editor content=data.details.biography target="data.details.biography"
|
||||
button=true owner=owner editable=editable}}
|
||||
|
|
|
|||
|
|
@ -28,7 +28,7 @@
|
|||
{{item.data.damage}}
|
||||
</div>
|
||||
{{/if}}
|
||||
<div class="field-longer">
|
||||
<div class="field-longer" title="{{item.data.qualities}}">
|
||||
{{item.data.qualities}}
|
||||
</div>
|
||||
<div class="field-short">
|
||||
|
|
@ -122,7 +122,7 @@
|
|||
</div>
|
||||
<div class="field-short quantity">
|
||||
<input value="{{item.data.quantity.value}}" type="text"
|
||||
placeholder="0" />{{#if item.data.quantity.max}}<span> / {{item.data.quantity.max}}</span>{{/if}}
|
||||
placeholder="0" />{{#if item.data.quantity.max}}<span>/{{item.data.quantity.max}}</span>{{/if}}
|
||||
</div>
|
||||
<div class="field-short">
|
||||
{{item.data.weight}}
|
||||
|
|
|
|||
|
|
@ -1,102 +1,41 @@
|
|||
<section class="flexrow">
|
||||
<ul class="attributes flexrow">
|
||||
<li class="attribute">
|
||||
<h4 class="attribute-name box-title">{{localize 'OSE.SpellDC'}}</h4>
|
||||
<div class="attribute-value">
|
||||
<input name="data.spells.dc" type="text" value="{{data.spells.dc}}" data-dtype="Number"
|
||||
placeholder="0" />
|
||||
</div>
|
||||
<h4 class="attribute-name box-title">{{localize 'OSE.SpellDCShort'}}</h4>
|
||||
<div class="attribute-value">
|
||||
<input name="data.spells.dc" type="text" value="{{data.spells.dc}}" data-dtype="Number" placeholder="0" />
|
||||
</div>
|
||||
</li>
|
||||
<li class="attribute">
|
||||
<h4 class="attribute-name box-title">{{localize 'OSE.Level'}} 1</h4>
|
||||
<div class="attribute-value">
|
||||
<input name="data.spells.lvl1.value" type="text" value="{{data.spells.lvl1.value}}" data-dtype="Number"
|
||||
placeholder="0" />
|
||||
<span class="sep"> / </span>
|
||||
<input name="data.spells.lvl1.max" type="text" value="{{data.spells.lvl1.max}}" data-dtype="Number" placeholder="0" />
|
||||
</div>
|
||||
</li>
|
||||
<li class="attribute">
|
||||
<h4 class="attribute-name box-title">{{localize 'OSE.Level'}} 2</h4>
|
||||
<div class="attribute-value">
|
||||
<input name="data.spells.lvl2.value" type="text" value="{{data.spells.lvl2.value}}" data-dtype="Number"
|
||||
placeholder="0" data-dtype="Number" />
|
||||
<span class="sep"> / </span>
|
||||
<input name="data.spells.lvl2.max" type="text" value="{{data.spells.lvl2.max}}" data-dtype="Number" placeholder="0" />
|
||||
</div>
|
||||
</li>
|
||||
<li class="attribute">
|
||||
<h4 class="attribute-name box-title">{{localize 'OSE.Level'}} 3</h4>
|
||||
<div class="attribute-value">
|
||||
<input name="data.spells.lvl3.value" type="text" value="{{data.spells.lvl3.value}}"
|
||||
placeholder="0" data-dtype="Number" />
|
||||
<span class="sep"> / </span>
|
||||
<input name="data.spells.lvl3.max" type="text" value="{{data.spells.lvl3.max}}" data-dtype="Number" placeholder="0" />
|
||||
</div>
|
||||
</li>
|
||||
<li class="attribute">
|
||||
<h4 class="attribute-name box-title">{{localize 'OSE.Level'}} 4</h4>
|
||||
<div class="attribute-value">
|
||||
<input name="data.spells.lvl4.value" type="text" value="{{data.spells.lvl4.value}}"
|
||||
placeholder="0" data-dtype="Number" />
|
||||
<span class="sep"> / </span>
|
||||
<input name="data.spells.lvl4.max" type="text" value="{{data.spells.lvl4.max}}" data-dtype="Number" placeholder="0" />
|
||||
</div>
|
||||
</li>
|
||||
<li class="attribute">
|
||||
<h4 class="attribute-name box-title">{{localize 'OSE.Level'}} 5</h4>
|
||||
<div class="attribute-value multiple">
|
||||
<input name="data.spells.lvl5.value" type="text" value="{{data.spells.lvl5.value}}"
|
||||
placeholder="0" data-dtype="Number" />
|
||||
<span class="sep"> / </span>
|
||||
<input name="data.spells.lvl5.max" type="text" value="{{data.spells.lvl5.max}}" data-dtype="Number" placeholder="0" />
|
||||
</div>
|
||||
</li>
|
||||
<li class="attribute">
|
||||
<h4 class="attribute-name box-title">{{localize 'OSE.Level'}} 6</h4>
|
||||
<div class="attribute-value multiple">
|
||||
<input name="data.spells.lvl6.value" type="text" value="{{data.spells.lvl6.value}}"
|
||||
placeholder="0" data-dtype="Number" />
|
||||
<span class="sep"> / </span>
|
||||
<input name="data.spells.lvl6.max" type="text" value="{{data.spells.lvl6.max}}" data-dtype="Number" placeholder="0" />
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
<section class="panel inventory spells">
|
||||
<div class="panel-title">
|
||||
<h4>{{localize 'OSE.category.spells'}}</h4>
|
||||
<div class="item-controls">
|
||||
{{#if owner}}
|
||||
<a class="item-control item-create" title='{{localize "OSE.Add"}}' data-type="spell"><i class="fas fa-plus"></i></a>
|
||||
{{/if}}
|
||||
</div>
|
||||
<div class="item-controls">
|
||||
{{#if owner}}
|
||||
<a class="item-control item-create" title='{{localize "OSE.Add"}}' data-type="spell"><i
|
||||
class="fas fa-plus"></i></a>
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-content resizable" data-base-size="230">
|
||||
{{#each spells as |item|}}
|
||||
<li class="item-entry">
|
||||
<div class="item flexrow" data-item-id="{{item._id}}">
|
||||
<div class="item-name flexrow">
|
||||
<div
|
||||
class="item-image"
|
||||
style="background-image: url({{item.img}})"
|
||||
></div>
|
||||
<div class="item-image" style="background-image: url({{item.img}})"></div>
|
||||
<h4 title="{{item.name}}">
|
||||
{{item.name~}}
|
||||
</h4>
|
||||
</div>
|
||||
<div class="item-controls">
|
||||
{{#if ../owner}}
|
||||
<a class="item-control item-edit" title='{{localize "Ose.Edit"}}'
|
||||
><i class="fas fa-edit"></i
|
||||
></a>
|
||||
<a class="item-control item-delete" title='{{localize "Ose.Delete"}}'
|
||||
><i class="fas fa-trash"></i
|
||||
></a>
|
||||
<a class="item-control item-edit" title='{{localize "Ose.Edit"}}'><i class="fas fa-edit"></i></a>
|
||||
<a class="item-control item-delete" title='{{localize "Ose.Delete"}}'><i class="fas fa-trash"></i></a>
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
{{/each}}
|
||||
</div>
|
||||
</section>
|
||||
</section>
|
||||
|
|
@ -11,25 +11,25 @@
|
|||
<div class="flexrow">
|
||||
<div class="stats">
|
||||
<div class="form-group">
|
||||
<label>{{localize 'OSE.ArmorAC'}}</label>
|
||||
<label>{{localize 'OSE.items.ArmorAC'}}</label>
|
||||
<div class="form-fields">
|
||||
<input type="text" name="data.level" value="{{data.ac}}" data-dtype="Number" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>{{localize 'OSE.ArmorAAC'}}</label>
|
||||
<label>{{localize 'OSE.items.ArmorAAC'}}</label>
|
||||
<div class="form-fields">
|
||||
<input type="text" name="data.class" value="{{data.aac}}" data-dtype="Number" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>{{localize 'OSE.ItemCost'}}</label>
|
||||
<label>{{localize 'OSE.items.Cost'}}</label>
|
||||
<div class="form-fields">
|
||||
<input type="text" name="data.cost" value="{{data.cost}}" data-dtype="Number" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>{{localize 'OSE.ItemWeight'}}</label>
|
||||
<label>{{localize 'OSE.items.Weight'}}</label>
|
||||
<div class="form-fields">
|
||||
<input type="text" name="data.weight" value="{{data.weight}}" data-dtype="Number" />
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -3,17 +3,36 @@
|
|||
<img class="profile-img" src="{{item.img}}" data-edit="img" title="{{item.name}}" />
|
||||
<div class="header-col">
|
||||
<h1 class="charname">
|
||||
<input
|
||||
name="name"
|
||||
type="text"
|
||||
value="{{item.name}}"
|
||||
placeholder="Name"
|
||||
/>
|
||||
<input name="name" type="text" value="{{item.name}}" placeholder="Name" />
|
||||
</h1>
|
||||
</div>
|
||||
</header>
|
||||
<section class="sheet-body">
|
||||
{{editor content=data.description target="data.description"
|
||||
button=true owner=owner editable=editable}}
|
||||
<div class="flexrow">
|
||||
<div class="stats">
|
||||
<div class="form-group">
|
||||
<label>{{localize 'OSE.items.Quantity'}}</label>
|
||||
<div class="form-fields">
|
||||
<input type="text" name="data.quantity.value" value="{{data.quantity.value}}" data-dtype="Number" />/<input type="text" name="data.quantity.max" value="{{data.quantity.max}}" data-dtype="Number" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>{{localize 'OSE.items.Cost'}}</label>
|
||||
<div class="form-fields">
|
||||
<input type="text" name="data.cost" value="{{data.cost}}" data-dtype="Number" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>{{localize 'OSE.items.Weight'}}</label>
|
||||
<div class="form-fields">
|
||||
<input type="text" name="data.weight" value="{{data.weight}}" data-dtype="String" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="description weapon-editor">
|
||||
{{editor content=data.description target="data.description" button=true
|
||||
owner=owner editable=editable}}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</form>
|
||||
</form>
|
||||
|
|
@ -11,31 +11,31 @@
|
|||
<div class="flexrow">
|
||||
<div class="stats">
|
||||
<div class="form-group">
|
||||
<label>{{localize 'OSE.SpellLevel'}}</label>
|
||||
<label>{{localize 'OSE.spells.Level'}}</label>
|
||||
<div class="form-fields">
|
||||
<input type="text" name="data.level" value="{{data.level}}" data-dtype="Number" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>{{localize 'OSE.SpellClass'}}</label>
|
||||
<div class="form-group block-input">
|
||||
<label>{{localize 'OSE.spells.Class'}}</label>
|
||||
<div class="form-fields">
|
||||
<input type="text" name="data.class" value="{{data.class}}" data-dtype="String" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>{{localize 'OSE.SpellRange'}}</label>
|
||||
<div class="form-group block-input">
|
||||
<label>{{localize 'OSE.spells.Range'}}</label>
|
||||
<div class="form-fields">
|
||||
<input type="text" name="data.range" value="{{data.range}}" data-dtype="String" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>{{localize 'OSE.SpellDuration'}}</label>
|
||||
<div class="form-group block-input">
|
||||
<label>{{localize 'OSE.spells.Duration'}}</label>
|
||||
<div class="form-fields">
|
||||
<input type="text" name="data.duration" value="{{data.duration}}" data-dtype="String" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>{{localize 'OSE.ItemRoll'}}</label>
|
||||
<div class="form-group block-input">
|
||||
<label>{{localize 'OSE.items.Roll'}}</label>
|
||||
<div class="form-fields">
|
||||
<input type="text" name="data.roll" value="{{data.roll}}" data-dtype="String" />
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -13,42 +13,42 @@
|
|||
</div>
|
||||
<div class="flexrow">
|
||||
<div class="stats">
|
||||
<div class="form-group">
|
||||
<label>{{localize 'OSE.ItemCost'}}</label>
|
||||
<div class="form-fields">
|
||||
<input type="text" name="data.cost" value="{{data.cost}}" data-dtype="Number" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>{{localize 'OSE.ItemWeight'}}</label>
|
||||
<div class="form-fields">
|
||||
<input type="text" name="data.weight" value="{{data.weight}}" data-dtype="Number" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>{{localize 'OSE.WeaponDamage'}}</label>
|
||||
<div class="form-group block-input">
|
||||
<label>{{localize 'OSE.items.Damage'}}</label>
|
||||
<div class="form-fields">
|
||||
<input type="text" name="data.damage" value="{{data.damage}}" data-dtype="String" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>{{localize 'OSE.WeaponSlow'}}</label>
|
||||
<label>{{localize 'OSE.items.Slow'}}</label>
|
||||
<div class="form-fields">
|
||||
<input type="checkbox" name="data.slow" value="{{data.level}}" {{checked data.slow}} />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>{{localize 'OSE.WeaponMissile'}}</label>
|
||||
<label>{{localize 'OSE.items.Missile'}}</label>
|
||||
<div class="form-fields">
|
||||
<input type="checkbox" name="data.missile" {{checked data.missile}} />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>{{localize 'OSE.WeaponMelee'}}</label>
|
||||
<label>{{localize 'OSE.items.Melee'}}</label>
|
||||
<div class="form-fields">
|
||||
<input type="checkbox" name="data.melee" {{checked data.melee}} />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>{{localize 'OSE.items.Cost'}}</label>
|
||||
<div class="form-fields">
|
||||
<input type="text" name="data.cost" value="{{data.cost}}" data-dtype="Number" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>{{localize 'OSE.items.Weight'}}</label>
|
||||
<div class="form-fields">
|
||||
<input type="text" name="data.weight" value="{{data.weight}}" data-dtype="Number" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="description weapon-editor">
|
||||
{{editor content=data.description target="data.description" button=true
|
||||
|
|
|
|||
Loading…
Reference in New Issue