Fix #5 : Edit features + display as tooltip when hovering stats

css/fvtt-cthulhu-eternal.css

@@ -423,11 +423,24 @@ i.fvtt-cthulhu-eternal {
 .fvtt-cthulhu-eternal .protagonist-biography .field-label {
   margin-left: 8px;
 }
+.fvtt-cthulhu-eternal .protagonist-biography .features,
 .fvtt-cthulhu-eternal .protagonist-biography .biodata {
   display: grid;
-  grid-template-columns: repeat(3, 1fr);
+  grid-template-columns: repeat(2, 1fr);
   gap: 8px;
 }
+.fvtt-cthulhu-eternal .protagonist-biography .features label,
+.fvtt-cthulhu-eternal .protagonist-biography .biodata label {
+  min-width: 3rem;
+}
+.fvtt-cthulhu-eternal .protagonist-biography .features .feature,
+.fvtt-cthulhu-eternal .protagonist-biography .biodata .feature {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  min-width: 18rem;
+  max-width: 18rem;
+}
 .fvtt-cthulhu-eternal .protagonist-biography .motivations {
   display: grid;
   grid-template-columns: repeat(2, 1fr);

lang/en.json

@@ -35,6 +35,9 @@
     "Protagonist": {
       "FIELDS": {
         "biodata": {
+          "feature": {
+            "label": "Feature"
+          },
           "harshness": {
             "label": "Harshness"
           },
@@ -256,6 +259,7 @@
       "veryHarsh": "Very Harsh"
     },
     "Label": {
+      "distinguishingFeatures": "Distinguishing Features",
       "titleSkill": "Skill",
       "titleWeapon": "Weapon",
       "biodata": "Biodata",

styles/protagonist.less

@@ -203,11 +203,24 @@
   .field-label {
     margin-left: 8px;
   }
+  
+  .features,
   .biodata {
     display: grid;
-    grid-template-columns: repeat(3, 1fr);
+    grid-template-columns: repeat(2, 1fr);
     gap: 8px;
+    label {
+      min-width: 3.0rem;
+    }
+    .feature {
+        display: flex;
+        align-items: center;
+        gap: 4px;
+        min-width: 18rem;
+        max-width: 18rem;  
+    }
   }
+
   .motivations {
     display: grid;
     grid-template-columns: repeat(2, 1fr);

templates/protagonist-biography.hbs

@@ -14,6 +14,36 @@
     </div>
   </fieldset>
 
+  <fieldset>
+    <legend>{{localize "CTHULHUETERNAL.Label.distinguishingFeatures"}}</legend>
+    <div class="features">
+      <div class="feature"> 
+        <label>{{localize "CTHULHUETERNAL.Label.strShort"}}</label>
+        {{formInput systemFields.characteristics.fields.str.fields.feature value=system.characteristics.str.feature localize=true}} 
+      </div>
+      <div class="feature"> 
+        <label>{{localize "CTHULHUETERNAL.Label.dexShort"}}</label>
+        {{formInput systemFields.characteristics.fields.dex.fields.feature value=system.characteristics.dex.feature localize=true}} 
+      </div>
+      <div class="feature"> 
+        <label>{{localize "CTHULHUETERNAL.Label.conShort"}}</label>
+        {{formInput systemFields.characteristics.fields.con.fields.feature value=system.characteristics.con.feature localize=true}} 
+      </div>
+      <div class="feature"> 
+        <label>{{localize "CTHULHUETERNAL.Label.intShort"}}</label>
+        {{formInput systemFields.characteristics.fields.int.fields.feature value=system.characteristics.int.feature localize=true}} 
+      </div>
+      <div class="feature"> 
+        <label>{{localize "CTHULHUETERNAL.Label.powShort"}}</label>
+        {{formInput systemFields.characteristics.fields.pow.fields.feature value=system.characteristics.pow.feature localize=true}} 
+      </div>
+      <div class="feature"> 
+        <label>{{localize "CTHULHUETERNAL.Label.chaShort"}}</label>
+        {{formInput systemFields.characteristics.fields.cha.fields.feature value=system.characteristics.cha.feature localize=true}} 
+      </div>
+    </div>
+  </fieldset> 
+
 
   <fieldset>
     <legend>{{localize "CTHULHUETERNAL.Label.description"}}</legend>

templates/protagonist-main.hbs

@@ -78,7 +78,7 @@
     <legend>{{localize "CTHULHUETERNAL.Label.characteristics"}}</legend>
     <div class="protagonist-characteristic" >
       <img src="systems/fvtt-cthulhu-eternal/assets/ui/d100.svg" class="d100" />
-      <label class="rollable" data-roll-type="char" data-char-id="str">{{localize
+      <label class="rollable" data-roll-type="char" data-char-id="str" data-tooltip="{{system.characteristics.str.feature}}">{{localize
         "CTHULHUETERNAL.Label.strShort"}}</label>
       {{formField systemFields.characteristics.fields.str.fields.value value=system.characteristics.str.value
       rootId=partId disabled=isPlayMode }}
@@ -86,7 +86,7 @@
     </div>
     <div class="protagonist-characteristic">
       <img src="systems/fvtt-cthulhu-eternal/assets/ui/d100.svg" class="d100" />
-      <label class="rollable" data-roll-type="char" data-char-id="dex">{{localize
+      <label class="rollable" data-roll-type="char" data-char-id="dex" data-tooltip="{{system.characteristics.dex.feature}}">{{localize
         "CTHULHUETERNAL.Label.dexShort"}}</label>
       {{formField systemFields.characteristics.fields.dex.fields.value value=system.characteristics.dex.value
       rootId=partId disabled=isPlayMode }}
@@ -94,7 +94,7 @@
     </div>
     <div class="protagonist-characteristic" >
       <img src="systems/fvtt-cthulhu-eternal/assets/ui/d100.svg" class="d100" />
-      <label class="rollable" data-roll-type="char" data-char-id="con">{{localize
+      <label class="rollable" data-roll-type="char" data-char-id="con" data-tooltip="{{system.characteristics.con.feature}}">{{localize
         "CTHULHUETERNAL.Label.conShort"}}</label>
       {{formField systemFields.characteristics.fields.con.fields.value value=system.characteristics.con.value
       rootId=partId disabled=isPlayMode }}
@@ -102,7 +102,7 @@
     </div>
     <div class="protagonist-characteristic" >
       <img src="systems/fvtt-cthulhu-eternal/assets/ui/d100.svg" class="d100" />
-      <label class="rollable" data-roll-type="char" data-char-id="int">{{localize
+      <label class="rollable" data-roll-type="char" data-char-id="int" data-tooltip="{{system.characteristics.int.feature}}">{{localize
         "CTHULHUETERNAL.Label.intShort"}}</label>
       {{formField systemFields.characteristics.fields.int.fields.value value=system.characteristics.int.value
       rootId=partId disabled=isPlayMode }}
@@ -110,7 +110,7 @@
     </div>
     <div class="protagonist-characteristic" >
       <img src="systems/fvtt-cthulhu-eternal/assets/ui/d100.svg" class="d100" />
-      <label class="rollable" data-roll-type="char" data-char-id="pow">{{localize
+      <label class="rollable" data-roll-type="char" data-char-id="pow" data-tooltip="{{system.characteristics.pow.feature}}">{{localize
         "CTHULHUETERNAL.Label.powShort"}}</label>
       {{formField systemFields.characteristics.fields.pow.fields.value value=system.characteristics.pow.value
       rootId=partId disabled=isPlayMode }}
@@ -118,7 +118,7 @@
     </div>
     <div class="protagonist-characteristic" >
       <img src="systems/fvtt-cthulhu-eternal/assets/ui/d100.svg" class="d100" />
-      <label class="rollable" data-roll-type="char" data-char-id="cha">{{localize
+      <label class="rollable" data-roll-type="char" data-char-id="cha" data-tooltip="{{system.characteristics.cha.feature}}">{{localize
         "CTHULHUETERNAL.Label.chaShort"}}</label>
       {{formField systemFields.characteristics.fields.cha.fields.value value=system.characteristics.cha.value
       rootId=partId disabled=isPlayMode }}