diff --git a/src/ds4.scss b/src/ds4.scss
index b2e83661..5eae4571 100644
--- a/src/ds4.scss
+++ b/src/ds4.scss
@@ -18,4 +18,5 @@
@import "scss/components/items";
@import "scss/components/description";
@import "scss/components/character_values";
+ @import "scss/components/attributes_traits";
}
diff --git a/src/module/config.ts b/src/module/config.ts
index cb5437b3..89d285cf 100644
--- a/src/module/config.ts
+++ b/src/module/config.ts
@@ -106,10 +106,10 @@ export const DS4 = {
*/
traits: {
strength: "DS4.TraitStrength",
- constitution: "DS4.TraitConstitution",
agility: "DS4.TraitAgility",
- dexterity: "DS4.TraitDexterity",
intellect: "DS4.TraitIntellect",
+ constitution: "DS4.TraitConstitution",
+ dexterity: "DS4.TraitDexterity",
aura: "DS4.TraitAura",
},
diff --git a/src/module/ds4.ts b/src/module/ds4.ts
index 18e066a5..99227746 100644
--- a/src/module/ds4.ts
+++ b/src/module/ds4.ts
@@ -37,6 +37,7 @@ async function registerHandlebarsPartials() {
"systems/ds4/templates/item/partials/effects.hbs",
"systems/ds4/templates/item/partials/body.hbs",
"systems/ds4/templates/actor/partials/items-overview.hbs",
+ "systems/ds4/templates/actor/partials/attributes-traits.hbs",
];
return loadTemplates(templatePaths);
}
@@ -67,7 +68,7 @@ Hooks.once("setup", function () {
];
// Exclude some from sorting where the default order matters
- const noSort = [];
+ const noSort = ["attributes", "traits"];
// Localize and sort CONFIG objects
for (const o of toLocalize) {
diff --git a/src/scss/components/_attributes_traits.scss b/src/scss/components/_attributes_traits.scss
new file mode 100644
index 00000000..88ae9425
--- /dev/null
+++ b/src/scss/components/_attributes_traits.scss
@@ -0,0 +1,46 @@
+.attributes-traits {
+ margin-top: $margin-sm;
+ .attribute {
+ .attribute-label {
+ font-family: $font-heading;
+ font-size: 2em;
+ text-align: center;
+ }
+ .attribute-value {
+ border: 2px groove $c-border-groove;
+ line-height: 26px;
+ font-size: 1.5em;
+ text-align: center;
+ padding-left: 2px;
+ padding-right: 2px;
+ gap: 0;
+ input,
+ .attribute-value-total {
+ grid-column: span 2;
+ }
+ }
+ }
+ .trait {
+ .trait-label {
+ color: transparent;
+ font-family: $font-heading;
+ font-size: 2em;
+ text-align: center;
+ //text-shadow: -1px 1px 0 $c-black, 1px 1px 0 $c-black, 1px -1px 0 $c-black, -1px -1px 0 $c-black;
+ -webkit-text-stroke: 1px $c-black;
+ }
+ .trait-value {
+ border: 2px groove $c-border-groove;
+ font-size: 1.5em;
+ line-height: 26px;
+ text-align: center;
+ padding-left: 2px;
+ padding-right: 2px;
+ gap: 0;
+ input,
+ .trait-value-total {
+ grid-column: span 2;
+ }
+ }
+ }
+}
diff --git a/src/scss/components/_character_values.scss b/src/scss/components/_character_values.scss
index 7b6ec7d6..b27e2252 100644
--- a/src/scss/components/_character_values.scss
+++ b/src/scss/components/_character_values.scss
@@ -1,52 +1,6 @@
header.sheet-header {
.character-values {
flex: 0 0 100%;
- .attributes-traits {
- margin-top: $margin-sm;
- .attribute {
- .attribute-label {
- font-family: $font-heading;
- font-size: 2em;
- text-align: center;
- }
- .attribute-value {
- border: 2px groove $c-border-groove;
- line-height: 26px;
- font-size: 1.5em;
- text-align: center;
- padding-left: 2px;
- padding-right: 2px;
- gap: 0;
- input,
- .attribute-value-total {
- grid-column: span 2;
- }
- }
- }
- .trait {
- .trait-label {
- color: transparent;
- font-family: $font-heading;
- font-size: 2em;
- text-align: center;
- //text-shadow: -1px 1px 0 $c-black, 1px 1px 0 $c-black, 1px -1px 0 $c-black, -1px -1px 0 $c-black;
- -webkit-text-stroke: 1px $c-black;
- }
- .trait-value {
- border: 2px groove $c-border-groove;
- font-size: 1.5em;
- line-height: 26px;
- text-align: center;
- padding-left: 2px;
- padding-right: 2px;
- gap: 0;
- input,
- .trait-value-total {
- grid-column: span 2;
- }
- }
- }
- }
.combat-values {
margin-top: $margin-sm;
.combat-value-with-formula {
diff --git a/src/templates/actor/actor-sheet.hbs b/src/templates/actor/actor-sheet.hbs
index 4f0c21f5..f288880e 100644
--- a/src/templates/actor/actor-sheet.hbs
+++ b/src/templates/actor/actor-sheet.hbs
@@ -81,86 +81,9 @@
</div>
</div>
</div>
- <div class="attributes-traits grid grid-3col">
- <div class="attribute flexrow"><label for="data.attributes.body.total"
- class="attribute-label ">{{config.attributes.body}}</label>
- <div class="attribute-value flex15 grid grid-8col"><input type="number"
- name="data.attributes.body.base" value='{{data.attributes.body.base}}'
- data-dtype="Number" /><span> +
- </span><input type="number" name="data.attributes.body.mod" value='{{data.attributes.body.mod}}'
- data-dtype="Number" /><span> =
- </span><span class="attribute-value-total">{{data.attributes.body.total}}</span></div>
- </div>
- <div class="attribute flexrow"><label for="data.attributes.mobility.total"
- class="attribute-label">{{config.attributes.mobility}}</label>
- <div class="attribute-value flex15 grid grid-8col"><input type="number"
- name="data.attributes.mobility.base" value='{{data.attributes.mobility.base}}'
- data-dtype="Number" /><span> +
- </span><input type="number" name="data.attributes.mobility.mod"
- value='{{data.attributes.mobility.mod}}' data-dtype="Number" /><span> =
- </span><span class="attribute-value-total">{{data.attributes.mobility.total}}</span></div>
- </div>
- <div class="attribute flexrow"><label for="data.attributes.mind.total"
- class="attribute-label">{{config.attributes.mind}}</label>
- <div class="attribute-value flex15 grid grid-8col"><input type="number"
- name="data.attributes.mind.base" value='{{data.attributes.mind.base}}'
- data-dtype="Number" /><span> +
- </span><input type="number" name="data.attributes.mind.mod" value='{{data.attributes.mind.mod}}'
- data-dtype="Number" /><span> =
- </span><span class="attribute-value-total">{{data.attributes.mind.total}}</span></div>
- </div>
- <div class="trait flexrow"><label for="data.traits.strength.total"
- class="trait-label">{{config.traits.strength}}</label>
- <div class="trait-value flex15 grid grid-8col"><input type="number" name="data.traits.strength.base"
- value='{{data.traits.strength.base}}' data-dtype="Number" /><span> +
- </span><input type="number" name="data.traits.strength.mod" value='{{data.traits.strength.mod}}'
- data-dtype="Number" /><span> =
- </span><span class="trait-value-total">{{data.traits.strength.total}}</span></div>
- </div>
- <div class="trait flexrow"><label for="data.traits.agility.total"
- class="trait-label">{{config.traits.agility}}</label>
- <div class="trait-value flex15 grid grid-8col"><input type="number" name="data.traits.agility.base"
- value='{{data.traits.agility.base}}' data-dtype="Number" /><span> +
- </span><input type="number" name="data.traits.agility.mod" value='{{data.traits.agility.mod}}'
- data-dtype="Number" /><span> =
- </span><span class="trait-value-total">{{data.traits.agility.total}}</span></div>
- </div>
- <div class="trait flexrow"><label for="data.traits.intellect.total"
- class="trait-label">{{config.traits.intellect}}</label>
- <div class="trait-value flex15 grid grid-8col"><input type="number"
- name="data.traits.intellect.base" value='{{data.traits.intellect.base}}'
- data-dtype="Number" /><span> +
- </span><input type="number" name="data.traits.intellect.mod"
- value='{{data.traits.intellect.mod}}' data-dtype="Number" /><span> =
- </span><span class="trait-value-total">{{data.traits.intellect.total}}</span></div>
- </div>
- <div class="trait flexrow"><label for="data.traits.constitution.total"
- class="trait-label">{{config.traits.constitution}}</label>
- <div class="trait-value flex15 grid grid-8col"><input type="number"
- name="data.traits.constitution.base" value='{{data.traits.constitution.base}}'
- data-dtype="Number" /><span> +
- </span><input type="number" name="data.traits.constitution.mod"
- value='{{data.traits.constitution.mod}}' data-dtype="Number" /><span> =
- </span><span class="trait-value-total">{{data.traits.constitution.total}}</span></div>
- </div>
- <div class="trait flexrow"><label for="data.traits.dexterity.total"
- class="trait-label">{{config.traits.dexterity}}</label>
- <div class="trait-value flex15 grid grid-8col"><input type="number"
- name="data.traits.dexterity.base" value='{{data.traits.dexterity.base}}'
- data-dtype="Number" /><span> +
- </span><input type="number" name="data.traits.dexterity.mod"
- value='{{data.traits.dexterity.mod}}' data-dtype="Number" /><span> =
- </span><span class="trait-value-total">{{data.traits.dexterity.total}}</span></div>
- </div>
- <div class="trait flexrow"><label for="data.traits.aura.total"
- class="trait-label">{{config.traits.aura}}</label>
- <div class="trait-value flex15 grid grid-8col"><input type="number" name="data.traits.aura.base"
- value='{{data.traits.aura.base}}' data-dtype="Number" /><span> +
- </span><input type="number" name="data.traits.aura.mod" value='{{data.traits.aura.mod}}'
- data-dtype="Number" /><span> =
- </span><span class="trait-value-total">{{data.traits.aura.total}}</span></div>
- </div>
- </div>
+
+ {{> systems/ds4/templates/actor/partials/attributes-traits.hbs}}
+
<div class="combat-values flexrow flex-between">
<div class="combat-value-with-formula">
<div class="combat-value hitPoints"><span
diff --git a/src/templates/actor/partials/attributes-traits.hbs b/src/templates/actor/partials/attributes-traits.hbs
new file mode 100644
index 00000000..14fece65
--- /dev/null
+++ b/src/templates/actor/partials/attributes-traits.hbs
@@ -0,0 +1,52 @@
+{{!-- ======================================================================== --}}
+{{!-- INLINE PARTIAL DEFINITIONS --}}
+{{!-- ======================================================================== --}}
+
+{{!--
+!-- Render an attribute.
+!--
+!-- @param attribute-label: The label to display for the attribute
+!-- @param attribute-key: The key of the attribute
+!-- @param attribute-data: The data for the attribute
+--}}
+
+{{#*inline "attribute"}}
+<div class="attribute flexrow"><label for="data.attributes.body.total"
+ class="attribute-label ">{{attribute-label}}</label>
+ <div class="attribute-value flex15 grid grid-8col"><input type="number"
+ name="data.attributes.{{attribute-key}}.base" value='{{attribute-data.base}}' data-dtype="Number" /><span> +
+ </span><input type="number" name="data.attributes.{{attribute-key}}.mod" value='{{attribute-data.mod}}'
+ data-dtype="Number" /><span> =
+ </span><span class="attribute-value-total">{{attribute-data.total}}</span></div>
+</div>
+{{/inline}}
+
+{{!--
+!-- Render a trait.
+!--
+!-- @param trait-label: The label to display for the trait
+!-- @param trait-key: The key of the trait
+!-- @param trait-data: The data for the trait
+--}}
+
+{{#*inline "trait"}}
+<div class="trait flexrow"><label for="data.traits.strength.total" class="trait-label">{{trait-label}}</label>
+ <div class="trait-value flex15 grid grid-8col"><input type="number" name="data.traits.{{trait-key}}.base"
+ value='{{trait-data.base}}' data-dtype="Number" /><span> +
+ </span><input type="number" name="data.traits.{{trait-key}}.mod" value='{{trait-data.mod}}'
+ data-dtype="Number" /><span> =
+ </span><span class="trait-value-total">{{trait-data.total}}</span></div>
+</div>
+{{/inline}}
+
+{{!-- ======================================================================== --}}
+
+<div class="attributes-traits grid grid-3col">
+ {{#each config.attributes as |attribute-label attribute-key|}}
+ {{> attribute attribute-label=attribute-label attribute-key=attribute-key attribute-data=(lookup ../data.attributes
+ attribute-key)}}
+ {{/each}}
+ {{#each config.traits as |trait-label trait-key|}}
+ {{> trait trait-label=trait-label trait-key=trait-key trait-data=(lookup ../data.traits trait-key)}}
+ {{/each}}
+</div>