From fd71ab3fb790a2df0ee695419e74e2a74b6f4e7d Mon Sep 17 00:00:00 2001
From: marvin9257 <72580196+marvin9257@users.noreply.github.com>
Date: Thu, 21 Nov 2024 10:30:14 -0600
Subject: [PATCH] fix: dialog labels should't wrap inputs

---
 src/module/entities/TwodsixActor.ts           |   4 +-
 static/styles/twodsix.css                     |   5 +-
 static/templates/actors/damage-dialog.html    |  96 +++++++-------
 static/templates/chat/initiative-dialog.html  |  29 ++--
 .../templates/chat/request-roll-dialog.html   |  46 +++----
 static/templates/chat/throw-dialog.html       | 124 ++++++++----------
 6 files changed, 138 insertions(+), 166 deletions(-)

diff --git a/src/module/entities/TwodsixActor.ts b/src/module/entities/TwodsixActor.ts
index 742498e2a..4718c3579 100644
--- a/src/module/entities/TwodsixActor.ts
+++ b/src/module/entities/TwodsixActor.ts
@@ -1386,8 +1386,8 @@ async function getMoveNumber(itemData:TwodsixItem): Promise <number> {
       window: {title: "TWODSIX.Actor.Items.QuantityToTransfer"},
       content:
         `<div style="display: flex; align-items: center; gap: 2ch; justify-content: center;"><img src="` + itemData.img + `" data-tooltip = "` + itemData.name +`" width="50" height="50"> ` + itemData.name + `</div>`+
-        `<div><label for='amount'>` + game.i18n.localize("TWODSIX.Actor.Items.Amount") + `<input type="number" name="amount" value="` +
-        itemData.system.quantity + `" max="` + itemData.system.quantity + `" min = "0"></input></label></div>`,
+        `<div><label for='amount'>` + game.i18n.localize("TWODSIX.Actor.Items.Amount") + `</label><input type="number" name="amount" value="` +
+        itemData.system.quantity + `" max="` + itemData.system.quantity + `" min = "0"></input></div>`,
       buttons: [
         {
           action: "Transfer",
diff --git a/static/styles/twodsix.css b/static/styles/twodsix.css
index 824e661ed..73e2603d1 100644
--- a/static/styles/twodsix.css
+++ b/static/styles/twodsix.css
@@ -1834,7 +1834,7 @@ input.item-value-edit, input.joat-skill-input {
   gap: 1px;
 }
 
-select.select-mod {
+/*select.select-mod {
   width: 6em;
   margin-left: 1em;
 }
@@ -1847,7 +1847,7 @@ select.select-difficulty {
 select.select-rolltype {
   width: 10em;
   margin-left: 1em;
-}
+}*/
 
 span.total-output {
   text-align: center;
@@ -4108,6 +4108,7 @@ multi-select.actor-sheet select {
 .standard-form .form-group > label {
   color: var(--s2d6-default-color);
   font-weight: normal;
+  flex: 2 1 0%;
 }
 
 .filepicker .favorites .path a.link[data-source]::before {
diff --git a/static/templates/actors/damage-dialog.html b/static/templates/actors/damage-dialog.html
index 2c091d488..03d3de309 100644
--- a/static/templates/actors/damage-dialog.html
+++ b/static/templates/actors/damage-dialog.html
@@ -1,55 +1,54 @@
 <form>
 <div class="standard-form damage-dialog">
   {{#with stats}}
-  <div class = "form-group">
-    <label>{{localize "TWODSIX.Damage.DamageCalculation"}}
-      <table class="damage-table center-table-text">
-        <thead class="centre">
-          <tr>
-            <th>{{localize "TWODSIX.Damage.Damage"}}</th>
-            {{#unless useCUData}}
-              <th>{{localize "TWODSIX.Items.Armor.PrimaryArmor"}}</th>
-              <th>{{localize "TWODSIX.Items.Armor.SecondaryArmor"}}</th>
+  <div class = "">
+    <label>{{localize "TWODSIX.Damage.DamageCalculation"}} </label>
+    <table class="damage-table center-table-text">
+      <thead class="centre">
+        <tr>
+          <th>{{localize "TWODSIX.Damage.Damage"}}</th>
+          {{#unless useCUData}}
+            <th>{{localize "TWODSIX.Items.Armor.PrimaryArmor"}}</th>
+            <th>{{localize "TWODSIX.Items.Armor.SecondaryArmor"}}</th>
+          {{else}}
+            <th>{{localize "TWODSIX.Items.Armor.Armor"}}</th>
+            {{#if canOnlyBeBlocked}}
+              <th>{{localize "TWODSIX.Items.Weapon.ShieldAV"}}</th>
             {{else}}
-              <th>{{localize "TWODSIX.Items.Armor.Armor"}}</th>
-              {{#if canOnlyBeBlocked}}
-                <th>{{localize "TWODSIX.Items.Weapon.ShieldAV"}}</th>
-              {{else}}
-                <th>{{localize "TWODSIX.Items.Weapon.ParryAV"}}</th>
-              {{/if}}
-            {{/unless}}
-            <th>{{localize "TWODSIX.Actor.Items.EffectiveArmor"}}</th>
-            <th>{{localize "TWODSIX.Damage.TotalDamage"}}</th>
-          </tr>
-        </thead>
-        <tbody>
-          <tr>
-            <td><input type="number" value="{{damageValue}}" class="damage"></td>
-            {{#unless useCUData}}
-              <td><input type="number" value="{{primaryArmor}}" class="armor" readonly></td>
-            {{/unless}}
-            <td><input type="number" value="{{secondaryArmor}}" class="armor" readonly></td>
-            {{#if useCUData}}
-              <td><input type="number" value="{{parryArmor}}" class="armor" readonly></td>
+              <th>{{localize "TWODSIX.Items.Weapon.ParryAV"}}</th>
             {{/if}}
-            <td><input type="number" value="{{effectiveArmor}}" class="armor"></td>
-            <td class="applied-damage"></td>
-          </tr>
-          {{#iff damageLabel "!==" "---"}}
-          <tr>
-            <td>({{localize damageLabel}})</td>
-            <td></td>
-            <td></td>
-            <td></td>
-            <td></td>
-          </tr>
-          {{/iff}}
-        </tbody>
-      </table>
-    </label>
+          {{/unless}}
+          <th>{{localize "TWODSIX.Actor.Items.EffectiveArmor"}}</th>
+          <th>{{localize "TWODSIX.Damage.TotalDamage"}}</th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr>
+          <td><input type="number" value="{{damageValue}}" class="damage"></td>
+          {{#unless useCUData}}
+            <td><input type="number" value="{{primaryArmor}}" class="armor" readonly></td>
+          {{/unless}}
+          <td><input type="number" value="{{secondaryArmor}}" class="armor" readonly></td>
+          {{#if useCUData}}
+            <td><input type="number" value="{{parryArmor}}" class="armor" readonly></td>
+          {{/if}}
+          <td><input type="number" value="{{effectiveArmor}}" class="armor"></td>
+          <td class="applied-damage"></td>
+        </tr>
+        {{#iff damageLabel "!==" "---"}}
+        <tr>
+          <td>({{localize damageLabel}})</td>
+          <td></td>
+          <td></td>
+          <td></td>
+          <td></td>
+        </tr>
+        {{/iff}}
+      </tbody>
+    </table>
   </div>
-  <div class = "form-group">
-    <label>{{localize "TWODSIX.Damage.Characteristics"}}
+  <div class = "">
+    <label>{{localize "TWODSIX.Damage.Characteristics"}}</label>
     <table class="damage center-table-text">
       <thead class="centre">
         <tr>
@@ -115,12 +114,11 @@
         {{/if}}
       </tbody>
     </table>
-    </label>
   </div>
-  <div class = "form-group">
+  <div class = "">
     <span class="unalocated-damage-text">{{localize "TWODSIX.Damage.UnallocatedDamage"}}: <span class="unalocated-damage"></span></span>
   </div>
-  <div class = "form-group">
+  <div class = "">
     <span class="character-dead red">{{localize "TWODSIX.Damage.CharacterIsDead"}}</span>
   </div>
   {{/with}}
diff --git a/static/templates/chat/initiative-dialog.html b/static/templates/chat/initiative-dialog.html
index 1fb69ac22..d253b1278 100644
--- a/static/templates/chat/initiative-dialog.html
+++ b/static/templates/chat/initiative-dialog.html
@@ -3,28 +3,25 @@
   <fieldset>
   <legend>{{localize "TWODSIX.Chat.Roll.RollDetails"}}</legend>
     <div class="form-group">
-      <label>{{localize "TWODSIX.Chat.Roll.Type"}}
-        <select name="rollType">
-          {{selectOptions rollTypes selected=rollType}}
-        </select>
-      </label>
+      <label>{{localize "TWODSIX.Chat.Roll.Type"}}</label>
+      <select name="rollType">
+        {{selectOptions rollTypes selected=rollType}}
+      </select>
     </div>
     <div class="form-group">
-      <label>{{localize "TWODSIX.Chat.Roll.OtherModifiers"}}
-        <input type="number" name="diceModifier" value="{{diceModifier}}" placeholder="0" onClick="this.select();" style="width: 8ch;"/>
-      </label>
+      <label>{{localize "TWODSIX.Chat.Roll.OtherModifiers"}}</label>
+      <input type="number" name="diceModifier" value="{{diceModifier}}" placeholder="0" onClick="this.select();" style="width: 8ch;"/>
+
     </div>
     <div class="form-group">
-      <label>{{localize "TWODSIX.Chat.Roll.Mode"}}
-        <select name="rollMode">
-          {{selectOptions rollModes selected="publicroll" localize=true}}
-        </select>
-      </label>
+      <label>{{localize "TWODSIX.Chat.Roll.Mode"}}</label>
+      <select name="rollMode">
+        {{selectOptions rollModes selected="publicroll" localize=true}}
+      </select>
     </div>
     <div class="form-group">
-      <label>{{localize "TWODSIX.Chat.Roll.RollFormula"}}
-        <input type="text" name="rollFormula" value="{{rollFormula}}" placeholder="" onClick="this.select();" />
-      </label>
+      <label>{{localize "TWODSIX.Chat.Roll.RollFormula"}}</label>
+      <input type="text" name="rollFormula" value="{{rollFormula}}" placeholder="" onClick="this.select();" />
     </div>
   </fieldset>
 </form>
diff --git a/static/templates/chat/request-roll-dialog.html b/static/templates/chat/request-roll-dialog.html
index e3ed95498..15235c873 100644
--- a/static/templates/chat/request-roll-dialog.html
+++ b/static/templates/chat/request-roll-dialog.html
@@ -12,47 +12,41 @@
   <fieldset>
   <legend>{{localize "TWODSIX.Chat.Roll.RollDetails"}}</legend>
     <div class="form-group">
-      <label>{{localize "TWODSIX.Chat.Roll.Difficulty"}}
-        <select name="difficulty">
-          {{selectOptions difficultyList selected=difficulty}}
-        </select>
-      </label>
+      <label>{{localize "TWODSIX.Chat.Roll.Difficulty"}}</label>
+      <select name="difficulty">
+        {{selectOptions difficultyList selected=difficulty}}
+      </select>
     </div>
     <div class="form-group">
-      <label>{{localize "TWODSIX.Chat.Roll.Type"}}
-        <select name="rollType">
-          {{selectOptions rollTypes selected=rollType}}
-        </select>
-      </label>
+      <label>{{localize "TWODSIX.Chat.Roll.Type"}}</label>
+      <select name="rollType">
+        {{selectOptions rollTypes selected=rollType}}
+      </select>
     </div>
     <div class="form-group">
-      <label>{{localize "TWODSIX.Chat.Roll.Mode"}}
-        <select name="rollMode">
-          {{selectOptions rollModes selected=rollMode localize=true}}
-        </select>
-      </label>
+      <label>{{localize "TWODSIX.Chat.Roll.Mode"}}</label>
+      <select name="rollMode">
+        {{selectOptions rollModes selected=rollMode localize=true}}
+      </select>
     </div>
   </fieldset>
   <fieldset>
     <legend>{{localize "TWODSIX.Chat.Roll.RollModifiers"}}</legend>
     <div class="form-group">
-      <label>{{localize "TWODSIX.Actor.Skills.SkillName"}}
-        <select class="select-skill" name="selectedSkill">
+      <label>{{localize "TWODSIX.Actor.Skills.SkillName"}}</label>
+      <select class="select-skill" name="selectedSkill">
         {{selectOptions skillsList selected=initialSkill}}
-        </select>
-      </label>
+      </select>
     </div>
     <div class="form-group">
-      <label>{{localize "TWODSIX.Chat.Roll.CharacteristicModifier"}}
-        <select class="select-mod" name="characteristic">
+      <label>{{localize "TWODSIX.Chat.Roll.CharacteristicModifier"}}</label>
+      <select class="select-mod" name="characteristic">
         {{selectOptions characteristicList selected=initialChoice}}
-        </select>
-      </label>
+      </select>
     </div>
     <div class="form-group">
-      <label>{{localize "TWODSIX.Chat.Roll.OtherModifiers"}}
-        <input type="number" name="other" value="{{other}}" placeholder="0" onClick="this.select();" style="width: 8ch;"/>
-      </label>
+      <label>{{localize "TWODSIX.Chat.Roll.OtherModifiers"}}</label>
+      <input type="number" name="other" value="{{other}}" placeholder="0" onClick="this.select();" style="width: 8ch;"/>
     </div>
   </fieldset>
 </div>
diff --git a/static/templates/chat/throw-dialog.html b/static/templates/chat/throw-dialog.html
index 4a0c35276..20ec6cd28 100644
--- a/static/templates/chat/throw-dialog.html
+++ b/static/templates/chat/throw-dialog.html
@@ -2,115 +2,101 @@
   <fieldset>
   <legend>{{localize "TWODSIX.Chat.Roll.RollDetails"}}</legend>
     <div class="form-group">
-      <label>{{localize "TWODSIX.Chat.Roll.Difficulty"}}
-        <select name="difficulty">
-          {{selectOptions difficultyList selected=difficulty}}
-        </select>
-      </label>
+      <label>{{localize "TWODSIX.Chat.Roll.Difficulty"}}</label>
+      <select name="difficulty">
+        {{selectOptions difficultyList selected=difficulty}}
+      </select>
     </div>
     <div class="form-group">
-      <label>{{localize "TWODSIX.Chat.Roll.Type"}}
-        <select name="rollType">
-          {{selectOptions rollTypes selected=rollType}}
-        </select>
-      </label>
+      <label>{{localize "TWODSIX.Chat.Roll.Type"}}</label>
+      <select name="rollType">
+        {{selectOptions rollTypes selected=rollType}}
+      </select>
     </div>
     <div class="form-group">
-      <label>{{localize "TWODSIX.Chat.Roll.Mode"}}
-        <select name="rollMode">
-          {{selectOptions rollModes selected=rollMode localize=true}}
-        </select>
-      </label>
+      <label>{{localize "TWODSIX.Chat.Roll.Mode"}}</label>
+      <select name="rollMode">
+        {{selectOptions rollModes selected=rollMode localize=true}}
+      </select>
     </div>
   </fieldset>
   <fieldset>
     <legend>{{localize "TWODSIX.Chat.Roll.RollModifiers"}}</legend>
       {{#if skillRoll}}
       <div class="form-group">
-        <label>{{localize "TWODSIX.Actor.Skills.SkillName"}} ({{localize "TWODSIX.Items.Skills.Level"}})
-          <select class="select-skill" name="rollModifiers.selectedSkill" value={{rollModifiers.selectedSkill}}>
+        <label>{{localize "TWODSIX.Actor.Skills.SkillName"}} ({{localize "TWODSIX.Items.Skills.Level"}})</label>
+        <select class="select-skill" name="rollModifiers.selectedSkill" value={{rollModifiers.selectedSkill}}>
           {{selectOptions skillsList selected=initialSkill}}
-          </select>
-        </label>
+        </select>
       </div>
       <div class="form-group">
-        <label>{{localize "TWODSIX.Chat.Roll.Chain"}}
-          <input type="number" name="rollModifiers.chain" value="{{rollModifiers.chain}}" placeholder="0" onClick="this.select();" style="width: 8ch;"/>
-        </label>
+        <label>{{localize "TWODSIX.Chat.Roll.Chain"}}</label>
+          <input type="number" name="rollModifiers.chain" value="{{rollModifiers.chain}}" placeholder="0" onClick="this.select();"/>
+
       </div>
       <div class="form-group">
-        <label>{{localize "TWODSIX.Chat.Roll.CharacteristicModifier"}}
-          <select class="select-mod" name="rollModifiers.characteristic" value={{rollModifiers.characteristic}}>
+        <label>{{localize "TWODSIX.Chat.Roll.CharacteristicModifier"}}</label>
+        <select class="select-mod" name="rollModifiers.characteristic" value={{rollModifiers.characteristic}}>
           {{selectOptions characteristicList selected=initialChoice}}
-          </select>
-        </label>
+        </select>
       </div>
       {{/if}}
       {{#if itemRoll}}
         <div class="form-group">
-          <label>{{#if isPsionicAbility}}{{localize "TWODSIX.Items.Psionics.Level"}}{{else}}{{localize "TWODSIX.Chat.Roll.ItemModifier"}}{{/if}}
-            <input type="number" name="rollModifiers.item" value="{{rollModifiers.item}}" placeholder="0" onClick="this.select();" style="width: 8ch;"/>
-            ({{itemLabel}})
-          </label>
+          <label>{{#if isPsionicAbility}}{{localize "TWODSIX.Items.Psionics.Level"}}{{else}}{{localize "TWODSIX.Chat.Roll.ItemModifier"}}{{/if}}</label>
+          <input type="number" name="rollModifiers.item" value="{{rollModifiers.item}}" placeholder="0" onClick="this.select();" />
+          ({{itemLabel}})
         </div>
         {{#iff rollModifiers.rof "!==" 0}}
           <div class="form-group">
-            <label>{{localize "TWODSIX.Chat.Roll.Rof"}}
-              <input type="number" name="rollModifiers.rof" value="{{rollModifiers.rof}}" placeholder="0" onClick="this.select();" style="width: 8ch;"/>
-            </label>
+            <label>{{localize "TWODSIX.Chat.Roll.Rof"}}</label>
+            <input type="number" name="rollModifiers.rof" value="{{rollModifiers.rof}}" placeholder="0" onClick="this.select();" />
           </div>
         {{/iff}}
         {{#iff rollModifiers.attachments "!==" 0}}
           <div class="form-group">
-            <label>{{localize "TWODSIX.Chat.Roll.Attachments"}}
-              <input type="number" name="rollModifiers.attachments" value="{{rollModifiers.attachments}}" placeholder="0" onClick="this.select();" style="width: 8ch;"/>
-            </label>
+            <label>{{localize "TWODSIX.Chat.Roll.Attachments"}}</label>
+              <input type="number" name="rollModifiers.attachments" value="{{rollModifiers.attachments}}" placeholder="0" onClick="this.select();" />
           </div>
         {{/iff}}
         {{#iff rollModifiers.dodgeParry "!==" 0}}
           <div class="form-group">
-            <label>{{localize "TWODSIX.Chat.Roll.DodgeParry"}}
-              <input type="number" name="rollModifiers.dodgeParry" value="{{rollModifiers.dodgeParry}}" placeholder="0" onClick="this.select();" style="width: 8ch;"/>
-              ({{rollModifiers.dodgeParryLabel}})
-            </label>
+            <label>{{localize "TWODSIX.Chat.Roll.DodgeParry"}}</label>
+            <input type="number" name="rollModifiers.dodgeParry" value="{{rollModifiers.dodgeParry}}" placeholder="0" onClick="this.select();" />
+            ({{rollModifiers.dodgeParryLabel}})
           </div>
         {{/iff}}
         {{#iff rollModifiers.weaponsHandling "!==" 0}}
           <div class="form-group">
-            <label>{{localize "TWODSIX.Chat.Roll.WeaponsHandling"}}
-              <input type="number" name="rollModifiers.weaponsHandling" value="{{rollModifiers.weaponsHandling}}" placeholder="0" onClick="this.select();" style="width: 8ch;"/>
-              ({{itemLabel}})
-            </label>
+            <label>{{localize "TWODSIX.Chat.Roll.WeaponsHandling"}}</label>
+            <input type="number" name="rollModifiers.weaponsHandling" value="{{rollModifiers.weaponsHandling}}" placeholder="0" onClick="this.select();" />
+            ({{itemLabel}})
           </div>
         {{/iff}}
         {{#if showRangeModifier}}
           <div class="form-group">
-            <label>{{localize "TWODSIX.Chat.Roll.WeaponsRange"}}
-              <input type="number" name="rollModifiers.weaponsRange" value="{{rollModifiers.weaponsRange}}" placeholder="0" onClick="this.select();" style="width: 8ch;"/>
-              ({{rollModifiers.rangeLabel}})
-            </label>
+            <label>{{localize "TWODSIX.Chat.Roll.WeaponsRange"}}</label>
+            <input type="number" name="rollModifiers.weaponsRange" value="{{rollModifiers.weaponsRange}}" placeholder="0" onClick="this.select();" />
+            ({{rollModifiers.rangeLabel}})
           </div>
         {{/if}}
         {{#if showArmorWeaponModifier}}
           <div class="form-group">
-            <label>{{localize "TWODSIX.Chat.Roll.ArmorModifier"}}
-              <input type="number" name="rollModifiers.armorModifier" value="{{rollModifiers.armorModifier}}" placeholder="0" onClick="this.select();" style="width: 8ch;"/>
-              ({{rollModifiers.armorLabel}})
-            </label>
+            <label>{{localize "TWODSIX.Chat.Roll.ArmorModifier"}}</label>
+            <input type="number" name="rollModifiers.armorModifier" value="{{rollModifiers.armorModifier}}" placeholder="0" onClick="this.select();" />
+            ({{rollModifiers.armorLabel}})
           </div>
         {{/if}}
         {{#if showTargetModifier}}
           <div class="form-group">
-            <label>{{#if rollModifiers.targetModifierOverride}}{{localize "TWODSIX.Chat.Roll.OverrideAuto"}} {{/if}}{{localize "TWODSIX.Chat.Roll.TargetModifier"}}
+            <label>{{#if rollModifiers.targetModifierOverride}}{{localize "TWODSIX.Chat.Roll.OverrideAuto"}} {{/if}}{{localize "TWODSIX.Chat.Roll.TargetModifier"}}</label>
             <multi-select class="select target-modifier" name="rollModifiers.targetModifier">{{selectOptions targetDMList selected=targetModifier}}</multi-select>
-            </label>
           </div>
         {{/if}}
       {{/if}}
       <div class="form-group">
-        <label>{{localize "TWODSIX.Chat.Roll.Other"}}
-          <input type="number" name="rollModifiers.other" value="{{rollModifiers.other}}" placeholder="0" onClick="this.select();" style="width: 8ch;"/>
-        </label>
+        <label>{{localize "TWODSIX.Chat.Roll.Other"}}</label>
+        <input type="number" name="rollModifiers.other" value="{{rollModifiers.other}}" placeholder="0" onClick="this.select();" />
       </div>
   </fieldset>
   {{#if showConditions}}
@@ -118,16 +104,14 @@
       <legend>{{localize "TWODSIX.Chat.Roll.Conditions"}}</legend>
         {{#if showWounds}}
           <div class="form-group">
-            <label>{{localize "TWODSIX.Chat.Roll.Wounds"}}
-              <input type="number" name="rollModifiers.wounds" value="{{rollModifiers.wounds}}" placeholder="0" onClick="this.select();" style="width: 8ch;"/>
-            </label>
+            <label>{{localize "TWODSIX.Chat.Roll.Wounds"}}</label>
+            <input type="number" name="rollModifiers.wounds" value="{{rollModifiers.wounds}}" placeholder="0" onClick="this.select();" />
           </div>
         {{/if}}
         {{#if showEncumbered}}
           <div class="form-group">
-            <label>{{localize "TWODSIX.Chat.Roll.Encumbered"}}
-              <input type="number" name="rollModifiers.encumbered" value="{{rollModifiers.encumbered}}" placeholder="0" onClick="this.select();" style="width: 8ch;"/>
-            </label>
+            <label>{{localize "TWODSIX.Chat.Roll.Encumbered"}}</label>
+            <input type="number" name="rollModifiers.encumbered" value="{{rollModifiers.encumbered}}" placeholder="0" onClick="this.select();" />
           </div>
         {{/if}}
     </fieldset>
@@ -136,14 +120,12 @@
     <fieldset>
       <legend>{{localize "TWODSIX.Chat.Roll.Timeframe"}}</legend>
       <div class="form-group">
-        <label>{{localize "TWODSIX.Chat.Roll.RollFormula"}}
-          <input type="text" name="timeRollFormula" value="{{timeRollFormula}}" placeholder="1d6" onClick="this.select();"/>
-        </label>
-        <label>{{localize "TWODSIX.Chat.Roll.Units"}}
-          <select class="select-timeUnits" name="timeUnit" value={{selectedTimeUnit}}>
-            {{selectOptions timeUnits selected=selectedTimeUnit localize=true}}
-          </select>
-        </label>
+        <label>{{localize "TWODSIX.Chat.Roll.RollFormula"}} </label>
+        <input type="text" name="timeRollFormula" value="{{timeRollFormula}}" placeholder="1d6" onClick="this.select();"/>
+        <label>{{localize "TWODSIX.Chat.Roll.Units"}}</label>
+        <select class="select-timeUnits" name="timeUnit" value={{selectedTimeUnit}}>
+          {{selectOptions timeUnits selected=selectedTimeUnit localize=true}}
+        </select>
       </div>
     </fieldset>
   {{/if}}