[Rt-commit] rt branch, 5.0/try-to-not-wrap-label-tooltips, created. rt-5.0.0beta1-1-ge14a2cf313

[? sunnavy]

The branch, 5.0/try-to-not-wrap-label-tooltips has been created
        at  e14a2cf31365a4a1297c3ae8c71becc7b8ac45b8 (commit)

- Log -----------------------------------------------------------------
commit e14a2cf31365a4a1297c3ae8c71becc7b8ac45b8
Author: sunnavy <sunnavy at bestpractical.com>
Date:   Wed Jun 3 04:42:16 2020 +0800

    Try a bit harder to not wrap label tooltips
    
    When the first row doesn't have enough space left, tooltip could be
    wrapped into the second row, which looks kinda ugly when it's the only
    thing that gets wrapped.
    
    This commit sets to nowrap first and then check if the tooltip icon and
    the following value column content really overlap: if they don't
    overlap, then it's safe to not wrap.
    
    Note that it doesn't fix all the cases, but makes this edge case more
    rare in real world.

diff --git a/share/static/js/util.js b/share/static/js/util.js
index 1cbd739e53..c1be853a86 100644
--- a/share/static/js/util.js
+++ b/share/static/js/util.js
@@ -988,6 +988,24 @@ jQuery(function() {
         selector: '[data-toggle=tooltip]',
         trigger: 'hover focus'
     });
+
+    // Try harder to not wrap tooltips. If tooltip icons don't exceed
+    // label column's outer boundary(i.e. they could take the
+    // padding-right room), keep them in one row with label text.
+    jQuery('div.label > svg[data-toggle="tooltip"]').each( function() {
+        var svg   = jQuery(this);
+        var label = jQuery(this).parent();
+        var value = label.siblings('div.value');
+        if ( value.length ) {
+            var origin = label.css('white-space');
+            label.css('white-space', 'nowrap');
+            console.log(svg.offset().left + svg.width() + parseInt(svg.css('padding-left')) );
+            console.log(value.offset().left+ parseInt(value.css('padding-left')));
+            if ( svg.offset().left + svg.width() + parseInt(svg.css('padding-left')) > value.offset().left + parseInt(value.css('padding-left')) ) {
+                label.css('white-space', origin);
+            }
+        }
+    } );
 });
 
 // toggle bookmark for Ticket/Elements/Bookmark.

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