fix poll display

This commit is contained in:
Nicolas Constant 2019-06-15 14:58:24 -04:00
parent 6e2bb144fc
commit fdd9d751e7
No known key found for this signature in database
GPG Key ID: 1E9F677FB01A5688
2 changed files with 13 additions and 7 deletions

View File

@ -1,7 +1,8 @@
<div class="poll"> <div class="poll">
<div *ngIf="!poll.voted && !poll.expired"> <div *ngIf="!poll.voted && !poll.expired">
<div *ngFor="let o of options"> <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}}" <input class="poll__container__input" type="{{choiceType}}" name="{{pollName}}" value="{{o.title}}"
(change)="onSelectionChange(o)"> (change)="onSelectionChange(o)">
<span class="poll__container__checkmark" *ngIf="!pollLocked" <span class="poll__container__checkmark" *ngIf="!pollLocked"
@ -15,7 +16,7 @@
<div class="poll__result" title="{{ o.votes_count }} votes"> <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--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> <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>
</div> </div>

View File

@ -44,6 +44,11 @@
-ms-user-select: none; -ms-user-select: none;
user-select: none; user-select: none;
&__title {
text-overflow: ellipsis;
white-space: nowrap;
}
&:hover &__input~&__checkmark { &:hover &__input~&__checkmark {
background-color: #ccc; background-color: #ccc;
} }
@ -148,8 +153,8 @@
position: absolute; position: absolute;
background-color: rgb(47, 68, 100); background-color: rgb(47, 68, 100);
// background-color: rgb(43, 62, 92); // background-color: rgb(43, 62, 92);
top:0; top: 0;
left:0; left: 0;
width: calc(100%); width: calc(100%);
height: 22px; height: 22px;
z-index: 1; z-index: 1;