fix: Item page fixed and styled, Info page broken

jonepatr · Aug 22, 2020 · 13d2aa2 · 13d2aa2
1 parent 89d85d4
commit 13d2aa2
Show file tree

Hide file tree

Showing 4 changed files with 106 additions and 45 deletions.
diff --git a/static/styles/twodsix.css b/static/styles/twodsix.css
diff --git a/static/templates/actors/actor-sheet.html b/static/templates/actors/actor-sheet.html
@@ -15,55 +15,55 @@
 
       <div class="character-characteristics">
         <div class="stat str">
-          <span class="stat-name rollable" data-roll="2d6+{{data.characteristics.strength.mod}}">STR <img src="./systems/twodsix/assets/d6-icon.svg" alt="roll attribute"/></span>
+          <span class="stat-name rollable" data-roll="2d6+{{data.characteristics.strength.mod}}">STR <img class="rollable" src="./systems/twodsix/assets/d6-icon.svg" alt="roll attribute"/></span>
           <span class="stat-ability"><input type="number" min="0" name="data.characteristics.strength.value" data-label="data.characteristics.strength.value" value="{{data.characteristics.strength.value}}" placeholder="0"
                                             data-dtype="Number" onClick="this.select();"/></span>
           <span class="stat-modifier"><input readonly type="text" value="{{numberFormat data.characteristics.strength.mod decimals=0 sign=true}}"/></span>
           <span class="stat-damage"><input type="number" max="{{data.characteristics.strength.value}}" min="0" name="data.characteristics.strength.damage" value="{{data.characteristics.strength.damage}}" placeholder="0" data-dtype="Number"
                                            onClick="this.select();"/></span>
         </div>
         <div class="stat dex">
-          <span class="stat-name rollable" data-roll="2d6+{{data.characteristics.dexterity.mod}}">DEX <img src="./systems/twodsix/assets/d6-icon.svg" alt="roll attribute"/></span>
+          <span class="stat-name rollable" data-roll="2d6+{{data.characteristics.dexterity.mod}}">DEX <img class="rollable" src="./systems/twodsix/assets/d6-icon.svg" alt="roll attribute"/></span>
           <span class="stat-ability"><input type="number" min="0" name="data.characteristics.dexterity.value" data-label="data.characteristics.dexterity.value" value="{{data.characteristics.dexterity.value}}" placeholder="0"
                                             data-dtype="Number" onClick="this.select();"/></span>
           <span class="stat-modifier"><input readonly type="text" value="{{numberFormat data.characteristics.dexterity.mod decimals=0 sign=true}}"/></span>
           <span class="stat-damage"><input type="number" max="{{data.characteristics.dexterity.value}}" min="0" name="data.characteristics.dexterity.damage" value="{{data.characteristics.dexterity.damage}}" placeholder="0"
                                            data-dtype="Number" onClick="this.select();"/></span>
         </div>
         <div class="stat end">
-          <span class="stat-name rollable" data-roll="2d6+{{data.characteristics.endurance.mod}}">END <img src="./systems/twodsix/assets/d6-icon.svg" alt="roll attribute"/></span>
+          <span class="stat-name rollable" data-roll="2d6+{{data.characteristics.endurance.mod}}">END <img class="rollable" src="./systems/twodsix/assets/d6-icon.svg" alt="roll attribute"/></span>
           <span class="stat-ability"><input type="number" min="0" name="data.characteristics.endurance.value" data-label="data.characteristics.endurance.value" value="{{data.characteristics.endurance.value}}" placeholder="0"
                                             data-dtype="Number" onClick="this.select();"/></span>
           <span class="stat-modifier"><input readonly type="text" value="{{numberFormat data.characteristics.endurance.mod decimals=0 sign=true}}"/></span>
           <span class="stat-damage"><input type="number" max="{{data.characteristics.endurance.value}}" min="0" name="data.characteristics.endurance.damage" value="{{data.characteristics.endurance.damage}}" placeholder="0"
                                            data-dtype="Number" onClick="this.select();"/></span>
         </div>
         <div class="stat int">
-          <span class="stat-name rollable" data-roll="2d6+{{data.characteristics.intellect.mod}}">INT <img src="./systems/twodsix/assets/d6-icon.svg" alt="roll attribute"/></span>
+          <span class="stat-name rollable" data-roll="2d6+{{data.characteristics.intellect.mod}}">INT <img class="rollable" src="./systems/twodsix/assets/d6-icon.svg" alt="roll attribute"/></span>
           <span class="stat-ability"><input type="number" min="0" name="data.characteristics.intellect.value" data-label="data.characteristics.intellect.value" value="{{data.characteristics.intellect.value}}" placeholder="0"
                                             data-dtype="Number" onClick="this.select();"/></span>
           <span class="stat-modifier"><input readonly type="text" value="{{numberFormat data.characteristics.intellect.mod decimals=0 sign=true}}"/></span>
           <span class="stat-damage"><input type="number" max="{{data.characteristics.intellect.value}}" min="0" name="data.characteristics.intellect.damage" value="{{data.characteristics.intellect.damage}}" placeholder="0"
                                            data-dtype="Number" onClick="this.select();"/></span>
         </div>
         <div class="stat edu">
-          <span class="stat-name rollable" data-roll="2d6+{{data.characteristics.education.mod}}">EDU <img src="./systems/twodsix/assets/d6-icon.svg" alt="roll attribute"/></span>
+          <span class="stat-name rollable" data-roll="2d6+{{data.characteristics.education.mod}}">EDU <img class="rollable" src="./systems/twodsix/assets/d6-icon.svg" alt="roll attribute"/></span>
           <span class="stat-ability"><input type="number" min="0" name="data.characteristics.education.value" data-label="data.characteristics.education.value" value="{{data.characteristics.education.value}}" placeholder="0"
                                             data-dtype="Number" onClick="this.select();"/></span>
           <span class="stat-modifier"><input readonly type="text" value="{{numberFormat data.characteristics.education.mod decimals=0 sign=true}}"/></span>
           <span class="stat-damage"><input type="number" max="{{data.characteristics.education.value}}" min="0" name="data.characteristics.education.damage" value="{{data.characteristics.education.damage}}" placeholder="0"
                                            data-dtype="Number" onClick="this.select();"/></span>
         </div>
         <div class="stat soc">
-          <span class="stat-name rollable" data-roll="2d6+{{data.characteristics.social.mod}}">SOC <img src="./systems/twodsix/assets/d6-icon.svg" alt="roll attribute"/></span>
+          <span class="stat-name rollable" data-roll="2d6+{{data.characteristics.social.mod}}">SOC <img class="rollable" src="./systems/twodsix/assets/d6-icon.svg" alt="roll attribute"/></span>
           <span class="stat-ability"><input type="number" min="0" name="data.characteristics.social.value" data-label="data.characteristics.social.value" value="{{data.characteristics.social.value}}" placeholder="0" data-dtype="Number"
                                             onClick="this.select();"/></span>
           <span class="stat-modifier"><input readonly type="text" value="{{numberFormat data.characteristics.social.mod decimals=0 sign=true}}"/></span>
           <span class="stat-damage"><input type="number" max="{{data.characteristics.social.value}}" min="0" name="data.characteristics.social.damage" value="{{data.characteristics.social.damage}}" placeholder="0" data-dtype="Number"
                                            onClick="this.select();"/></span>
         </div>
         <div class="special psi">
-          <span class="special-name rollable" data-roll="2d6+{{data.characteristics.psionics.mod}}">PSI <img src="./systems/twodsix/assets/d6-icon.svg" alt="roll attribute"/></span>
+          <span class="special-name rollable" data-roll="2d6+{{data.characteristics.psionics.mod}}">PSI <img class="rollable" src="./systems/twodsix/assets/d6-icon.svg" alt="roll attribute"/></span>
           <span class="special-ability"><input type="number" min="0" name="data.characteristics.psionics.value" data-label="data.characteristics.psionics.value" value="{{data.characteristics.psionics.value}}" placeholder="0"
                                                data-dtype="Number" onClick="this.select();"/></span>
           <span class="special-damage"><input type="number" max="{{data.characteristics.psionics.value}}" min="0" name="data.characteristics.psionics.damage" value="{{data.characteristics.psionics.damage}}" placeholder="0"

diff --git a/static/templates/actors/parts/actor-info.html b/static/templates/actors/parts/actor-info.html
@@ -1,27 +1,22 @@
-<div class="grid-container">
-  <div class="description">
+<div class="info-container">
+  <div class="char-description">
     Description:
     {{{editor content=data.description target="data.description" button=true owner=owner editable=editable}}}
   </div>
-
-  <div class="bio">
+  <div class="char-bio">
     Bio:
     {{{editor content=data.bio target="data.bio" button=true owner=owner editable=editable}}}
   </div>
-
-  <div class="contacts">
+  <div class="char-contacts">
     Contacts:
     {{{editor content=data.contacts target="data.contacts" button=true owner=owner editable=editable}}}
-
   </div>
-  <div class="allies">
+  <div class="char-allies">
     Allies:
     {{{editor content=data.allies target="data.allies" button=true owner=owner editable=editable}}}
-
   </div>
-  <div class="enemies">
+  <div class="char-enemies">
     Enemies:
     {{{editor content=data.enemies target="data.enemies" button=true owner=owner editable=editable}}}
-
   </div>
-</div>
+</div>
diff --git a/static/templates/actors/parts/actor-items.html b/static/templates/actors/parts/actor-items.html
@@ -11,20 +11,20 @@
 
 
 {{#each actor.gear as |item id|}}
-<div class="item">
+<div class="item item-list">
   <ol class="ol-no-indent">
     <li class="item flexrow" data-item-id="{{item._id}}">
-      <div class="item-container">
-        <h4 class="item-name">{{item.name}}</h4>
-        <h4 class="item-name centre">{{data.techLevel}}</h4>
-        <h4 class="item-name centre">{{data.quantity}}</h4>
-        <h4 class="item-name centre">{{data.weight}}</h4>
-        <h4 class="item-type centre">{{item.type}}</h4>
-        <div class="item-controls centre">
+      <span class="item-container">
+        <span class="item-name">{{item.name}}</span>
+        <span class="item-name centre">{{data.techLevel}}</span>
+        <span class="item-name centre">{{data.quantity}}</span>
+        <span class="item-name centre">{{data.weight}}</span>
+        <span class="item-type centre">{{item.type}}</span>
+        <span class="item-controls centre">
           <a class="item-control item-edit" title="Edit Item"><i class="fas fa-edit"></i></a>
           <a class="item-control item-delete" title="Delete Item"><i class="fas fa-trash"></i></a>
-        </div>
-      </div>
+        </span>
+      </span>
     </li>
   </ol>
 </div>