fix #2172 - horizontal popover with long point names

app/coffee/modules/common/estimation.coffee

@@ -203,7 +203,10 @@ EstimationsService = ($template, $qqueue, $repo, $confirm, $q) ->
                 point.selected = if @us.points[roleId] == point.id then false else true
                 return point
 
-            html = pointsTemplate({"points": points, roleId: roleId})
+            maxPointLength = 5
+            horizontalList =  _.some points, (point) => point.name.length > maxPointLength
+
+            html = pointsTemplate({"points": points, roleId: roleId, horizontal: horizontalList})
             # Remove any previous state
             @$el.find(".popover").popover().close()
             @$el.find(".pop-points-open").remove()

app/partials/common/estimation/us-estimation-points.jade

@@ -1,4 +1,4 @@
-ul.popover.pop-points-open
+ul.popover.pop-points-open(class!="<% if (horizontal) { %>horizontal<% }; %>")
     <% _.each(points, function(point) { %>
     li
         <% if (point.selected) { %>

app/styles/components/popover-points.scss

@@ -0,0 +1,10 @@
+// This file should contain in future all the common styles for the points popover
+
+.popover.pop-points-open {
+    &.horizontal {
+        li {
+            white-space: nowrap;
+            width: 100%;
+        }
+    }
+}

app/styles/layout/us-detail.scss

@@ -323,6 +323,7 @@
             @include popover(200px, $top: 105%, $left: -160px, $arrow-width: 10px, $arrow-top: -5px, $arrow-left: 90%, $arrow-height: 10px);
         }
     }
+
 }
 
 .duty-data-container {

main-sass.js

@@ -56,6 +56,7 @@ exports.files = function () {
         'components/beta',
         'components/markitup',
         'components/markdown-help',
+        'components/popover-points',
 
 
         //#################################################