cleaned up the armor and gear sheet css

This commit is contained in:
TheLastScrub
2021-06-05 11:31:08 -07:00
parent e0e81933de
commit 25c19b7941
3 changed files with 99 additions and 45 deletions
+50
View File
@@ -668,4 +668,54 @@ div.motivation-editor-container div.editor{
text-align: left;
padding-left: 5px;
grid-gap: 5px;
}
/*
Armor Item Sheet
*/
.armor-sheet-grid-2col{
display: grid;
grid-template-columns: 25% 75%;
align-items: center;
justify-content: center;
text-align: center;
padding-left: 5px;
grid-gap: 5px;
}
.armor-sheet-horizontal-grid-2col{
display: grid;
grid-template-columns: 100px auto;
align-items: center;
text-align: left;
padding-bottom: 10px;
column-gap: 10px;
row-gap: 10px;
padding-right: 5px;
}
/*
Gear Item Sheet
*/
.gear-sheet-grid-2col{
display: grid;
grid-template-columns: 25% 75%;
align-items: center;
justify-content: center;
text-align: center;
padding-left: 5px;
grid-gap: 5px;
}
.gear-sheet-horizontal-grid-2col{
display: grid;
grid-template-columns: 100px auto;
align-items: center;
text-align: left;
padding-bottom: 10px;
column-gap: 10px;
row-gap: 10px;
padding-right: 5px;
}
+23 -23
View File
@@ -1,30 +1,30 @@
<form class="{{cssClass}} {{getFontFamilySystemSettingClass}}" autocomplete="off">
<header class="sheet-header">
<div class="armor-sheet-grid-2col">
<img class="profile-img" src="{{item.img}}" data-edit="img" title="{{item.name}}"/>
<div class="header-fields">
<h1 class="charname"><input name="name" type="text" value="{{item.name}}" placeholder="{{localize 'DG.ItemWindow.Armor.NamePlaceholder'}}"/></h1>
<div class="grid grid-2col">
<div class="resource">
<label class="resource-label">{{localize 'DG.ItemWindow.Armor.ArmorRating'}}</label>
<input type="text" name="data.protection" value="{{data.data.protection}}" data-dtype="Number"/>
</div>
<div class="resource">
<label class="resource-label">{{localize 'DG.ItemWindow.Armor.Expense'}}</label>
<select name="data.expense" >
<option {{#if_eq data.data.expense 'Incidental'}}selected{{/if_eq}} value="Incidental">{{localize 'DG.Gear.Expense.Incidental'}}</option>
<option {{#if_eq data.data.expense 'Standard'}}selected{{/if_eq}} value="Standard">{{localize 'DG.Gear.Expense.Standard'}}</option>
<option {{#if_eq data.data.expense 'Unusual'}}selected{{/if_eq}} value="Unusual">{{localize 'DG.Gear.Expense.Unusual'}}</option>
<option {{#if_eq data.data.expense 'Major'}}selected{{/if_eq}} value="Major">{{localize 'DG.Gear.Expense.Major'}}</option>
<option {{#if_eq data.data.expense 'Extreme'}}selected{{/if_eq}} value="Extreme">{{localize 'DG.Gear.Expense.Extreme'}}</option>
</select>
</div>
<div class="resource">
<label class="resource-label">{{localize 'DG.ItemWindow.Armor.Equipped'}}</label>
<input class="labeled-resource-checkbox" type="checkbox" name="data.equipped" {{checked data.data.equipped}} data-dtype="Boolean" />
</div>
</div>
<div class="armor-sheet-horizontal-grid-2col">
<span class="resource-label">{{localize 'DG.Bonds.Name'}}:</span>
<input name="name" type="text" value="{{item.name}}" placeholder="{{localize 'DG.ItemWindow.Armor.NamePlaceholder'}}"/></h1>
<span class="resource-label">{{localize 'DG.ItemWindow.Armor.ArmorRating'}}:</span>
<input type="text" name="data.protection" value="{{data.data.protection}}" data-dtype="Number"/>
<span class="resource-label">{{localize 'DG.ItemWindow.Armor.Expense'}}:</span>
<select name="data.expense" >
<option {{#if_eq data.data.expense 'Incidental'}}selected{{/if_eq}} value="Incidental">{{localize 'DG.Gear.Expense.Incidental'}}</option>
<option {{#if_eq data.data.expense 'Standard'}}selected{{/if_eq}} value="Standard">{{localize 'DG.Gear.Expense.Standard'}}</option>
<option {{#if_eq data.data.expense 'Unusual'}}selected{{/if_eq}} value="Unusual">{{localize 'DG.Gear.Expense.Unusual'}}</option>
<option {{#if_eq data.data.expense 'Major'}}selected{{/if_eq}} value="Major">{{localize 'DG.Gear.Expense.Major'}}</option>
<option {{#if_eq data.data.expense 'Extreme'}}selected{{/if_eq}} value="Extreme">{{localize 'DG.Gear.Expense.Extreme'}}</option>
</select>
<span class="resource-label">{{localize 'DG.ItemWindow.Armor.Equipped'}}:</span>
<input class="labeled-resource-checkbox" type="checkbox" name="data.equipped" {{checked data.data.equipped}} data-dtype="Boolean" />
</div>
</div>
</header>
{{!-- Sheet Tab Navigation --}}
+26 -22
View File
@@ -1,14 +1,35 @@
<form class="{{cssClass}} {{getFontFamilySystemSettingClass}}" autocomplete="off">
<header class="sheet-header">
<img class="profile-img" src="{{item.img}}" data-edit="img" title="{{item.name}}"/>
<div class="header-fields">
<h1 class="charname"><input name="name" type="text" value="{{item.name}}" placeholder="{{localize 'DG.ItemWindow.Gear.NamePlaceholder'}}"/></h1>
<div class="gear-sheet-grid-2col">
<img class="profile-img" src="{{item.img}}" data-edit="img" title="{{item.name}}"/>
<div class="gear-sheet-horizontal-grid-2col">
<span class="resource-label">{{localize 'DG.Bonds.Name'}}:</span>
<input name="name" type="text" value="{{item.name}}" placeholder="{{localize 'DG.ItemWindow.Gear.NamePlaceholder'}}"/>
<span class="resource-label">{{localize 'DG.ItemWindow.Gear.Expense'}}:</span>
<select name="data.expense" >
<option {{#if_eq data.data.expense 'Incidental'}}selected{{/if_eq}} value="Incidental">{{localize 'DG.Gear.Expense.Incidental'}}</option>
<option {{#if_eq data.data.expense 'Standard'}}selected{{/if_eq}} value="Standard">{{localize 'DG.Gear.Expense.Standard'}}</option>
<option {{#if_eq data.data.expense 'Unusual'}}selected{{/if_eq}} value="Unusual">{{localize 'DG.Gear.Expense.Unusual'}}</option>
<option {{#if_eq data.data.expense 'Major'}}selected{{/if_eq}} value="Major">{{localize 'DG.Gear.Expense.Major'}}</option>
<option {{#if_eq data.data.expense 'Extreme'}}selected{{/if_eq}} value="Extreme">{{localize 'DG.Gear.Expense.Extreme'}}</option>
</select>
<span class="resource-label">{{localize 'DG.ItemWindow.Gear.Equipped'}}:</span>
<input class="labeled-resource-checkbox" type="checkbox" name="data.equipped" {{checked data.data.equipped}} data-dtype="Boolean" />
</div>
</div>
</header>
{{!-- Sheet Tab Navigation --}}
<nav class="sheet-tabs tabs" data-group="primary">
<a class="item" data-tab="attributes">{{localize 'DG.ItemWindow.Gear.Attributes'}}</a>
<!-- <a class="item" data-tab="attributes">{{localize 'DG.ItemWindow.Gear.Attributes'}}</a> -->
<a class="item" data-tab="description">{{localize 'DG.ItemWindow.Gear.Description'}}</a>
</nav>
@@ -19,23 +40,6 @@
<div class="tab" data-group="primary" data-tab="description">
{{editor content=data.data.description target="data.description" button=true owner=owner editable=editable}}
</div>
{{!-- Attributes Tab --}}
<div class="tab attributes" data-group="primary" data-tab="attributes">
<div class="resource">
<label class="resource-label">{{localize 'DG.ItemWindow.Gear.Expense'}}:</label>
<select name="data.expense" >
<option {{#if_eq data.data.expense 'Incidental'}}selected{{/if_eq}} value="Incidental">{{localize 'DG.Gear.Expense.Incidental'}}</option>
<option {{#if_eq data.data.expense 'Standard'}}selected{{/if_eq}} value="Standard">{{localize 'DG.Gear.Expense.Standard'}}</option>
<option {{#if_eq data.data.expense 'Unusual'}}selected{{/if_eq}} value="Unusual">{{localize 'DG.Gear.Expense.Unusual'}}</option>
<option {{#if_eq data.data.expense 'Major'}}selected{{/if_eq}} value="Major">{{localize 'DG.Gear.Expense.Major'}}</option>
<option {{#if_eq data.data.expense 'Extreme'}}selected{{/if_eq}} value="Extreme">{{localize 'DG.Gear.Expense.Extreme'}}</option>
</select>
</div>
<div class="resource">
<label class="resource-label">{{localize 'DG.ItemWindow.Gear.Equipped'}}:</label>
<input class="labeled-resource-checkbox" type="checkbox" name="data.equipped" {{checked data.data.equipped}} data-dtype="Boolean" />
</div>
</div>
</section>
</form>