✨

less/character-sheet.less

@@ -271,6 +271,7 @@
 
     .row {
         display: flex;
+        align-items: center;
     }
 
     .charHex {
@@ -422,6 +423,9 @@
         flex-direction: column;
         align-items: flex-start;
         justify-items: space-evenly;
+        position: absolute;
+        z-index: 100;
+        margin-top: 25px;
     }
 
     .categorySelectBox {
@@ -430,4 +434,8 @@
         align-items: flex-start;
         justify-items: space-evenly;
     }
+
+    .statHex {
+        margin-top: 0px;
+    }
 }

pokemon.css

@@ -226,6 +226,7 @@
 }
 .pokemon.sheet.characterSheet .row {
   display: flex;
+  align-items: center;
 }
 .pokemon.sheet.characterSheet .charHex {
   width: 65px;
@@ -354,6 +355,9 @@
   flex-direction: column;
   align-items: flex-start;
   justify-items: space-evenly;
+  position: absolute;
+  z-index: 100;
+  margin-top: 25px;
 }
 .pokemon.sheet.characterSheet .categorySelectBox {
   display: flex;
@@ -361,3 +365,6 @@
   align-items: flex-start;
   justify-items: space-evenly;
 }
+.pokemon.sheet.characterSheet .statHex {
+  margin-top: 0px;
+}

system.json

@@ -1,5 +1,5 @@
 {
-    "version": "0.0.37",
+    "version": "0.0.38",
     "id": "pokemon",
     "title": "Pokémon TTRPG",
     "description": "A Pokémon TTRPG",

templates/partials/character-sheet-character.hbs

@@ -1,6 +1,6 @@
 <div class="statsBox">
     <div class="row">
-        <div class="charHex"><span class="charHexHead">Attack</span></br><input class="charHexValue invisibleInput" type="number" name="system.stats.attack" value="{{system.stats.attack}}"></div>
+        <div class="charHex statHex"><span class="charHexHead">Attack</span></br><input class="charHexValue invisibleInput" type="number" name="system.stats.attack" value="{{system.stats.attack}}"></div>
         <div class="categorySelectBox">
             <select name="system.attackCategory">
                 <option value=0>Physical</option>
@@ -9,7 +9,7 @@
         </div>
     </div>
     <div class="row">
-        <div class="charHex"><span class="charHexHead">Defense</span></br><input class="charHexValue invisibleInput" type="number" name="system.stats.defense" value="{{system.stats.defense}}"></div>
+        <div class="charHex statHex"><span class="charHexHead">Defense</span></br><input class="charHexValue invisibleInput" type="number" name="system.stats.defense" value="{{system.stats.defense}}"></div>
         <div class="categorySelectBox">
             <select name="system.defenseCategory">
                 <option value=0>Physical</option>
@@ -18,9 +18,9 @@
         </div>
     </div>
     <div class="row">
-        <div class="charHex"><span class="charHexHead">Speed</span></br><input class="charHexValue invisibleInput" type="number" name="system.stats.speed" value="{{system.stats.speed}}"></div>
+        <div class="charHex statHex"><span class="charHexHead">Speed</span></br><input class="charHexValue invisibleInput" type="number" name="system.stats.speed" value="{{system.stats.speed}}"></div>
     </div>
     <div class="row">
-        <div class="charHex"><span class="charHexHead">HP</span></br><input class="charHexValue invisibleInput" type="number" name="system.stats.hp" value="{{system.stats.hp}}"></div>
+        <div class="charHex statHex"><span class="charHexHead">HP</span></br><input class="charHexValue invisibleInput" type="number" name="system.stats.hp" value="{{system.stats.hp}}"></div>
     </div>
 </div>

templates/sheets/character/sidebar.hbs

@@ -17,7 +17,7 @@
         <div class="calcStatBox">
             <div class="hitPointBox">
                 <div class="charHex charHPCurrent"><span class="charHexHead">HP</span></br><input class="charHexValue hpValue invisibleInput" type="number" name="system.hp.current" value="{{system.hp.current}}"></div>
-                <div class="charHex charHPMax"><span class="charHexHead">Max</span></br><input class="charHexValue hpMaxValue invisibleinput" type="number" name="system.hp.max" value="{{system.hp.max}}"></div>
+                <div class="charHex charHPMax"><span class="charHexHead">Max</span></br><input class="charHexValue hpMaxValue invisibleInput" type="number" name="system.hp.max" value="{{system.hp.max}}"></div>
             </div>
             <div class="row">
                 <div class="charHex"><span class="charHexHead">{{localize "POKEMON.System.ArmorClass"}}</span></br><span class="charHexValue">{{system.armorClass}}</span></div>