[Rt-commit] rt branch 5.0/label-tooltip-nowrap created. rt-5.0.2-36-gc5cbb4e099

BPS Git Server git at git.bestpractical.com
Fri Nov 12 21:51:36 UTC 2021


This is an automated email from the git hooks/post-receive script. It was
generated because a ref change was pushed to the repository containing
the project "rt".

The branch, 5.0/label-tooltip-nowrap has been created
        at  c5cbb4e09962218c48986cefcaa59bc2c2ec1a16 (commit)

- Log -----------------------------------------------------------------
commit c5cbb4e09962218c48986cefcaa59bc2c2ec1a16
Author: sunnavy <sunnavy at bestpractical.com>
Date:   Sat Nov 13 05:49:10 2021 +0800

    Update tests because of the space removal between label text and help icon
    
    We removed the space to make label wrap more nicely in 9a5d876599.

diff --git a/t/externalauth/ldap.t b/t/externalauth/ldap.t
index 6316491d0d..ad304a7319 100644
--- a/t/externalauth/ldap.t
+++ b/t/externalauth/ldap.t
@@ -150,8 +150,8 @@ diag "test admin user create";
     $m->logout;
     ok( $m->login );
     $m->get_ok( $baseurl . '/Admin/Users/Modify.html?Create=1', 'user create page' );
-    $m->text_contains( 'Employee Type:  Set from external source' );
-    $m->text_contains( 'Employee ID:  Set from external source' );
+    $m->text_contains( 'Employee Type: Set from external source' );
+    $m->text_contains( 'Employee ID: Set from external source' );
 
     my $username = 'testuser2';
     $m->submit_form(

commit 9a5d87659901163612453636363d01cb78c387ba
Author: sunnavy <sunnavy at bestpractical.com>
Date:   Sat Nov 13 03:24:38 2021 +0800

    Try harder to not only wrap help tooltip in labels
    
    Labels especially for custom fields/roles could be long enough to wrap, and
    it's possible that it wraps between text and the help tooltip icon, so the
    last line might just contain the help icon, which looks odd.
    
    This commit binds the text ending and help icon more tightly, to avoid the
    above situation as much as possible. Note that the spaces between text span
    and help icon in HTML source are intentionally removed, otherwise the wrap
    could still happen right before the help icon.

diff --git a/share/html/Admin/Articles/Classes/Modify.html b/share/html/Admin/Articles/Classes/Modify.html
index 44af911941..75956e5f06 100644
--- a/share/html/Admin/Articles/Classes/Modify.html
+++ b/share/html/Admin/Articles/Classes/Modify.html
@@ -188,9 +188,9 @@
 % while (my $CF = $CFs->Next) {
   <div class="form-row">
     <div class="label col-3">
-      <% $CF->Name %>:
+      <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>
+<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">
diff --git a/share/html/Admin/Queues/Modify.html b/share/html/Admin/Queues/Modify.html
index e9e859632e..13a5096b5b 100644
--- a/share/html/Admin/Queues/Modify.html
+++ b/share/html/Admin/Queues/Modify.html
@@ -152,9 +152,9 @@
 % while (my $CF = $CFs->Next) {
   <div class="form-row">
     <div class="label col-3">
-      <% $CF->Name %>:
+      <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>
+<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">
diff --git a/share/html/Articles/Article/Elements/EditCustomFields b/share/html/Articles/Article/Elements/EditCustomFields
index 1ad8f0d809..fa7d01f1e3 100644
--- a/share/html/Articles/Article/Elements/EditCustomFields
+++ b/share/html/Articles/Article/Elements/EditCustomFields
@@ -48,9 +48,9 @@
 % while (my $CustomField = $CustomFields->Next()) {
 <div class="form-row">
   <div class="label col-3">
-    <span class="name"><%$CustomField->Name%>:</span>
+    <span class="name <% $CustomField->EntryHint ? 'prev-icon-helper' : '' %>"><%$CustomField->Name%>:</span>\
 % if ( $CustomField->EntryHint ) {
-    <span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<% $CustomField->EntryHint %>"></span>
+<span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<% $CustomField->EntryHint %>"></span>
 % }
   </div>
   <div class="value col-9 entry">
diff --git a/share/html/Elements/AuthToken/Create b/share/html/Elements/AuthToken/Create
index 56db5ab72a..9ae246e0db 100644
--- a/share/html/Elements/AuthToken/Create
+++ b/share/html/Elements/AuthToken/Create
@@ -69,8 +69,8 @@
 %         }
           <div class="form-row">
             <div class="label col-4">
-              <&|/l&>Description</&>:
-              <span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<% loc("What's this token for?") %>"></span>
+              <span class="prev-icon-helper"><&|/l&>Description</&>:</span>\
+<span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<% loc("What's this token for?") %>"></span>
             </div>
             <div class="value col-8">
               <input class="form-control" type="text" name="Description" value="<% $Description %>" size="16" />
diff --git a/share/html/Elements/AuthToken/Edit b/share/html/Elements/AuthToken/Edit
index e0579d4965..407ec01049 100644
--- a/share/html/Elements/AuthToken/Edit
+++ b/share/html/Elements/AuthToken/Edit
@@ -59,8 +59,8 @@
           <input type="hidden" name="Token" value="<% $Token->Id %>">
           <div class="form-row">
             <div class="label col-4">
-              <&|/l&>Description</&>:
-              <span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<% loc("What's this token for?") %>"></span>
+              <span class="prev-icon-helper"><&|/l&>Description</&>:</span>\
+<span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<% loc("What's this token for?") %>"></span>
 
             </div>
             <div class="value col-8">
diff --git a/share/html/Elements/BulkCustomFields b/share/html/Elements/BulkCustomFields
index efea2c0064..e19b181d9b 100644
--- a/share/html/Elements/BulkCustomFields
+++ b/share/html/Elements/BulkCustomFields
@@ -62,9 +62,9 @@
 % while (my $cf = $CustomFields->Next) {
   <div class="form-row py-2 <% ++$i%2 ? 'oddline': 'evenline' %>">
     <div class="label col-4 text-left">
-      <span class="name"><% $cf->Name %>:</span>
+      <span class="name <% $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>
+<span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<% $cf->EntryHint %>"></span>
 % }
     </div>
 % my $rows = 5;
diff --git a/share/html/Elements/EditCustomFields b/share/html/Elements/EditCustomFields
index b255a21af7..57cc3eafd7 100644
--- a/share/html/Elements/EditCustomFields
+++ b/share/html/Elements/EditCustomFields
@@ -56,9 +56,9 @@
 
   <div class="form-row edit-custom-field cftype-<% $Type %>">
     <div class="label col-<% $LabelCols %>">
-      <% $CustomField->Name %>:
+      <span class="<% $CustomField->EntryHint ? 'prev-icon-helper' : '' %>"><% $CustomField->Name %>:</span>\
 % if ( $CustomField->EntryHint ) {
-      <span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<% $CustomField->EntryHint %>"></span>
+<span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<% $CustomField->EntryHint %>"></span>
 % }
     </div>
     <div class="value col-<% $ValueCols %>">
diff --git a/share/html/Elements/Lifecycle/Graph b/share/html/Elements/Lifecycle/Graph
index bc9b542d35..5cf18b2766 100644
--- a/share/html/Elements/Lifecycle/Graph
+++ b/share/html/Elements/Lifecycle/Graph
@@ -94,8 +94,9 @@
       <span class="current-value form-control">
         <div class="custom-control custom-checkbox">
           <input class="custom-control-input" type="checkbox" id="enableSimulation" name="enableSimulation" />
-          <label class="custom-control-label" for="enableSimulation"><&|/l&>Auto Layout</&>
-            <span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<&|/l&>Auto layout automatically spaces out statuses. Uncheck to manually reposition your lifecycle.</&>"></span>
+          <label class="custom-control-label" for="enableSimulation">
+            <span class="prev-icon-helper"><&|/l&>Auto Layout</&>:</span>\
+<span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<&|/l&>Auto layout automatically spaces out statuses. Uncheck to manually reposition your lifecycle.</&>"></span>
           </label>
         </div>
       </span>
diff --git a/share/html/Elements/ShowCustomFields b/share/html/Elements/ShowCustomFields
index eff8fba8e3..721a00a671 100644
--- a/share/html/Elements/ShowCustomFields
+++ b/share/html/Elements/ShowCustomFields
@@ -66,9 +66,10 @@
 % $m->callback( CallbackName => 'ModifyFieldClasses', CustomField => $CustomField,
 %               Object => $Object, Classes => \@classes, Grouping => $Grouping );
   <div class="form-row <% join(' ', @classes) %>" id="CF-<%$CustomField->id%>-ShowRow">
-    <div class="label col-<% $LabelCols %>"><% $CustomField->Name %>:
+    <div class="label col-<% $LabelCols %>">
+      <span class="<% $CustomField->EntryHint ? 'prev-icon-helper' : '' %>"><% $CustomField->Name %>:</span>\
 %   if ( $CustomField->EntryHint ) {
-      <span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<% $CustomField->EntryHint %>"></span>
+<span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<% $CustomField->EntryHint %>"></span>
 %   }
     </div>
     <div class="value col-<% $ValueCols %> <% $count ? '' : ' no-value' %>">
diff --git a/share/html/Search/Bulk.html b/share/html/Search/Bulk.html
index 362e336d92..a62e6b3042 100644
--- a/share/html/Search/Bulk.html
+++ b/share/html/Search/Bulk.html
@@ -206,9 +206,9 @@
 % while (my $role = $single_roles->Next) {
       <div class="form-row">
         <div class="label col-3">
-          <&|/l, $role->Name &>Make [_1]</&>:
+          <span class="<% $role->EntryHint ? 'prev-icon-helper' : '' %>"><&|/l, $role->Name &>Make [_1]</&>:</span>\
 %         if ($role->EntryHint) {
-            <span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<% $role->EntryHint %>"></span>
+<span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<% $role->EntryHint %>"></span>
 %         }
         </div>
         <div class="value col-9">
@@ -223,9 +223,9 @@
 % while (my $role = $multi_roles->Next) {
       <div class="form-row">
         <div class="label col-3">
-          <&|/l, $role->Name &>Add [_1]</&>:
+          <span class="<% $role->EntryHint ? 'prev-icon-helper' : '' %>"><&|/l, $role->Name &>Add [_1]</&>:</span>\
 %         if ($role->EntryHint) {
-            <span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<% $role->EntryHint %>"></span>
+<span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<% $role->EntryHint %>"></span>
 %         }
         </div>
         <div class="value col-9">
@@ -235,9 +235,9 @@
 
       <div class="form-row">
         <div class="label col-3">
-          <&|/l, $role->Name &>Remove [_1]</&>:
+          <span class="<% $role->EntryHint ? 'prev-icon-helper' : '' %>"><&|/l, $role->Name &>Remove [_1]</&>:</span>\
 %         if ($role->EntryHint) {
-            <span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<% $role->EntryHint %>"></span>
+<span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<% $role->EntryHint %>"></span>
 %         }
         </div>
         <div class="value col-9">
@@ -372,9 +372,9 @@
 % while (my $CF = $TxnCFs->Next()) {
   <div class="form-row">
     <div class="form-group label col-2">
-      <span class="name"><% $CF->Name %>:</span>
+      <span class="name <% $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>
+<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">
diff --git a/share/html/Ticket/Create.html b/share/html/Ticket/Create.html
index dafded8bca..bded7f6e57 100644
--- a/share/html/Ticket/Create.html
+++ b/share/html/Ticket/Create.html
@@ -161,14 +161,16 @@
 </div>
 
 <div class="form-row">
-<div class="label col-2"><&|/l&>Cc</&>:
+<div class="label col-2">
+<span class="prev-icon-helper"><&|/l&>Cc</&>:</span>\
 <span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<&|/l&>Sends a copy of this update to the provided users or groups. These people will receive future updates.</&>"></span>
 </div>
 <div class="value col-9"><& /Elements/EmailInput, Name => 'Cc', Size => undef, Default => $ARGS{Cc}, AutocompleteMultiple => 1, AutocompleteType => 'Principals' &></div>
 </div>
 
 <div class="form-row">
-<div class="label col-2"><&|/l&>Admin Cc</&>:
+<div class="label col-2">
+<span class="prev-icon-helper"><&|/l&>Admin Cc</&>:</span>\
 <span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<&|/l&>Sends a copy of this update to the provided users or groups. These people will receive future updates.</&>"></span>
 </div>
 <div class="value col-9"><& /Elements/EmailInput, Name => 'AdminCc', Size => undef, Default => $ARGS{AdminCc}, AutocompleteMultiple => 1, AutocompleteType => 'Principals' &></div>
@@ -183,9 +185,10 @@
 % $m->callback( CallbackName => 'ModifyCustomRoles', ARGSRef => \%ARGS, CustomRoles => $roles );
 % while (my $role = $roles->Next) {
 <div class="form-row">
-  <div class="form-group label col-2"><% $role->Name %>:
+  <div class="form-group label col-2">
+    <span class="<% $role->EntryHint ? 'prev-icon-helper' : '' %>"><% $role->Name %>:</span>\
 % if ($role->EntryHint) {
-    <span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<% $role->EntryHint %>"></span>
+<span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<% $role->EntryHint %>"></span>
 % }
   </div>
   <div class="form-group value col-9"><& /Elements/MultiUserRoleInput, role => $role, Default => $ARGS{$role->GroupType} &></div>
diff --git a/share/html/Ticket/Elements/EditBasics b/share/html/Ticket/Elements/EditBasics
index 376b9e9749..a7b90d08a1 100644
--- a/share/html/Ticket/Elements/EditBasics
+++ b/share/html/Ticket/Elements/EditBasics
@@ -186,9 +186,10 @@ for my $field (@fields) {
 % for my $field (@fields) {
 %# Prefer input name as css class, e.g. "FinalPriority" instead of "Final_Priority"
   <div class="form-row <% CSSClass( $field->{args}{Name} || $field->{'name'} ) %>">
-    <div class="label col-3"><% loc($field->{'name'}) %>:
+    <div class="label col-3">
+      <span class="<% $field->{hint} ? 'prev-icon-helper' : '' %>"><% loc($field->{'name'}) %>:</span>\
 %   if ( my $hint = $field->{hint} ) {
-      <span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<% $hint %>"></span>
+<span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<% $hint %>"></span>
 %   }
     </div>
     <div class="value col-9"><% $field->{'html'} |n %></div>
diff --git a/share/html/Ticket/Elements/EditPeople b/share/html/Ticket/Elements/EditPeople
index 5a61191ae6..a3e71d966f 100644
--- a/share/html/Ticket/Elements/EditPeople
+++ b/share/html/Ticket/Elements/EditPeople
@@ -88,9 +88,10 @@
 % $m->callback( CustomRoles => $single_roles, SingleRoles => 1, Ticket => $Ticket, %ARGS, CallbackName => 'ModifyCustomRoles' );
 % while (my $role = $single_roles->Next) {
 <div class="form-row">
-  <div class="label col-3"><% $role->Name %>:
+  <div class="label col-3">
+    <span class="<% $role->EntryHint ? 'prev-icon-helper' : '' %>"><% $role->Name %>:</span>\
 % if ( my $hint = $role->EntryHint ) {
-    <span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<% $hint %>"></span>
+<span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<% $hint %>"></span>
 % }
   </div>
   <div class="value col-6"><& /Elements/SingleUserRoleInput, role => $role, Ticket => $Ticket &></div>
@@ -143,9 +144,10 @@
   <div class="label col-3">
     <div class="custom-control custom-checkbox">
       <input type="checkbox" id="delete-<% $role->id %>-checkbox" class="checkbox custom-control-input" onclick="setCheckbox(this, /^Ticket-DeleteWatcher-Type-RT::CustomRole-<% $role->Id %>-/)">
-      <label class="custom-control-label" for="delete-<% $role->id %>-checkbox"><% $role->Name %>:
+      <label class="custom-control-label" for="delete-<% $role->id %>-checkbox">
+        <span class="<% $role->EntryHint ? 'prev-icon-helper' : '' %>"><% $role->Name %>:</span>\
 %     if ( my $hint = $role->EntryHint ) {
-        <span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<% $hint %>"></span>
+<span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<% $hint %>"></span>
 %     }
       </label>
     </div>
diff --git a/share/html/Ticket/Elements/EditPeopleInline b/share/html/Ticket/Elements/EditPeopleInline
index bb6cc60100..ffee6c9436 100644
--- a/share/html/Ticket/Elements/EditPeopleInline
+++ b/share/html/Ticket/Elements/EditPeopleInline
@@ -66,9 +66,10 @@
 
 % while (my $role = $single_roles->Next) {
 <div class="form-row">
-  <div class="label col-3"><% $role->Name %>:
+  <div class="label col-3">
+    <span class="<% $role->EntryHint ? 'prev-icon-helper' : '' %>"><% $role->Name %>:</span>\
 % if ( my $hint = $role->EntryHint ) {
-    <span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<% $hint %>"></span>
+<span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<% $hint %>"></span>
 % }
   </div>
   <div class="value col-6"><& /Elements/SingleUserRoleInput, role => $role, Ticket => $Ticket &></div>
@@ -124,9 +125,10 @@
   <div class="label col-3">
     <div class="custom-control custom-checkbox">
       <input type="checkbox" id="delete-<% $role->id %>-checkbox" class="checkbox custom-control-input" onclick="setCheckbox(this, /^Ticket-DeleteWatcher-Type-RT::CustomRole-<% $role->Id %>-/)">
-      <label class="custom-control-label" for="delete-<% $role->id %>-checkbox"><% $role->Name %>:
+      <label class="custom-control-label" for="delete-<% $role->id %>-checkbox">
+        <span class="<% $role->EntryHint ? 'prev-icon-helper' : '' %>"><% $role->Name %>:</span>\
 %     if ( my $hint = $role->EntryHint ) {
-        <span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<% $hint %>"></span>
+<span class="far fa-question-circle icon-helper" data-toggle="tooltip" data-placement="top" data-original-title="<% $hint %>"></span>
 %     }
       </label>
     </div>
diff --git a/share/html/Ticket/Elements/EditTransactionCustomFields b/share/html/Ticket/Elements/EditTransactionCustomFields
index 1a57007253..d503d3be9b 100644
--- a/share/html/Ticket/Elements/EditTransactionCustomFields
+++ b/share/html/Ticket/Elements/EditTransactionCustomFields
@@ -54,9 +54,9 @@
 % next unless $CF->CurrentUserHasRight('ModifyCustomField');
 <div class="form-row">
 <div class="label col-<% $LabelCols %>">
-  <span class="name"><% $CF->Name %>:</span>
+  <span class="name <% $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>
+<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-<% $ValueCols %>">
diff --git a/share/static/css/elevator-light/forms.css b/share/static/css/elevator-light/forms.css
index e43743cbb3..bce96432ca 100644
--- a/share/static/css/elevator-light/forms.css
+++ b/share/static/css/elevator-light/forms.css
@@ -512,3 +512,12 @@ textarea.code {
   background-color: rgba(0, 0, 0, .5);
   -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, .5);
 }
+
+/* Try not wrap icon-helper only */
+div.form-row > div.label > span.prev-icon-helper {
+  padding-right: 1em;
+}
+
+div.form-row > div.label > span.prev-icon-helper + .icon-helper {
+  margin-left: -1em;
+}

-----------------------------------------------------------------------


hooks/post-receive
-- 
rt


More information about the rt-commit mailing list