moved basic talent properties in talent-sheet head
- a little bit better gridding of side-properties (still needs a rewrite) - common SCSS mixin for input field marking
This commit is contained in:
parent
3ba5efb8a7
commit
874692ed5c
5 changed files with 33 additions and 19 deletions
src
scss
templates/item
|
@ -1,13 +1,20 @@
|
|||
.basic-properties {
|
||||
flex: 0 0 100%;
|
||||
.basic-property {
|
||||
.basic-property-label {
|
||||
display: grid;
|
||||
align-content: end;
|
||||
|
||||
.basic-property-label,
|
||||
& > label {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.basic-property-select {
|
||||
.basic-property-select,
|
||||
& > select {
|
||||
display: block;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@include mark-invalid-or-disabled-input;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -9,7 +9,7 @@
|
|||
.side-property {
|
||||
margin: 2px 0;
|
||||
display: grid;
|
||||
grid-template-columns: 40% auto;
|
||||
grid-template-columns: minmax(30%, auto) auto;
|
||||
justify-content: left;
|
||||
|
||||
label {
|
||||
|
@ -22,12 +22,9 @@
|
|||
text-align: left;
|
||||
width: calc(100% - 2px);
|
||||
}
|
||||
input:invalid {
|
||||
background-color: $c-invalid-input;
|
||||
}
|
||||
input:disabled {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
@include mark-invalid-or-disabled-input;
|
||||
|
||||
input[type="checkbox"] {
|
||||
width: auto;
|
||||
height: 100%;
|
||||
|
|
|
@ -39,9 +39,8 @@
|
|||
height: 100%;
|
||||
margin: 0px;
|
||||
}
|
||||
input:invalid {
|
||||
background-color: $c-invalid-input;
|
||||
}
|
||||
|
||||
@include mark-invalid-or-disabled-input;
|
||||
}
|
||||
|
||||
.item-name {
|
||||
|
|
|
@ -19,3 +19,12 @@
|
|||
display: grid;
|
||||
place-items: center;
|
||||
}
|
||||
|
||||
@mixin mark-invalid-or-disabled-input {
|
||||
input:invalid {
|
||||
background-color: $c-invalid-input;
|
||||
}
|
||||
input:disabled {
|
||||
background-color: transparent;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -3,9 +3,9 @@
|
|||
{{!-- ======================================================================== --}}
|
||||
|
||||
|
||||
{{#*inline "talentRankSideProperty" }}
|
||||
<div class="side-property">
|
||||
<label for="data.rank.{{property}}">{{localize localizeString}}</label>
|
||||
{{#*inline "talentRankBasicProperty" }}
|
||||
<div class="basic-property">
|
||||
<label class="basic-property-label" for="data.rank.{{property}}">{{localize localizeString}}</label>
|
||||
<input type="number" min="0" step="1" data-dtype="Number" {{disabled}}
|
||||
{{#if (eq property 'base') }}max="{{data.rank.max}}"{{/if}}
|
||||
name="data.rank.{{property}}" value="{{lookup data.rank property}}" />
|
||||
|
@ -22,6 +22,12 @@
|
|||
<div class="header-fields flexrow">
|
||||
<h1 class="charname"><input name="name" type="text" value="{{item.name}}" placeholder="Name" /></h1>
|
||||
<h2 class="item-type">{{localize (lookup config.itemTypes item.type)}}</h2>
|
||||
<div class="grid grid-4col basic-properties">
|
||||
{{> talentRankBasicProperty data=data property='base' localizeString='DS4.TalentRankBase' }}
|
||||
{{> talentRankBasicProperty data=data property='max' localizeString='DS4.TalentRankMax'}}
|
||||
{{> talentRankBasicProperty data=data property='mod' localizeString='DS4.TalentRankMod'}}
|
||||
{{> talentRankBasicProperty data=data property='total' localizeString='DS4.TalentRankTotal' disabled='disabled'}}
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
|
@ -52,10 +58,6 @@
|
|||
{{else}}
|
||||
<span>{{localize "DS4.NotOwned"}}</span>
|
||||
{{/if}}
|
||||
{{> talentRankSideProperty data=data property='base' localizeString='DS4.TalentRankBase' }}
|
||||
{{> talentRankSideProperty data=data property='max' localizeString='DS4.TalentRankMax'}}
|
||||
{{> talentRankSideProperty data=data property='mod' localizeString='DS4.TalentRankMod'}}
|
||||
{{> talentRankSideProperty data=data property='total' localizeString='DS4.TalentRankTotal' disabled='disabled'}}
|
||||
</div>
|
||||
<div class="description" title="{{localize 'DS4.HeadingDescription'}}">
|
||||
{{editor content=data.description target="data.description" button=true owner=owner editable=editable}}
|
||||
|
|
Loading…
Reference in a new issue