Port Admin to LabeledValue

23 files changed, 311 insertions, 935 deletions

diff --git a/share/html/Admin/Actions/Elements/EditBasics b/share/html/Admin/Actions/Elements/EditBasics
index 1f214fdf99..60eb32d3d8 100644
--- a/share/html/Admin/Actions/Elements/EditBasics
+++ b/share/html/Admin/Actions/Elements/EditBasics
@@ -45,42 +45,18 @@
 %# those contributions and any derivatives thereof.
 %#
 %# END BPS TAGGED BLOCK }}}
-<div class="form-row">
-  <div class="label col-3">
-    <&|/l&>Name</&>:
-  </div>
-  <div class="value col-9">
+<&| /Elements/LabeledValue, Label => loc("Name") &>
     <input type="text" class="form-control" name="Name" size="60" value="<% $ARGS{"Name"} || $Action->Name || '' %>" />
-  </div>
-</div>
-
-<div class="form-row">
-  <div class="label col-3">
-    <&|/l&>Description</&>:
-  </div>
-  <div class="value col-9">
+</&>
+<&| /Elements/LabeledValue, Label => loc("Description") &>
     <input type="text" class="form-control" name="Description" size="60" value="<% $ARGS{"Description"} || $Action->Description || '' %>" />
-  </div>
-</div>
-
-<div class="form-row">
-  <div class="label col-3">
-    <&|/l&>Action Module</&>:
-  </div>
-  <div class="value col-9">
+</&>
+<&| /Elements/LabeledValue, Label => loc("Action Module") &>
     <input type="text" class="form-control" name="ExecModule" size="60" value="<% $ARGS{"ExecModule"} || $Action->ExecModule || ''%>" />
-  </div>
-</div>
-
-<div class="form-row">
-  <div class="label col-3">
-    <&|/l&>Parameters to Pass</&>:
-  </div>
-  <div class="value col-9">
+</&>
+<&| /Elements/LabeledValue, Label => loc("Parameters to Pass") &>
     <input type="text" class="form-control" name="Argument" size="60" value="<% $ARGS{"Argument"} || $Action->Argument || '' %>"/>
-  </div>
-</div>
-
+</&>
 <%ARGS>
 $Action
 </%ARGS>
diff --git a/share/html/Admin/Actions/Elements/ShowBasics b/share/html/Admin/Actions/Elements/ShowBasics
index b22136e6cd..75bbf76607 100644
--- a/share/html/Admin/Actions/Elements/ShowBasics
+++ b/share/html/Admin/Actions/Elements/ShowBasics
@@ -45,41 +45,18 @@
 %# those contributions and any derivatives thereof.
 %#
 %# END BPS TAGGED BLOCK }}}
-<div class="form-row">
-  <div class="label col-3">
-    <&|/l&>Name</&>:
-  </div>
-  <div class="value col-9">
+<&| /Elements/LabeledValue, Label => loc("Name") &>
     <span class="current-value"><% $ARGS{"Name"} || $Action->Name || '' %></span>
-  </div>
-</div>
-
-<div class="form-row">
-  <div class="label col-3">
-    <&|/l&>Description</&>:
-  </div>
-  <div class="value col-9">
+</&>
+<&| /Elements/LabeledValue, Label => loc("Description") &>
     <span class="current-value"><% $ARGS{"Description"} || $Action->Description || '' %></span>
-  </div>
-</div>
-
-<div class="form-row">
-  <div class="label col-3">
-    <&|/l&>Action Module</&>:
-  </div>
-  <div class="value col-9">
+</&>
+<&| /Elements/LabeledValue, Label => loc("Action Module") &>
     <span class="current-value"><% $ARGS{"ExecModule"} || $Action->ExecModule || ''%></span>
-  </div>
-</div>
-
-<div class="form-row">
-  <div class="label col-3">
-    <&|/l&>Parameters to Pass</&>:
-  </div>
-  <div class="value col-9">
+</&>
+<&| /Elements/LabeledValue, Label => loc("Parameters to Pass") &>
     <span class="current-value"><% $ARGS{"Argument"} || $Action->Argument || '' %></span>
-  </div>
-</div>
+</&>
 
 <%ARGS>
 $Action
diff --git a/share/html/Admin/Articles/Classes/Modify.html b/share/html/Admin/Articles/Classes/Modify.html
index 73cffd8645..ff0de8a58a 100644
--- a/share/html/Admin/Articles/Classes/Modify.html
+++ b/share/html/Admin/Articles/Classes/Modify.html
@@ -59,34 +59,20 @@
 
 <&| /Widgets/TitleBox, class => 'article-class-info-basics', content_class => 'mx-auto width-sm' &>
 
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Class Name</&>:
-    </div>
-    <div class="value col-9">
+  <&| /Elements/LabeledValue, Label => loc("Class Name") &>
       <input type="text" class="form-control" name="Name" value="<% $ClassObj->Name || $Name || ''%>" />
-    </div>
-  </div>
+   </&>
 
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Description</&>:
-    </div>
-    <div class="value col-9">
+  <&| /Elements/LabeledValue, Label => loc("Description") &>
       <input type="text" class="form-control" name="Description" value="<% $ClassObj->Description || $Description || '' %>" size=60 />
-    </div>
-  </div>
+  </&>
 
-  <div class="form-row">
-    <div class="label col-3">
-    </div>
-    <div class="value col-9">
+  <&| /Elements/LabeledValue, Label => "" &>
       <div class="custom-control custom-checkbox">
         <input type="checkbox" class="custom-control-input checkbox" id="Enabled" name="Enabled" value="1" <%$EnabledChecked%>>
         <label class="custom-control-label" for="Enabled"><&|/l&>Enabled (Unchecking this box disables this class)</&></label>
       </div>
-    </div>
-  </div>
+  </&>
 
   <div class="form-row">
     <div class="col-12">
@@ -94,10 +80,7 @@
     </div>
   </div>
 
-  <div class="form-row">
-    <div class="label col-3">
-    </div>
-    <div class="value col-9">
+  <&| /Elements/LabeledValue, Label => "" &>
       <div class="custom-control custom-checkbox">
         <input type="checkbox" class="custom-control-input checkbox" id="Include-LinkToTicket" name="Include-LinkToTicket" value="1" <% $include{LinkToTicket} %>
 % if ( !RT->Config->Get('LinkArticlesOnInclude') ) {
@@ -106,50 +89,34 @@
 >
         <label class="custom-control-label" for="Include-LinkToTicket"><&|/l&>Link article to ticket</&></label>
       </div>
-    </div>
-  </div>
+  </&>
 
-  <div class="form-row">
-    <div class="label col-3">
-    </div>
-    <div class="value col-9">
+  <&| /Elements/LabeledValue, Label => "" &>
       <div class="custom-control custom-checkbox">
         <input type="checkbox" class="custom-control-input checkbox" id="Include-Name" name="Include-Name" value="1" <% $include{Name} %>>
         <label class="custom-control-label" for="Include-Name"><&|/l&>Include article name</&></label>
       </div>
-    </div>
-  </div>
+  </&>
 
-  <div class="form-row">
-    <div class="label col-3">
-    </div>
-    <div class="value col-9">
+  <&| /Elements/LabeledValue, Label => "" &>
       <div class="custom-control custom-checkbox">
         <input type="checkbox" class="custom-control-input checkbox" id="Include-Summary" name="Include-Summary" value="1" <% $include{Summary} %>>
         <label class="custom-control-label" for="Include-Summary"><&|/l&>Include article summary</&></label>
       </div>
-    </div>
-  </div>
+  </&>
 
-  <div class="form-row">
-    <div class="label col-3">
-    </div>
-    <div class="value col-9">
+  <&| /Elements/LabeledValue, Label => "" &>
       <div class="custom-control custom-checkbox">
         <input type="checkbox" class="custom-control-input checkbox" id="Include-EscapeHTML" name="Include-EscapeHTML" value="1" <% $include{EscapeHTML} %>>
         <label class="custom-control-label" for="Include-EscapeHTML"><&|/l&>Escape HTML (Unchecking this box is potentially unsafe)</&></label>
       </div>
-    </div>
-  </div>
+  </&>
 
 % if ( $cfs ) {
   <h5 class="mt-3"><&|/l&>Include custom field:</&></h5>
 % while (my $cf = $cfs->Next) {
-  <div class="form-row">
-    <div class="label col-3 pt-0">
-      <% $cf->Name %>:
-    </div>
-    <div class="value col-9">
+
+  <&| /Elements/LabeledValue, Label => $cf->Name &>
       <div class="form-row">
         <div class="col-auto">
           <div class="custom-control custom-checkbox">
@@ -164,8 +131,7 @@
           </div>
         </div>
       </div>
-    </div>
-  </div>
+    </&>
 % } }
 
 % if ( @$subject_cfs ) {
@@ -186,17 +152,10 @@
 <h5 class="mt-3"><&|/l&>Class Custom Fields:</&></h5>
 % }
 % while (my $CF = $CFs->Next) {
-  <div class="form-row">
-    <div class="label col-3">
-      <span class="<% $CF->EntryHint ? 'prev-icon-helper' : '' %>"><% $CF->Name %>:</span>\
-% if ( $CF->EntryHint ) {
-<span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<% $CF->EntryHint %>"></span>
-% }
-    </div>
-    <div class="value col-9">
-      <& /Elements/EditCustomField, CustomField => $CF, Object => $ClassObj, &>
-    </div>
-  </div>
+  <&| /Elements/LabeledValue, Label => $CF->Name, LabelSpanClass => ($CF->EntryHint ? 'prev-icon-helper' : '' ),
+  LabelTooltip =>  $CF->EntryHint &>
+    <& /Elements/EditCustomField, CustomField => $CF, Object => $ClassObj, &>
+  </&>
 % }
 
 %$m->callback( CallbackName => 'BeforeSubmit', CustomFields => $cfs, ClassObj => $ClassObj );
diff --git a/share/html/Admin/Articles/Elements/Topics b/share/html/Admin/Articles/Elements/Topics
index 3e27d7267a..aab1b41066 100644
--- a/share/html/Admin/Articles/Elements/Topics
+++ b/share/html/Admin/Articles/Elements/Topics
@@ -51,22 +51,13 @@
 <input type="hidden" name="id" value="<%$RootObj->Id%>" />
 
 % if (!$Modify) {
-<div class="form-row">
-  <div class="label col-3">
-    <&|/l&>Topic Name</&>
-  </div>
-  <div class="value col-9">
+<&| /Elements/LabeledValue, Label => loc("Topic Name") &>
     <input class="form-control" type="text" name="Name" size="30" />
-  </div>
-</div>
-<div class="form-row">
-  <div class="label col-3">
-    <&|/l&>Description</&>
-  </div>
-  <div class="value col-9">
+</&>
+
+<&| /Elements/LabeledValue, Label => loc("Description") &>
     <input class="form-control" type="text" name="Description" size="50" />
-  </div>
-</div>
+</&>
 % } else {
 <a href="Topics.html">New topic</a>
 % }
@@ -77,25 +68,17 @@
 
 <%def .edit>
 &nbsp;
-<div class="form-row">
-  <div class="label col-3">
-    Topic Name:
-  </div>
-  <div class="value col-9 input-group">
+<&| /Elements/LabeledValue, Label => loc("Topic Name"), ValueSpanClass => 'input-group' &>
+
+
       <input class="form-control" type="text" name="Topic-<%$topic->Id%>-Name" size="20" value="<%$topic->Name%>" />
       <input type="submit" class="btn btn-primary" name="Update" value="Update">
-  </div>
-</div>
-
-<div class="form-row">
-  <div class="label col-3">
-    Description:
-  </div>
-  <div class="value col-9 input-group">
+</&>
+
+<&| /Elements/LabeledValue, Label => loc("Description"), ValueSpanClass => 'input-group' &>
       <input class="form-control" type="text" name="Topic-<%$topic->Id%>-Description" size="20" value="<%$topic->Description%>" />
       <input type="submit" class="btn btn-primary" name="Delete-Topic-<%$topic->Id%>" value="Delete" />
-  </div>
-</div>
+</&>
 <%args>
 $topic
 </%args>
diff --git a/share/html/Admin/Assets/Catalogs/Elements/EditBasics b/share/html/Admin/Assets/Catalogs/Elements/EditBasics
index d6759e13f1..94863ac494 100644
--- a/share/html/Admin/Assets/Catalogs/Elements/EditBasics
+++ b/share/html/Admin/Assets/Catalogs/Elements/EditBasics
@@ -45,48 +45,30 @@
 %# those contributions and any derivatives thereof.
 %#
 %# END BPS TAGGED BLOCK }}}
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Name</&>
-    </div>
-    <div class="value col-9">
+    <&| /Elements/LabeledValue, Label => loc("Name") &>
       <input type="text" class="form-control" name="Name" value="<% $current{Name} %>" size="40">
-    </div>
-  </div>
+  </&>
 
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Description</&>
-    </div>
-    <div class="value col-9">
+  <&| /Elements/LabeledValue, Label => loc("Description") &>
       <input type="text" class="form-control" name="Description" value="<% $current{Description} %>" size="40">
-    </div>
-  </div>
+  </&>
 
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Lifecycle</&>
-    </div>
-    <div class="value col-9">
+    <&| /Elements/LabeledValue, Label => loc("Lifecycle") &>
       <& /Widgets/Form/Select:InputOnly,
           Name         => 'Lifecycle',
           Values       => [ sort { loc($a) cmp loc($b) } RT::Lifecycle->List( $CatalogObj->LifecycleType ) ],
           CurrentValue => $current{Lifecycle},
           Default      => 0,
       &>
-    </div>
-  </div>
+    </&>
 
-  <div class="form-row">
-    <div class="label col-3"></div>
-    <input name="SetDisabled" type="hidden" value="1">
-    <div class="value col-9">
+  <&| /Elements/LabeledValue, Label => '' &>
+      <input name="SetDisabled" type="hidden" value="1">
       <div class="custom-control custom-checkbox">
         <input name="Disabled" type="checkbox" class="checkbox custom-control-input" id="Disabled" value="1" <% $current{Disabled} ? "checked" : "" %>>
         <label class="custom-control-label" for="Disabled"><&|/l&>Disabled?</&></label>
       </div>
-    </div>
-  </div>
+  </&>
 <%args>
 $CatalogObj
 </%args>
diff --git a/share/html/Admin/Conditions/Elements/EditBasics b/share/html/Admin/Conditions/Elements/EditBasics
index b10108075f..850aca78c4 100644
--- a/share/html/Admin/Conditions/Elements/EditBasics
+++ b/share/html/Admin/Conditions/Elements/EditBasics
@@ -45,51 +45,21 @@
 %# those contributions and any derivatives thereof.
 %#
 %# END BPS TAGGED BLOCK }}}
-<div class="form-row">
-  <div class="label col-3">
-    <&|/l&>Name</&>:
-  </div>
-  <div class="value col-9">
-    <input type="text" class="form-control" name="Name" size="60" value="<% $ARGS{"Name"} || $Condition->Name || '' %>" />
-  </div>
-</div>
-
-<div class="form-row">
-  <div class="label col-3">
-    <&|/l&>Description</&>:
-  </div>
-  <div class="value col-9">
+<&| /Elements/LabeledValue, Label => loc("Name") &>
+  <input type="text" class="form-control" name="Name" size="60" value="<% $ARGS{"Name"} || $Condition->Name || '' %>" />
+</&>
+<&| /Elements/LabeledValue, Label => loc("Description") &>
     <input type="text" class="form-control" name="Description" size="60" value="<% $ARGS{"Description"} || $Condition->Description || '' %>" />
-  </div>
-</div>
-
-<div class="form-row">
-  <div class="label col-3">
-    <&|/l&>Condition Module</&>:
-  </div>
-  <div class="value col-9">
+</&>
+<&| /Elements/LabeledValue, Label => loc("Condition Module") &>
     <input type="text" class="form-control" name="ExecModule" size="60" value="<% $ARGS{"ExecModule"} || $Condition->ExecModule || ''%>" />
-  </div>
-</div>
-
-<div class="form-row">
-  <div class="label col-3">
-    <&|/l&>Parameters to Pass</&>:
-  </div>
-  <div class="value col-9">
+</&>
+<&| /Elements/LabeledValue, Label => loc("Parameters to Pass") &>
     <input type="text" class="form-control" name="Argument" size="60" value="<% $ARGS{"Argument"} || $Condition->Argument || '' %>"/>
-  </div>
-</div>
-
-<div class="form-row">
-  <div class="label col-3">
-    <&|/l&>Applicable Transaction Types</&>:
-  </div>
-  <div class="value col-9">
-    <input type="text" class="form-control" name="ApplicableTransTypes" size="60" value="<% $ARGS{"ApplicableTransTypes"} || $Condition->ApplicableTransTypes || '' %>" />
-  </div>
-</div>
-
+</&>
+<&| /Elements/LabeledValue, Label => loc("Applicable Transaction Types") &>
+  <input type="text" class="form-control" name="ApplicableTransTypes" size="60" value="<% $ARGS{"ApplicableTransTypes"} || $Condition->ApplicableTransTypes || '' %>" />
+</&>
 <%ARGS>
 $Condition
 </%ARGS>
diff --git a/share/html/Admin/Conditions/Elements/ShowBasics b/share/html/Admin/Conditions/Elements/ShowBasics
index 718642257a..8c6da127bd 100644
--- a/share/html/Admin/Conditions/Elements/ShowBasics
+++ b/share/html/Admin/Conditions/Elements/ShowBasics
@@ -45,50 +45,21 @@
 %# those contributions and any derivatives thereof.
 %#
 %# END BPS TAGGED BLOCK }}}
-<div class="form-row">
-  <div class="label col-3">
-    <&|/l&>Name</&>:
-  </div>
-  <div class="value col-9">
-    <span class="current-value"><% $ARGS{"Name"} || $Condition->Name || '' %></span>
-  </div>
-</div>
-
-<div class="form-row">
-  <div class="label col-3">
-    <&|/l&>Description</&>:
-  </div>
-  <div class="value col-9">
-    <span class="current-value"><% $ARGS{"Description"} || $Condition->Description || '' %></span>
-  </div>
-</div>
-
-<div class="form-row">
-  <div class="label col-3">
-    <&|/l&>Condition Module</&>:
-  </div>
-  <div class="value col-9">
-    <span class="current-value"><% $ARGS{"ExecModule"} || $Condition->ExecModule || ''%></span>
-  </div>
-</div>
-
-<div class="form-row">
-  <div class="label col-3">
-    <&|/l&>Parameters to Pass</&>:
-  </div>
-  <div class="value col-9">
-    <span class="current-value"><% $ARGS{"Argument"} || $Condition->Argument || '' %></span>
-  </div>
-</div>
-
-<div class="form-row">
-  <div class="label col-3">
-    <&|/l&>Applicable Transaction Types</&>:
-  </div>
-  <div class="value col-9">
-    <span class="current-value"><% $ARGS{"ApplicableTransTypes"} || $Condition->ApplicableTransTypes || '' %></span>
-  </div>
-</div>
+<&| /Elements/LabeledValue, Label => loc("Name"), ValueSpanClass => 'current-value' &>
+  <% $ARGS{"Name"} || $Condition->Name || '' %>
+</&>
+<&| /Elements/LabeledValue, Label => loc("Description"), ValueSpanClass => 'current-value' &>
+  <% $ARGS{"Description"} || $Condition->Description || '' %>
+</&>
+<&| /Elements/LabeledValue, Label => loc("Condition Module"), ValueSpanClass => 'current-value' &>
+  <% $ARGS{"ExecModule"} || $Condition->ExecModule || ''%>
+</&>
+<&| /Elements/LabeledValue, Label => loc("Parameters to Pass"), ValueSpanClass => 'current-value' &>
+  <% $ARGS{"Argument"} || $Condition->Argument || '' %>
+</&>
+<&| /Elements/LabeledValue, Label => loc("Applicable Transaction Types"), ValueSpanClass => 'current-value' &>
+  <% $ARGS{"ApplicableTransTypes"} || $Condition->ApplicableTransTypes || '' %>
+</&>
 
 <%ARGS>
 $Condition
diff --git a/share/html/Admin/CustomFields/Modify.html b/share/html/Admin/CustomFields/Modify.html
index d026f760ec..2cfc5be13e 100644
--- a/share/html/Admin/CustomFields/Modify.html
+++ b/share/html/Admin/CustomFields/Modify.html
@@ -57,84 +57,50 @@
 
 <&| /Widgets/TitleBox, title => 'Basics', class => 'custom-field-info-basics', content_class => 'mx-auto width-sm' &>
 
-<div class="form-row">
-  <div class="label col-3">
-    <&|/l&>Name</&>
-  </div>
-  <div class="value col-9">
-    <input class="form-control" type="text" name="Name" value="<% $CustomFieldObj->Name || $Name || '' %>" size="20" />
-  </div>
-</div>
+<&| /Elements/LabeledValue, Label => loc("Name") &>
+  <input class="form-control" type="text" name="Name" value="<% $CustomFieldObj->Name || $Name || '' %>" size="20" />
+</&>
 
-<div class="form-row">
-  <div class="label col-3">
-    <&|/l&>Description</&>
-  </div>
-  <div class="value col-9">
+<&| /Elements/LabeledValue, Label => loc("Description") &>
     <input class="form-control" type="text" name="Description" value="<% $CustomFieldObj->Description || $Description || '' %>" size="80" />
-  </div>
-</div>
+</&>
 
-<div class="form-row">
-  <div class="label col-3">
-    <&|/l&>Type</&>
-  </div>
-  <div class="value col-9">
+<&| /Elements/LabeledValue, Label => loc("Type") &>
     <& /Admin/Elements/SelectCustomFieldType,
       Name => "TypeComposite",
       Default => $CustomFieldObj->TypeComposite,
     &>
-  </div>
-</div>
+</&>
 
 % if ( $CustomFieldObj->Id and $CustomFieldObj->HasRenderTypes ) {
-<div class="form-row">
-  <div class="label col-3">
-    <&|/l&>Render Type</&>
-  </div>
-  <div class="value col-9">
+<&| /Elements/LabeledValue, Label => loc("Render Type") &>
     <& /Admin/Elements/SelectCustomFieldRenderType,
         Name            => "RenderType",
         TypeComposite   => $CustomFieldObj->TypeComposite,
         Default         => $CustomFieldObj->RenderType, 
         BasedOn         => $CustomFieldObj->BasedOnObj->id, &>
-  </div>
-</div>
+</&>
 % }
 
 % if ( $CustomFieldObj->Id and $CustomFieldObj->IsSelectionType and RT->Config->Get('CustomFieldValuesSources') and ( scalar(@{RT->Config->Get('CustomFieldValuesSources')}) > 0 ) ) {
-<div class="form-row">
-  <div class="label col-3">
-    <&|/l&>Field values source:</&>
-  </div>
-  <div class="value col-9">
+
+<&| /Elements/LabeledValue, Label => loc("Field values source") &>
     <& /Admin/Elements/EditCustomFieldValuesSource, CustomField => $CustomFieldObj &>
-  </div>
-</div>
+</&>
 % }
 
 % if ( $CustomFieldObj->Id and $CustomFieldObj->IsCanonicalizeType and RT->Config->Get('CustomFieldValuesCanonicalizers') and ( scalar(@{RT->Config->Get('CustomFieldValuesCanonicalizers')}) > 0 ) ) {
-<div class="form-row">
-  <div class="label col-3">
-    <&|/l&>Canonicalizer:</&>
-  </div>
-  <div class="value col-9">
+<&| /Elements/LabeledValue, Label => loc("Canonicalizer") &>
     <& /Admin/Elements/EditCustomFieldValuesCanonicalizer, CustomField => $CustomFieldObj &>
-  </div>
-</div>
+</&>
 % }
 
-<div class="form-row">
-  <div class="label col-3">
-    <&|/l&>Applies to</&>
-  </div>
-  <div class="value col-9">
+<&| /Elements/LabeledValue, Label => loc("Applies to") &>
     <& /Admin/Elements/SelectCustomFieldLookupType,
       Name => "LookupType",
       Default => $CustomFieldObj->LookupType || $LookupType,
     &>
-  </div>
-</div>
+</&>
 
 <script type="text/javascript">
 jQuery( function() {
@@ -154,59 +120,36 @@ jQuery( function() {
 });
 </script>
 
-<div class="form-row">
-  <div class="label col-3">
-    <&|/l&>Entry Hint</&>
-  </div>
-  <div class="value col-9">
+<&| /Elements/LabeledValue, Label => loc("Entry Hint") &>
     <input class="form-control" type="text" name="EntryHint" value="<% $CustomFieldObj->EntryHint // $EntryHint // '' %>" size="80" />
-  </div>
-</div>
-
-<div class="form-row">
-  <div class="label col-3">
-    <&|/l&>Validation</&>
-  </div>
-  <div class="value col-9">
+</&>
+<&| /Elements/LabeledValue, Label => loc("Validation") &>
     <& /Widgets/ComboBox,
       Name    => 'Pattern',
       Default => $CustomFieldObj->Pattern || $Pattern,
       Size    => 20,
       Values  => \@CFvalidations,
     &>
-  </div>
-</div>
+</&>
 
 % if ( $CustomFieldObj->SupportDefaultValues ) {
-<div class="form-row">
-  <div class="label col-3 edit_default_values">
-    <&|/l, $CustomFieldObj->MaxValues &>Default [numerate,_1,value,values]</&>
-  </div>
-  <div class="value col-9">
-    <& /Elements/EditCustomField, NamePrefix => 'Default-', CustomField => $CustomFieldObj, ShowEmptyOption => 1 &>
-  </div>
-</div>
+<&| /Elements/LabeledValue, Label => loc("Default [numerate,_1,value,values]", $CustomFieldObj->MaxValues) &>
+  <& /Elements/EditCustomField, NamePrefix => 'Default-', CustomField => $CustomFieldObj, ShowEmptyOption => 1 &>
+</&>
 % }
 
 % if ( $CustomFieldObj->Id && $CustomFieldObj->IsSelectionType ) {
-<div class="form-row categoriesbasedon">
-  <div class="label col-3">
-    <&|/l&>Categories are based on</&>
-  </div>
-  <div class="value col-9">
+  <&| /Elements/LabeledValue, Label => loc("Categories are based on") &>
     <& /Admin/Elements/SelectCustomField,
       Name => "BasedOn",
       LookupType => $CustomFieldObj->LookupType,
       Default => $CustomFieldObj->BasedOnObj || $BasedOn,
       Not => $CustomFieldObj->id,
     &>
-  </div>
-</div>
+  </&>
 % }
 
-<div class="form-row">
-  <div class="label col-3"></div>
-  <div class="value col-9">
+<&| /Elements/LabeledValue, Label => "" &>
     <input type="hidden" class="hidden" name="SetUniqueValues" value="1" />
     <div class="custom-control custom-checkbox">
       <input type="checkbox" class="custom-control-input" id="UniqueValues" name="UniqueValues" value="1" <% $UniqueValuesChecked |n %> />
@@ -214,14 +157,11 @@ jQuery( function() {
         <&|/l&>New values must be unique</&>
       </label>
     </div>
-  </div>
-</div>
+</&>
 
 % $m->callback(CallbackName => 'BeforeEnabled', CustomField => $CustomFieldObj, CFvalidations => \@CFvalidations);
 
-<div class="form-row">
-  <div class="label col-3"></div>
-  <div class="value col-9">
+<&| /Elements/LabeledValue, Label => "" &>
     <input type="hidden" class="hidden" name="SetEnabled" value="1" />
     <div class="custom-control custom-checkbox">
       <input type="checkbox" class="custom-control-input" id="Enabled" name="Enabled" value="1" <% $EnabledChecked |n %> />
@@ -229,8 +169,7 @@ jQuery( function() {
         <&|/l&>Enabled (Unchecking this box disables this custom field)</&>
       </label>
     </div>
-  </div>
-</div>
+</&>
 
 % $m->callback(CallbackName => 'EndOfTable', CustomField => $CustomFieldObj, CFvalidations => \@CFvalidations);
 
diff --git a/share/html/Admin/CustomRoles/Modify.html b/share/html/Admin/CustomRoles/Modify.html
index e213dfaf46..115a64588d 100644
--- a/share/html/Admin/CustomRoles/Modify.html
+++ b/share/html/Admin/CustomRoles/Modify.html
@@ -56,36 +56,19 @@
 % $m->callback( CallbackName => 'FormStart', Create => $Create, ARGSRef => \%ARGS );
 
 <&| /Widgets/TitleBox, class => 'custom-role-info-basics', content_class => 'mx-auto width-sm' &>
-<div class="form-row">
-  <div class="label col-3">
-    <&|/l&>Role Name</&>:
-  </div>
-  <div class="value col-9">
+<&| /Elements/LabeledValue, Label => loc("Role Name") &>
     <input class="form-control" type="text" name="Name" value="<% $Create ? "" : $RoleObj->Name || $Name %>" />
-  </div>
-</div>
+</&>
 
-<div class="form-row">
-  <div class="label col-3">
-    <&|/l&>Description</&>:
-  </div>
-  <div class="value col-9">
+<&| /Elements/LabeledValue, Label => loc("Descripton") &>
     <input class="form-control" type="text" name="Description" value="<% $Create ? "" : $RoleObj->Description || $Description || '' %>" size="60" />
-  </div>
-</div>
+</&>
 
-<div class="form-row">
-  <div class="label col-3">
-    <&|/l&>Entry Hint</&>:
-  </div>
-  <div class="value col-9">
+<&| /Elements/LabeledValue, Label => loc("Entry Hint") &>
     <input class="form-control" type="text" name="EntryHint" value="<% $Create ? "" : $RoleObj->EntryHint || $EntryHint || '' %>" size="60" />
-  </div>
-</div>
+</&>
 
-<div class="form-row">
-  <div class="label col-3"></div>
-  <div class="value col-9">
+<&| /Elements/LabeledValue, Label => "" &>
     <div class="custom-control custom-checkbox">
       <input type="checkbox" class="custom-control-input" id="Multiple" name="Multiple" value="1"
 % if ( $Create || $RoleObj->UnlimitedValues ) {
@@ -103,26 +86,23 @@ disabled="disabled"
 % }
       </label>
     </div>
-  </div>
-</div>
+</&>
 
 
 
 <input type="hidden" class="hidden" name="SetMultiple" value="1" />
 
-<div class="form-row">
-  <div class="label col-3"></div>
-  <div class="value col-9">
+<&| /Elements/LabeledValue, Label => "" &>
     <div class="custom-control custom-checkbox">
       <input type="checkbox" class="custom-control-input" id="Enabled" name="Enabled" value="1" <%$EnabledChecked|n%> />
       <label class="custom-control-label" for="Enabled"><&|/l&>Enabled (Unchecking this box disables this custom role)</&></label>
     </div>
+</&>
+
     <input type="hidden" class="hidden" name="SetEnabled" value="1" />
 % $m->callback( %ARGS, RoleObj => $RoleObj, results => \@results );
-  </div>
-</div>
-
 </&>
+
   <div class="form-row">
     <div class="col-12">
 %   if ( $Create ) {
diff --git a/share/html/Admin/Elements/AddLinks b/share/html/Admin/Elements/AddLinks
index 87a31aa77f..8b212cf573 100644
--- a/share/html/Admin/Elements/AddLinks
+++ b/share/html/Admin/Elements/AddLinks
@@ -53,23 +53,14 @@
 <i><&|/l&>Enter objects or URIs to link objects to. Separate multiple entries with spaces.</&></i><br />
 % }
 
-  <div class="form-row">
-    <div class="label col-3">
-      <& /Elements/ShowRelationLabel, Object => $Object, Label => loc('Links to').':', Relation => 'RefersTo' &>
-    </div>
-    <div class="value col-9">
-      <input type="text" class="form-control" name="<%$id%>-RefersTo" value="<% $ARGSRef->{"$id-RefersTo"} || '' %>" <% $exclude |n%>/>
-    </div>
-  </div>
+  <&| /Elements/LabeledValue, RawLabel => $m->scomp('/Elements/ShowRelationLabel', Object => $Object, Label => loc('Links to'), Relation => 'RefersTo') &>
+    <input type="text" class="form-control" name="<%$id%>-RefersTo" value="<% $ARGSRef->{"$id-RefersTo"} || '' %>" <% $exclude |n%>/>
+  </&>
 
-  <div class="form-row">
-    <div class="label col-3">
-      <& /Elements/ShowRelationLabel, Object => $Object, Label => loc('Linked to by').':', Relation => 'ReferredToBy' &>
-    </div>
-    <div class="value col-9">
+  <&| /Elements/LabeledValue, RawLabel => $m->scomp('/Elements/ShowRelationLabel', Object => $Object, Label => loc('Linked to by'), Relation => 'ReferredToBy') &>
       <input type="text" class="form-control" name="RefersTo-<%$id%>" value="<% $ARGSRef->{"RefersTo-$id"} || '' %>" <% $exclude |n%>/>
-    </div>
-  </div>
+  </&>
+
   <& /Elements/EditCustomFields,
         Object          => $Object,
         Grouping        => 'Links',
diff --git a/share/html/Admin/Elements/EditCustomField b/share/html/Admin/Elements/EditCustomField
index 4fb1020d16..2c902230e4 100644
--- a/share/html/Admin/Elements/EditCustomField
+++ b/share/html/Admin/Elements/EditCustomField
@@ -52,32 +52,17 @@
 <input type="hidden" class="hidden" name="CustomField" value="<%$id %>" />
 <input type="hidden" class="hidden" name="Queue" value="<%$Queue%>" />
 
-<div class="form-row">
-  <div class="label col-3>
-    <&|/l&>Name</&>:
-  <div>
-  <div class="value col-9">
-    <input class="form-control" type="text" name="Name" value="<%$CustomFieldObj->Name%>" size="20" />
-  </div>
-</div>
+<&| /Elements/LabeledValue, Label => loc("Name") &>
+  <input class="form-control" type="text" name="Name" value="<%$CustomFieldObj->Name%>" size="20" />
+</&>
 
-<div class="form-row">
-  <div class="label col-3>
-    <&|/l&>Description</&>:
-  </div>
-  <div class="value col-9">
-    <input class="form-control" type="text" name="Description" value="<%$CustomFieldObj->Description%>" size="80" />
-  </div>
-</div>
+<&| /Elements/LabeledValue, Label => loc("Description") &>
+  <input class="form-control" type="text" name="Description" value="<%$CustomFieldObj->Description%>" size="80" />
+</&>
 
-<div class="form-row">
-  <div class="label col-3>
-    <&|/l&>Type</&>:
-  </div>
-  <div class="value col-9">
-    <& /Admin/Elements/SelectCustomFieldType, Name => "Type", Default => $CustomFieldObj->Type &>
-  </div>
-</div>
+<&| /Elements/LabeledValue, Label => loc("Type") &>
+  <& /Admin/Elements/SelectCustomFieldType, Name => "Type", Default => $CustomFieldObj->Type &>
+</&>
 
 <input type="hidden" class="hidden" name="SetEnabled" value="1" />
 <div class="custom-control custom-checkbox">
@@ -89,15 +74,12 @@
 % if ($CustomFieldObj->Id and $CustomFieldObj->Type =~ /Select/) {
 <h2><&|/l&>Values</&></h2>
 <font size="-1">
-<& /Admin/Elements/EditCustomFieldValues, CustomField => $CustomFieldObj &>
-<& /Admin/Elements/AddCustomFieldValue, CustomField => $CustomFieldObj &>
+  <& /Admin/Elements/EditCustomFieldValues, CustomField => $CustomFieldObj &>
+  <& /Admin/Elements/AddCustomFieldValue, CustomField => $CustomFieldObj &>
 </font>
 % }
 <&/Elements/Submit, Label => loc('Create') &>
 </form>
-
-
-
 <%INIT>
 
 my $CustomFieldObj = RT::CustomField->new($session{'CurrentUser'});
diff --git a/share/html/Admin/Elements/EditLinks b/share/html/Admin/Elements/EditLinks
index 96098662ec..fb4685a017 100644
--- a/share/html/Admin/Elements/EditLinks
+++ b/share/html/Admin/Elements/EditLinks
@@ -53,11 +53,7 @@
         <h3><&|/l&>Current Links</&></h3>
       </div>
     </div>
-    <div class="form-row">
-      <div class="label col-3">
-        <& /Elements/ShowRelationLabel, Object => $Object, Label => loc('Links to').':', Relation => 'RefersTo' &>
-      </div>
-      <div class="value col-9">
+    <&| /Elements/LabeledValue, RawLabel => $m->scomp('/Elements/ShowRelationLabel', Object => $Object, Label => loc('Links to'), Relation => 'RefersTo') &>
         <div class="form-row">
           <div class="col-auto">
 % while (my $link = $Object->RefersTo->Next) {
@@ -65,13 +61,8 @@
 %}
           </div>
         </div>
-      </div>
-    </div>
-    <div class="form-row">
-      <div class="label col-3">
-        <& /Elements/ShowRelationLabel, Object => $Object, Label => loc('Linked to by').':', Relation => 'ReferredToBy' &>
-      </div>
-      <div class="value col-9">
+    </&>
+    <&| /Elements/LabeledValue, RawLabel => $m->scomp('/Elements/ShowRelationLabel', Object => $Object, Label => loc('Linked to by'), Relation => 'ReferredToBy') &>
         <div class="form-row">
           <div class="col-auto">
 % while (my $link = $Object->ReferredToBy->Next) {
@@ -79,14 +70,10 @@
 % }
           </div>
         </div>
-      </div>
-    </div>
-    <div class="form-row">
-      <div class="label col-3"></div>
-      <div class="value col-9">
+    </&>
+    <&| /Elements/LabeledValue, Label => '' &>
         <i><&|/l&>(Check box to remove link)</&></i>
-      </div>
-    </div>
+    </&>
   </div>
 
   <div class="col-6">
diff --git a/share/html/Admin/Elements/ShowKeyInfo b/share/html/Admin/Elements/ShowKeyInfo
index 165d6ac29a..f969fc23a3 100644
--- a/share/html/Admin/Elements/ShowKeyInfo
+++ b/share/html/Admin/Elements/ShowKeyInfo
@@ -78,72 +78,25 @@
 </div>
 
 % if ( $Type ne 'private' && $res{'info'}{'Trust'} ) {
-<div class="form-row">
-  <div class="label col-3">
-    <% loc('Trust') %>:
-  </div>
-  <div class="value col-9">
-    <span class="current-value"><% loc( $res{'info'}{'Trust'} ) %></span>
-  </div>
-</div>
+<& /Elements/LabeledValue, Label => loc('Trust'), Value => loc($res{'info'}{'Trust'}), ValueSpanClass => 'current-value' &>
 % }
 
-<div class="form-row">
-  <div class="label col-3">
-    <% loc('Fingerprint') %>:
-  </div>
-  <div class="value col-9">
-    <span class="current-value"><% $res{'info'}{'Fingerprint'} %></span>
-  </div>
-</div>
-
+<& /Elements/LabeledValue, Label => loc('Fingerprint'), Value => $res{'info'}{'Fingerprint'}, ValueSpanClass => 'current-value' &>
 % $_->CurrentUser( $session{CurrentUser} ) for grep {$_} (@{$res{'info'}}{qw|Created Expire|});
-<div class="form-row">
-  <div class="label col-3">
-    <% loc('Created') %>:
-  </div>
-  <div class="value col-9">
-    <span class="current-value">
-      <% $res{'info'}{'Created'}? $res{'info'}{'Created'}->AsString( Time => 0 ): loc('never') %>
-    </span>
-  </div>
-</div>
 
-<div class="form-row">
-  <div class="label col-3">
-    <% loc('Expire') %>:
-  </div>
-  <div class="value col-9">
-    <span class="current-value">
-      <% $res{'info'}{'Expire'}? $res{'info'}{'Expire'}->AsString( Time => 0 ): loc('never') %>
-    </span>
-  </div>
-</div>
+<& /Elements/LabeledValue, Label => loc('Created'), Value =>$res{'info'}{'Created'}? $res{'info'}{'Created'}->AsString( Time => 0 ): loc('never'), ValueSpanClass => 'current-value' &>
+<& /Elements/LabeledValue, Label => loc('Expire'), Value =>$res{'info'}{'Expire'}? $res{'info'}{'Expire'}->AsString( Time => 0 ): loc('never'), ValueSpanClass => 'current-value' &>
+
 
 % foreach my $uinfo( @{ $res{'info'}{'User'} } ) {
 % if ($uinfo->{'Created'} or $uinfo->{'Expire'}) {
 %   $_->CurrentUser( $session{CurrentUser} ) for grep {$_} ($uinfo->{'Created'}, $uinfo->{'Expire'});
-<div class="form-row">
-  <div class="label col-3">
-    <% loc('User (created - expire)') %>:
-  </div>
-  <div class="value col-9">
-    <span class="current-value">
+<&| /Elements/LabeledValue, Label => loc('User (created - expire)'), ValueSpanClass => 'current-value' &>
       <% $uinfo->{'String'} %> \
      (<% $uinfo->{'Created'}? $uinfo->{'Created'}->AsString( Time => 0 ): loc('never') %> - <% $uinfo->{'Expire'}? $uinfo->{'Expire'}->AsString( Time => 0 ): loc('never') %>)
-    </span>
-  </div>
-</div>
+</&>
 % } else {
-<div class="form-row">
-  <div class="label col-3">
-    <% loc('User') %>:
-  </div>
-  <div class="value col-9">
-    <span class="current-value"><% $uinfo->{'String'} %></span>
-  </div>
-</div>
-
+<& /Elements/LabeledValue, Label => loc('User'), Value => $uinfo->{'String'}, ValueSpanClass => 'current-value' &>
 % }
 % }
 
diff --git a/share/html/Admin/Groups/Modify.html b/share/html/Admin/Groups/Modify.html
index 8b96081b57..afeea7f37b 100644
--- a/share/html/Admin/Groups/Modify.html
+++ b/share/html/Admin/Groups/Modify.html
@@ -61,33 +61,21 @@
 % }
 
   <&| /Widgets/TitleBox, title => loc('Basics'), class => 'group-info-basics', content_class => 'mx-auto width-sm' &>
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Name</&>:
-    </div>
-    <div class="value col-9">
-      <input type="text" name="Name" class="form-control" value="<%$Group->Name||$Name||''%>" />
-    </div>
-  </div>
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Description</&>:
-    </div>
-    <div class="value col-9">
+  <&| /Elements/LabeledValue, Label => loc('Name') &>
+    <input type="text" name="Name" class="form-control" value="<%$Group->Name||$Name||''%>" />
+  </&>
+  <&| /Elements/LabeledValue, Label => loc('Description') &>
       <input type="text" name="Description" class="form-control" value="<%$Group->Description||$Description||''%>" size="60" />
-    </div>
-  </div>
-  <& /Elements/EditCustomFields, Object => $Group, Grouping => 'Basics', InTable => 1 &>
-  <div class="form-row">
-    <div class="value col-9 offset-md-3">
-      <div class="custom-control custom-checkbox">
-        <input type="hidden" class="hidden" name="SetEnabled" value="1" />
-        <input type="checkbox" id="Enabled" name="Enabled" class="custom-control-input" value="1" <%$EnabledChecked%> />
-        <label class="custom-control-label" for="Enabled"><&|/l&>Enabled (Unchecking this box disables this group)</&></label><br />
-      </div>
-    </div>
+</&>
+<& /Elements/EditCustomFields, Object => $Group, Grouping => 'Basics', InTable => 1 &>
+<&| /Elements/LabeledValue, Label => '' &>
+  <div class="custom-control custom-checkbox">
+    <input type="hidden" class="hidden" name="SetEnabled" value="1" />
+    <input type="checkbox" id="Enabled" name="Enabled" class="custom-control-input" value="1" <%$EnabledChecked%> />
+    <label class="custom-control-label" for="Enabled"><&|/l&>Enabled (Unchecking this box disables this group)</&></label><br />
   </div>
   </&>
+  </&>
   <& /Elements/EditCustomFieldCustomGroupings , Object => $Group, &>
 % $m->callback( %ARGS, GroupObj => $Group, results => \@results );
 
diff --git a/share/html/Admin/Lifecycles/Create.html b/share/html/Admin/Lifecycles/Create.html
index 0e942f5784..23dd716309 100644
--- a/share/html/Admin/Lifecycles/Create.html
+++ b/share/html/Admin/Lifecycles/Create.html
@@ -52,31 +52,20 @@
 <form action="<%RT->Config->Get('WebPath')%>/Admin/Lifecycles/Create.html" name="CreateLifecycle" method="post" enctype="multipart/form-data" class="mx-auto max-width-lg">
 
 <&| /Widgets/TitleBox, class => 'lifecycle-info-basics', content_class => 'mx-auto width-sm' &>
-  <div class="form-row">
-    <div class="col-3 label">
-      <&|/l&>Lifecycle Name</&>:
-    </div>
-    <div class="col-9 value">
+<&| /Elements/LabeledValue, Label => loc('Lifecycle Name') &>
       <input type="text" name="Name" value="<% $Name %>" class="form-control" />
-    </div>
-  </div>
+</&>
+
+<&| /Elements/LabeledValue, Label => loc('Type') &>
 
-  <div class="form-row">
-    <div class="col-3 label"><&|/l&>Type</&>:</div>
-    <div class="col-9 value">
       <select name="Type" class="form-control selectpicker">
 % for my $type (@types) {
         <option value="<% $type %>" <% $type eq $Type ? "selected=selected" : "" %>><% loc($type) %></option>
 % }
       </select>
-    </div>
-  </div>
+  </&>
+  <&| /Elements/LabeledValue, Label => loc('Clone Lifecycle') &>
 
-  <div class="form-row">
-    <div class="col-3 label">
-      <&|/l&>Clone Lifecycle</&>:
-    </div>
-    <div class="col-9 value">
       <ul class="list-group list-group-compact">
         <li class="list-group-item">
           <div class="custom-control custom-radio">
@@ -96,9 +85,7 @@
 %   }
 % }
       </ul>
-    </div>
-  </div>
-
+  </&>
   <div class="form-row">
     <div class="col-12">
       <& /Elements/Submit, Name => 'Create', Label => loc('Create') &>
diff --git a/share/html/Admin/Queues/DefaultValues.html b/share/html/Admin/Queues/DefaultValues.html
index b2a4135132..0adde7522e 100644
--- a/share/html/Admin/Queues/DefaultValues.html
+++ b/share/html/Admin/Queues/DefaultValues.html
@@ -54,24 +54,14 @@
 
 <div class="ticket-info-basics">
   <&| /Widgets/TitleBox, title => loc('Basics'), content_class => 'mx-auto width-sm' &>
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Priority</&>:
-    </div>
-    <div class="value col-9">
-      <& /Elements/SelectPriority, Name => "InitialPriority", Default => $queue->DefaultValue('InitialPriority'), QueueObj => $queue &>
-    </div>
-  </div>
 
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Final Priority</&>:
-    </div>
-    <div class="value col-9">
+  <&| /Elements/LabeledValue, Label => loc('Priority') &>
+    <& /Elements/SelectPriority, Name => "InitialPriority", Default => $queue->DefaultValue('InitialPriority'), QueueObj => $queue &>
+  </&>
+  <&| /Elements/LabeledValue, Label => loc('Final Priority') &>
       <& /Elements/SelectPriority, Name => "FinalPriority", Default => $queue->DefaultValue('FinalPriority'), QueueObj => $queue &>
       <span><em><&|/l&>requires running rt-crontool</&></em></span>
-    </div>
-  </div>
+  </&>
 
   <& /Elements/EditCustomFields,
       Object => RT::Ticket->new($session{CurrentUser}),
@@ -80,37 +70,21 @@
       CategoryObj => $queue,
   &>
 
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Article</&>:
-    </div>
-    <div class="value col-9">
+  <&| /Elements/LabeledValue, Label => loc('Article') &>
       <& /Elements/SelectArticle, QueueObj => $queue, Default => $queue->DefaultValue('Article'), Name => 'Article' &>
-    </div>
-  </div>
+  </&>
 
   </&>
 </div>
 
 <div class="ticket-info-dates">
   <&|/Widgets/TitleBox, title => loc("Dates"), content_class => 'mx-auto width-sm' &>
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Starts</&>:
-    </div>
-    <div class="value col-9">
-      <& /Elements/SelectDate, Name => "Starts", Default => $queue->DefaultValue('Starts') || '' &>
-    </div>
-  </div>
-
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Due</&>:
-    </div>
-    <div class="value col-9">
+  <&| /Elements/LabeledValue, Label => loc('Starts') &>
+    <& /Elements/SelectDate, Name => "Starts", Default => $queue->DefaultValue('Starts') || '' &>
+  </&>
+  <&| /Elements/LabeledValue, Label => loc('Due') &>
       <& /Elements/SelectDate, Name => "Due", Default => $queue->DefaultValue('Due') || '' &>
-    </div>
-  </div>
+  </&>
 
   <& /Elements/EditCustomFields,
       Object => RT::Ticket->new($session{CurrentUser}),
diff --git a/share/html/Admin/Queues/Modify.html b/share/html/Admin/Queues/Modify.html
index 8262f752ea..c59b5216d4 100644
--- a/share/html/Admin/Queues/Modify.html
+++ b/share/html/Admin/Queues/Modify.html
@@ -56,33 +56,20 @@
 % $m->callback( CallbackName => 'FormStart', Create => $Create, ARGSRef => \%ARGS );
 
 <&| /Widgets/TitleBox, class => 'queue-info-basics', content_class => 'mx-auto width-sm' &>
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Queue Name</&>:
-    </div>
-    <div class="value col-9">
+<&| /Elements/LabeledValue, Label => loc('Queue Name') &>
+
 % if ($InternalQueue) {
       <% $QueueObj->Name %>
 % } else {
       <input type="text" class="form-control" name="Name" value="<% $Create ? "" : $QueueObj->Name || $Name %>" />
 % }
-    </div>
-  </div>
+  </&>
 
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Description</&>:
-    </div>
-    <div class="value col-9">
+  <&| /Elements/LabeledValue, Label => loc('Description') &>
       <input type="text" class="form-control" name="Description" value="<% $Create ? "" : $QueueObj->Description || $Description || '' %>" size="60" />
-    </div>
-  </div>
+  </&>
 
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Lifecycle</&>:
-    </div>
-    <div class="value col-9">
+  <&| /Elements/LabeledValue, Label => loc('Lifecycle') &>
 % if ($InternalQueue) {
       <% $QueueObj->Lifecycle %>
 % } else {
@@ -93,49 +80,30 @@
           Default      => 0,
       &>
 % }
-    </div>
-  </div>
+  </&>
 
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Subject Tag</&>:
-    </div>
-    <div class="value col-9">
-      <input type="text" class="form-control" name="SubjectTag" value="<% $ARGS{'SubjectTag'} || ($Create ? "" : $QueueObj->SubjectTag || '' ) %>" size="60" />
-    </div>
-  </div>
+  <&| /Elements/LabeledValue, Label => loc('Subject Tag') &>
+    <input type="text" class="form-control" name="SubjectTag" value="<% $ARGS{'SubjectTag'} || ($Create ? "" : $QueueObj->SubjectTag || '' ) %>" size="60" />
+  </&>
 
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Sort Order</&>:
-    </div>
-    <div class="value col-9">
+  <&| /Elements/LabeledValue, Label => loc('Sort Order') &>
       <input type="text" class="form-control" name="SortOrder" value="<% $Create ? 0 : $QueueObj->SortOrder || $SortOrder || 0 %>" size="60" />
-    </div>
-  </div>
+  </&>
 
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Reply Address</&>:
-    </div>
-    <div class="value col-9">
+  <&| /Elements/LabeledValue, Label => loc('Reply Address') &>
       <input type="email" class="form-control" name="CorrespondAddress" value="<% $Create ? "" : $QueueObj->CorrespondAddress || $CorrespondAddress || '' %>" />
       <span><em><&|/l , RT->Config->Get('CorrespondAddress')&>(If left blank, will default to [_1])</&></em></span>
-    </div>
+  </&>
 
-    <div class="label col-3">
-      <&|/l&>Comment Address</&>:
-    </div>
-    <div class="value col-9">
-      <input type="email" class="form-control" name="CommentAddress" value="<% $Create ? "" : $QueueObj->CommentAddress || $CommentAddress || '' %>" />
-      <span><em><&|/l , RT->Config->Get('CommentAddress')&>(If left blank, will default to [_1])</&></em></span>
-    </div>
-  </div>
+  <&| /Elements/LabeledValue, Label => loc('Comment Address') &>
+
+    <input type="email" class="form-control" name="CommentAddress" value="<% $Create ? "" : $QueueObj->CommentAddress || $CommentAddress || '' %>" />
+    <span><em><&|/l , RT->Config->Get('CommentAddress')&>(If left blank, will default to [_1])</&></em></span>
+  </&>
 % $m->callback( CallbackName => 'AfterQueueAddresses', %ARGS, QueueObj => $QueueObj, results => \@results );
 
-  <div class="form-row">
-    <div class="label col-3"></div>
-    <div class="value col-9">
+  <&| /Elements/LabeledValue, Label => '' &>
+
       <div class="custom-control custom-checkbox">
         <input type="checkbox" class="custom-control-input checkbox" id="SLAEnabled" name="SLAEnabled" value="1" 
 % if ( $QueueObj->id && !$QueueObj->SLADisabled ) {
@@ -145,69 +113,49 @@
         <label class="custom-control-label" for="SLAEnabled"><&|/l&>SLA Enabled (Unchecking this box disables SLA for this queue)</&></label>
         <input type="hidden" class="hidden" name="SetSLAEnabled" value="1" />
       </div>
-    </div>
-  </div>
-
+  </&>
 % my $CFs = $QueueObj->CustomFields;
 % while (my $CF = $CFs->Next) {
-  <div class="form-row">
-    <div class="label col-3">
-      <span class="<% $CF->EntryHint ? 'prev-icon-helper' : '' %>"><% $CF->Name %>:</span>\
-% if ( $CF->EntryHint ) {
-<span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<% $CF->EntryHint %>"></span>
-% }
-    </div>
-    <div class="value col-9">
+<&| /Elements/LabeledValue, Label => $CF->Name, LabelTooltip => $CF->EntryHint &>
+
       <& /Elements/EditCustomField, CustomField => $CF,
                                     Object => $QueueObj, &>
-    </div>
-  </div>
+</&>
 % }
 
 % if ( RT->Config->Get('Crypt')->{'Enable'} ) {
-  <div class="form-row">
-    <div class="label col-3"></div>
-    <div class="value col-9">
+  <&| /Elements/LabeledValue, Label => '' &>
       <div class="custom-control custom-checkbox">
         <input type="checkbox" class="custom-control-input checkbox" id="Sign" name="Sign" value="1" <% $QueueObj->Sign? 'checked="checked"': '' |n%> />
         <label class="custom-control-label" for="Sign"><&|/l&>Sign by default</&></label>
       </div>
-    </div>
-  </div>
+   </&>
+
+   <&| /Elements/LabeledValue, Label => '' &>
 
-  <div class="form-row">
-    <div class="label col-3"></div>
-    <div class="value col-9">
       <div class="custom-control custom-checkbox">
         <input type="checkbox" class="custom-control-input checkbox" id="Encrypt" name="Encrypt" value="1" <% $QueueObj->Encrypt? 'checked="checked"': '' |n%> />
         <label class="custom-control-label" for="Encrypt"><&|/l&>Encrypt by default</&></label>
       </div>
-    </div>
-  </div>
+  </&>
 
-  <div class="form-row">
-    <div class="label col-3"></div>
-    <div class="value col-9">
+  <&| /Elements/LabeledValue, Label => '' &>
       <div class="custom-control custom-checkbox">
         <input type="checkbox" class="custom-control-input checkbox" id="SignAuto" name="SignAuto" value="1" <% $QueueObj->SignAuto? 'checked="checked"': '' |n%> />
         <label class="custom-control-label" for="SignAuto"><&|/l_unsafe, "<b>","</b>","<i>","</i>"&>Sign all auto-generated mail.  [_1]Caution[_2]: Enabling this option alters the signature from providing [_3]authentication[_4] to providing [_3]integrity[_4].</&></label>
       </div>
-    </div>
-  </div>
+    </&>
 % }
 
 % unless ($InternalQueue) {
-  <div class="form-row">
-    <div class="label col-3"></div>
-    <div class="value col-9">
+  <&| /Elements/LabeledValue, Label => '' &>
       <div class="custom-control custom-checkbox">
         <input type="checkbox" class="custom-control-input checkbox" id="Enabled" name="Enabled" value="1" <%$EnabledChecked|n%> />
         <label class="custom-control-label" for="Enabled"><&|/l&>Enabled (Unchecking this box disables this queue)</&></label>
         <input type="hidden" class="hidden" name="SetEnabled" value="1" />
 % $m->callback( %ARGS, QueueObj => $QueueObj, results => \@results );
       </div>
-    </div>
-  </div>
+  </&>
 % }
 
 % if ( RT->Config->Get('Crypt')->{'Enable'} ) {
diff --git a/share/html/Admin/Scrips/Create.html b/share/html/Admin/Scrips/Create.html
index 75a7c6a986..43c8be477c 100644
--- a/share/html/Admin/Scrips/Create.html
+++ b/share/html/Admin/Scrips/Create.html
@@ -57,27 +57,18 @@
 
 <& Elements/EditBasics, %ARGS, Scrip => $scrip, Queue => $queue_obj &>
 
-  <div class="form-row">
-    <div class="label col-2">
-      <&|/l&>Stage</&>:
-    </div>
-    <div class="value col-9">
+  <&| /Elements/LabeledValue, Label => loc('Stage') &>
       <& /Admin/Elements/SelectStage, Default => $ARGS{"Stage"} &>
-    </div>
-  </div>
+  </&>
 
 <input type="hidden" class="hidden" name="SetEnabled" value="1" />
 
-  <div class="form-row">
-    <div class="label col-2">
-    </div>
-    <div class="value col-9">
-      <div class="custom-control custom-checkbox">
-        <input type="checkbox" class="custom-control-input checkbox" name="Enabled" id="Enabled" value="1" <% $ARGS{'Enabled'}? 'checked="checked"': '' |n%> />
-        <label class="custom-control-label" for="Enabled"><&|/l&>Enabled (Unchecking this box disables this scrip)</&></label>
-      </div>
-    </div>
+<&| /Elements/LabeledValue, Label => '' &>
+  <div class="custom-control custom-checkbox">
+    <input type="checkbox" class="custom-control-input checkbox" name="Enabled" id="Enabled" value="1" <% $ARGS{'Enabled'}? 'checked="checked"': '' |n%> />
+    <label class="custom-control-label" for="Enabled"><&|/l&>Enabled (Unchecking this box disables this scrip)</&></label>
   </div>
+ </&>
 
 </&>
 
diff --git a/share/html/Admin/Scrips/Elements/EditBasics b/share/html/Admin/Scrips/Elements/EditBasics
index b72c3a6000..78e940bdbe 100644
--- a/share/html/Admin/Scrips/Elements/EditBasics
+++ b/share/html/Admin/Scrips/Elements/EditBasics
@@ -45,42 +45,18 @@
 %# those contributions and any derivatives thereof.
 %#
 %# END BPS TAGGED BLOCK }}}
-<div class="form-row">
-  <div class="label col-2">
-    <&|/l&>Description</&>:
-  </div>
-  <div class="value col-9">
-    <input type="text" class="form-control" name="Description" size="60" value="<% $ARGS{"Description"} || $Scrip->Description || '' %>" />
-  </div>
-</div>
-
-<div class="form-row">
-  <div class="label col-2">
-    <&|/l&>Condition</&>:
-  </div>
-  <div class="value col-9">
-    <& /Admin/Elements/SelectScripCondition, Default => $ARGS{"ScripCondition"} || $Scrip->ConditionObj->Id, &>
-  </div>
-</div>
-
-<div class="form-row">
-  <div class="label col-2">
-    <&|/l&>Action</&>:
-  </div>
-  <div class="value col-9">
-    <& /Admin/Elements/SelectScripAction, Default => $ARGS{"ScripAction"} || $Scrip->ActionObj->Id, &>
-  </div>
-</div>
-
-<div class="form-row">
-  <div class="label col-2">
-    <&|/l&>Template</&>:
-  </div>
-  <div class="value col-9">
-    <& SelectTemplate, Default => $ARGS{"Template"}, Scrip => $Scrip, Queue => $Queue &>
-  </div>
-</div>
-
+<&| /Elements/LabeledValue, Label => loc('Description') &>
+  <input type="text" class="form-control" name="Description" size="60" value="<% $ARGS{"Description"} || $Scrip->Description || '' %>" />
+</&>
+<&| /Elements/LabeledValue, Label => loc('Condition') &>
+  <& /Admin/Elements/SelectScripCondition, Default => $ARGS{"ScripCondition"} || $Scrip->ConditionObj->Id, &>
+</&>
+<&| /Elements/LabeledValue, Label => loc('Action') &>
+  <& /Admin/Elements/SelectScripAction, Default => $ARGS{"ScripAction"} || $Scrip->ActionObj->Id, &>
+</&>
+<&| /Elements/LabeledValue, Label => loc('Template') &>
+  <& SelectTemplate, Default => $ARGS{"Template"}, Scrip => $Scrip, Queue => $Queue &>
+</&>
 <%ARGS>
 $Scrip
 $Queue => undef
diff --git a/share/html/Admin/Scrips/Modify.html b/share/html/Admin/Scrips/Modify.html
index a2ab8df999..e6660ebbc3 100644
--- a/share/html/Admin/Scrips/Modify.html
+++ b/share/html/Admin/Scrips/Modify.html
@@ -84,16 +84,12 @@
 
 <input type="hidden" class="hidden" name="SetEnabled" value="1" />
 
-  <div class="form-row">
-    <div class="label col-2">
+  <&| /Elements/LabeledValue, Label => '' &>
+    <div class="custom-control custom-checkbox">
+      <input type="checkbox" class="checkbox custom-control-input" name="Enabled" id="Enabled" value="1" <% $EnabledChecked |n%> />
+      <label class="custom-control-label" for="Enabled"><&|/l&>Enabled (Unchecking this box disables this scrip)</&></label>
     </div>
-    <div class="value col-9">
-      <div class="custom-control custom-checkbox">
-        <input type="checkbox" class="checkbox custom-control-input" name="Enabled" id="Enabled" value="1" <% $EnabledChecked |n%> />
-        <label class="custom-control-label" for="Enabled"><&|/l&>Enabled (Unchecking this box disables this scrip)</&></label>
-      </div>
-    </div>
-  </div>
+  </&>
 
 </&>
 
diff --git a/share/html/Admin/Tools/GnuPG.html b/share/html/Admin/Tools/GnuPG.html
index 374a9ba68b..bc501e8e1f 100644
--- a/share/html/Admin/Tools/GnuPG.html
+++ b/share/html/Admin/Tools/GnuPG.html
@@ -55,49 +55,33 @@
 <&|/Widgets/TitleBox, title => loc('Import Keys'), content_class => 'mx-auto width-md' &>
 % my %options = RT->Config->Get('GnuPGOptions');
 % if ( $options{'keyserver'} ) {
-  <div class="form-row">
-    <div class="label col-3"></div>
-    <div class="input-group col-9">
+  <&| /Elements/LabeledValue, Label => '' &>
+  <div class="input-group">
       <input name="Query" class="form-control" value="<% $ARGS{Query} // '' %>" size="40" />
       <input name="Search" type="submit" class="button btn btn-primary" value="<&|/l&>Search</&>" />
-    </div>
-  </div>
+  </&>
 % if ( @search_results ) {
-  <div class="form-row">
-    <div class="label col-3"></div>
-    <div class="value col-9">
+  <&| /Elements/LabeledValue, Label => '' &>
       <div class="custom-control custom-checkbox">
         <input type="checkbox" class="custom-control-input checkbox" id="KeyAll" name="KeyAll" value="1" onclick="setCheckbox(this, 'Key')" />
         <label class="custom-control-label" for="KeyAll"><&|/l&>Check All</&></label>
       </div>
-    </div>
-  </div>
+  </&>
 % for my $item ( @search_results ) {
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Key</&>:
-    </div>
-    <div class="value col-9">
+  <&| /Elements/LabeledValue, Label => loc("Key") &>
       <div class="custom-control custom-checkbox">
         <input type="checkbox" class="custom-control-input checkbox" id="Key-<% $item->{Key} %>" name="Key" value="<% $item->{Key} %>" />
         <label class="custom-control-label" for="Key-<% $item->{Key} %>"><% $item->{Summary} %></label>
       </div>
-    </div>
-  </div>
+  </&>
 % }
 % }
 
 % }
 
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Content</&>:
-    </div>
-    <div class="value col-9">
+  <&| /Elements/LabeledValue, Label => loc("Content") &>
       <textarea class="form-control" name="Content" rows="8"><% $ARGS{Content} // '' %></textarea>
-    </div>
-  </div>
-
+  </&>
   <div class="form-row">
     <div class="col-12">
       <& /Elements/Submit, Name => 'Import', Label => loc('Import') &>
diff --git a/share/html/Admin/Tools/Shredder/Elements/PluginArguments b/share/html/Admin/Tools/Shredder/Elements/PluginArguments
index ad25c85878..84ce563f0f 100644
--- a/share/html/Admin/Tools/Shredder/Elements/PluginArguments
+++ b/share/html/Admin/Tools/Shredder/Elements/PluginArguments
@@ -51,25 +51,21 @@ $Plugin => ''
 <div id="shredder-plugin-<% $Plugin %>-arguments" class="shredder-form">
 <&| /Widgets/TitleBox, title => loc("Search") &>
 % for my $a ( $plugin_obj->SupportArgs ) {
-  <div class="form-row">
 %  if( $plugin_obj->ArgIsBoolean( $a ) ) {
-    <div class="col-9 offset-md-3">
+  <&| /Elements/LabeledValue, Label => "" &>
       <div class="custom-control custom-checkbox">
         <input type="checkbox" id="<% "$Plugin:$a" %>" name="<% "$Plugin:$a" %>" class="custom-control-input" value="<% $ARGS{ "$Plugin:$a" } || '' %>" />
         <label class="custom-control-label" for="<% "$Plugin:$a" %>"><% loc($a) %></label>
         <span class="hints d-block"><% $arguments_help{$a}->{help} |n%></span>
-      </div>
-    </div>
+   </&>
 %  } else {
-    <div class="label col-3"><% loc($a) %></div>
-    <div class="value col-9">
+  <&| /Elements/LabeledValue, Label => loc($a) &>
       <input type="text" name="<% "$Plugin:$a" %>" id="<% "$Plugin:$a" %>" class="form-control" value="<% $ARGS{ "$Plugin:$a" } || '' %>" />
 %     if( $arguments_help{$a} ) {
           <span class="hints d-block"><% $arguments_help{$a}->{type} . ' - ' . $arguments_help{$a}->{help} |n%></span>
 %     }
-    </div>
+  </&>
 %  }
-  </div>
 % }
   <div id="shredder-submit-button" class="<% $Plugin? '': 'hidden' %>">
     <div class="form-row">
diff --git a/share/html/Admin/Users/Modify.html b/share/html/Admin/Users/Modify.html
index 0ed8e68a34..0feafe9de5 100644
--- a/share/html/Admin/Users/Modify.html
+++ b/share/html/Admin/Users/Modify.html
@@ -60,78 +60,30 @@
   <div class="boxcontainer col-xl-6">
 
 <&| /Widgets/TitleBox, title => loc('Identity'), class => 'user-info-identity' &>
-
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Username</&>:
-    </div>
-    <div class="value col-9">
-      <input type="text" class="form-control" name="Name" value="<%$UserObj->Name//$ARGS{Name}//''%>" /> <strong><&|/l&>(required)</&></strong>
-    </div>
-  </div>
-
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Email</&>:
-    </div>
-    <div class="value col-9">
-      <input type="email" class="form-control" name="EmailAddress" value="<%$UserObj->EmailAddress//$ARGS{EmailAddress}//''%>" />
-    </div>
-  </div>
-
-  <div class="form-row">
-    <div class="label col-3">
-       <&|/l&>Real Name</&>:
-    </div>
-    <div class="value col-9">
-      <input type="text" class="form-control" name="RealName" value="<%$UserObj->RealName//$ARGS{RealName}//''%>" />
-    </div>
-  </div>
-
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Nickname</&>:
-    </div>
-    <div class="value col-9">
-      <input type="text" class="form-control" name="NickName" value="<%$UserObj->NickName//$ARGS{NickName}//''%>" />
-    </div>
-  </div>
-
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Unix login</&>:
-    </div>
-    <div class="value col-9">
+  <&| /Elements/LabeledValue, Label => loc("Username") &>
+    <input type="text" class="form-control" name="Name" value="<%$UserObj->Name//$ARGS{Name}//''%>" /> <strong><&|/l&>(required)</&></strong>
+  </&>
+  <&| /Elements/LabeledValue, Label => loc("Email") &>
+    <input type="email" class="form-control" name="EmailAddress" value="<%$UserObj->EmailAddress//$ARGS{EmailAddress}//''%>" />
+  </&>
+  <&| /Elements/LabeledValue, Label => loc("Real Name") &>
+    <input type="text" class="form-control" name="RealName" value="<%$UserObj->RealName//$ARGS{RealName}//''%>" />
+  </&>
+  <&| /Elements/LabeledValue, Label => loc("Nickname") &>
+    <input type="text" class="form-control" name="NickName" value="<%$UserObj->NickName//$ARGS{NickName}//''%>" />
+  </&>
+  <&| /Elements/LabeledValue, Label => loc("Unix login") &>
       <input type="text" class="form-control" name="Gecos" value="<%$UserObj->Gecos//$ARGS{Gecos}//''%>" />
-    </div>
-  </div>
-
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Language</&>:
-    </div>
-    <div class="value col-9">
+  </&>
+  <&| /Elements/LabeledValue, Label => loc("Language") &>
       <& /Elements/SelectLang, Name => 'Lang', Default => $UserObj->Lang//$ARGS{Lang} &>
-    </div>
-  </div>
-
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Timezone</&>:
-    </div>
-    <div class="value col-9">
+  </&>
+  <&| /Elements/LabeledValue, Label => loc("Timezone") &>
       <& /Elements/SelectTimezone, Name => 'Timezone', Default => $UserObj->Timezone &>
-    </div>
-  </div>
-
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Extra info</&>:
-    </div>
-    <div class="value col-9">
+  </&>
+  <&| /Elements/LabeledValue, Label => loc("Extra info") &>
       <textarea class="form-control" name="FreeformContactInfo" cols="20" rows="5"><%$UserObj->FreeformContactInfo//$ARGS{FreeformContactInfo}//''%></textarea>
-    </div>
-  </div>
+  </&>
 
 <& /Elements/EditCustomFields, Object => $UserObj, Grouping => 'Identity' &>
 </&>
@@ -153,7 +105,7 @@
     <div class="col-12">
       <div class="custom-control custom-checkbox">
         <input type="checkbox" class="custom-control-input checkbox" id="Privileged" name="Privileged" value="1" <%$PrivilegedChecked|n%> />
-        <label class="custom-control-label" for="Privileged"><&|/l&>Let this user be granted rights</&> (<&|/l&>Privileged</&>)</label>
+        <label class="custom-control-label" for="Privileged"><&|/l&>Let this user be granted rights</&>(<&|/l&>Privileged</&>)</label>
       </div>
     </div>
   </div>
@@ -198,110 +150,44 @@
   <div class="boxcontainer col-xl-6">
 
 <&| /Widgets/TitleBox, title => loc('Location'), class => 'user-info-location' &>
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Organization</&>:
-    </div>
-    <div class="value col-9">
-      <input type="text" class="form-control" name="Organization" value="<%$UserObj->Organization//$ARGS{Organization}//''%>" />
-    </div>
-  </div>
-
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Address1</&>:
-    </div>
-    <div class="value col-9">
-      <input type="text" class="form-control" name="Address1" value="<%$UserObj->Address1//$ARGS{Address1}//''%>" />
-    </div>
-  </div>
-
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Address2</&>:
-    </div>
-    <div class="value col-9">
+  <&| /Elements/LabeledValue, Label => loc("Organization") &>
+    <input type="text" class="form-control" name="Organization" value="<%$UserObj->Organization//$ARGS{Organization}//''%>" />
+  </&>
+  <&| /Elements/LabeledValue, Label => loc("Address1") &>
+    <input type="text" class="form-control" name="Address1" value="<%$UserObj->Address1//$ARGS{Address1}//''%>" />
+  </&>
+  <&| /Elements/LabeledValue, Label => loc("Address2") &>
       <input type="text" class="form-control" name="Address2" value="<%$UserObj->Address2//$ARGS{Address2}//''%>" />
-    </div>
-  </div>
-
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>City</&>:
-    </div>
-    <div class="value col-9">
-      <input type="text" class="form-control" name="City" value="<%$UserObj->City//$ARGS{City}//''%>" size="14" />
-    </div>
-  </div>
-
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>State</&>:
-    </div>
-    <div class="value col-9">
-      <input type="text" class="form-control" name="State" value="<%$UserObj->State//$ARGS{State}//''%>" size="3" />
-    </div>
-  </div>
-
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Zip</&>:
-    </div>
-    <div class="value col-9">
-      <input type="text" class="form-control" name="Zip" value="<%$UserObj->Zip//$ARGS{Zip}//''%>" size="9" />
-    </div>
-  </div>
-
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Country</&>:
-    </div>
-    <div class="value col-9">
-      <input type="text" class="form-control" name="Country" value="<%$UserObj->Country//$ARGS{Country}//''%>" />
-    </div>
-  </div>
-
-<& /Elements/EditCustomFields, Object => $UserObj, Grouping => 'Location' &>
-
+  </&>
+  <&| /Elements/LabeledValue, Label => loc("City") &>
+    <input type="text" class="form-control" name="City" value="<%$UserObj->City//$ARGS{City}//''%>" size="14" />
+  </&>
+  <&| /Elements/LabeledValue, Label => loc("State") &>
+    <input type="text" class="form-control" name="State" value="<%$UserObj->State//$ARGS{State}//''%>" size="3" />
+  </&>
+  <&| /Elements/LabeledValue, Label => loc("Zip") &>
+    <input type="text" class="form-control" name="Zip" value="<%$UserObj->Zip//$ARGS{Zip}//''%>" size="9" />
+  </&>
+  <&| /Elements/LabeledValue, Label => loc("Country") &>
+
+    <input type="text" class="form-control" name="Country" value="<%$UserObj->Country//$ARGS{Country}//''%>" />
+  </&>
+  <& /Elements/EditCustomFields, Object => $UserObj, Grouping => 'Location' &>
 </&>
 
 <&| /Widgets/TitleBox, title => loc('Phone numbers'), class => 'user-info-phones' &>
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Residence</&>:
-    </div>
-    <div class="value col-9">
+  <&| /Elements/LabeledValue, Label => loc("Residence") &>
       <input type="tel" class="form-control" name="HomePhone" value="<%$UserObj->HomePhone//$ARGS{HomePhone}//''%>" size="13" />
-    </div>
-  </div>
-
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Work</&>:
-    </div>
-    <div class="value col-9">
+    </&>
+    <&| /Elements/LabeledValue, Label => loc("Work") &>
       <input type="tel" class="form-control" name="WorkPhone" value="<%$UserObj->WorkPhone//$ARGS{WorkPhone}//''%>" size="13" />
-    </div>
-  </div>
-
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Mobile</&>:
-    </div>
-    <div class="value col-9">
+    </&>
+    <&| /Elements/LabeledValue, Label => loc("Mobile") &>
       <input type="tel" class="form-control" name="MobilePhone" value="<%$UserObj->MobilePhone//$ARGS{MobilePhone}//''%>" size="13" />
-    </div>
-  </div>
-
-  <div class="form-row">
-    <div class="label col-3">
-      <&|/l&>Pager</&>:
-    </div>
-    <div class="value col-9">
-      <input type="tel" class="form-control" name="PagerPhone" value="<%$UserObj->PagerPhone//$ARGS{PagerPhone}//''%>" size="13" />
-    </div>
-  </div>
-
+    </&>
+  <&| /Elements/LabeledValue, Label => loc("Pager") &>
+    <input type="tel" class="form-control" name="PagerPhone" value="<%$UserObj->PagerPhone//$ARGS{PagerPhone}//''%>" size="13" />
+    </&>
 <& /Elements/EditCustomFields, Object => $UserObj, Grouping => 'Phones' &>
 
 </&>