From fdd9d751e7b196a2ab588e664c1c01aa1dcbeae4 Mon Sep 17 00:00:00 2001
From: Nicolas Constant <github@nicolas-constant.com>
Date: Sat, 15 Jun 2019 14:58:24 -0400
Subject: [PATCH] fix poll display

---
 .../stream/status/poll/poll.component.html        |  5 +++--
 .../stream/status/poll/poll.component.scss        | 15 ++++++++++-----
 2 files changed, 13 insertions(+), 7 deletions(-)

diff --git a/src/app/components/stream/status/poll/poll.component.html b/src/app/components/stream/status/poll/poll.component.html
index 33a3192b..e310447a 100644
--- a/src/app/components/stream/status/poll/poll.component.html
+++ b/src/app/components/stream/status/poll/poll.component.html
@@ -1,7 +1,8 @@
 <div class="poll">
     <div *ngIf="!poll.voted && !poll.expired">
         <div *ngFor="let o of options">
-            <label class="poll__container">{{o.title}}
+            <label class="poll__container">
+                <span class="poll__container__title">{{o.title}}</span>
                 <input class="poll__container__input" type="{{choiceType}}" name="{{pollName}}" value="{{o.title}}"
                     (change)="onSelectionChange(o)">
                 <span class="poll__container__checkmark" *ngIf="!pollLocked"
@@ -15,7 +16,7 @@
             <div class="poll__result" title="{{ o.votes_count }} votes">
                 <div class="poll__result--progress-bar" [style.width]="o.percentage + '%'" [ngClass]="{ 'poll__result--progress-bar--most-votes': o.isMax }"></div>
                 <div class="poll__result--data"> <span class="poll__result--percentage">{{ o.percentage }}%</span>
-                    {{o.title}}</div>
+                <span class="poll__container__title">{{o.title}}</span></div>
 
             </div>
         </div>
diff --git a/src/app/components/stream/status/poll/poll.component.scss b/src/app/components/stream/status/poll/poll.component.scss
index cc3a19eb..93947f57 100644
--- a/src/app/components/stream/status/poll/poll.component.scss
+++ b/src/app/components/stream/status/poll/poll.component.scss
@@ -4,7 +4,7 @@
 @import "buttons";
 
 .poll {
-   
+
     color: white;
     color: rgb(228, 228, 228);
 
@@ -44,6 +44,11 @@
         -ms-user-select: none;
         user-select: none;
 
+        &__title {
+            text-overflow: ellipsis;
+            white-space: nowrap;
+        }
+
         &:hover &__input~&__checkmark {
             background-color: #ccc;
         }
@@ -125,7 +130,7 @@
 
     &__result {
         transition: width 2s;
-        
+
         margin: 0 0 5px 5px;
         padding: 0 5px 0 5px;
         position: relative;
@@ -141,15 +146,15 @@
             color: white;
             display: inline;
             margin-right: 10px;
-            
+
         }
 
         &--progress-bar {
             position: absolute;
             background-color: rgb(47, 68, 100);
             // background-color: rgb(43, 62, 92);
-            top:0;
-            left:0;
+            top: 0;
+            left: 0;
             width: calc(100%);
             height: 22px;
             z-index: 1;