Mastodon
/
Sengi-Windows-MacOS-Linux
mirror of https://github.com/NicolasConstant/sengi
1
0
Fork 0
Code Issues Releases Wiki Activity

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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/app/components/stream/status/poll/poll.component.html
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>

15
src/app/components/stream/status/poll/poll.component.scss
View File

@ -4,7 +4,7 @@
@import "buttons"; @import "buttons";
.poll { .poll {
color: white; color: white;
color: rgb(228, 228, 228); color: rgb(228, 228, 228);
@ -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;
} }
@ -125,7 +130,7 @@
&__result { &__result {
transition: width 2s; transition: width 2s;
margin: 0 0 5px 5px; margin: 0 0 5px 5px;
padding: 0 5px 0 5px; padding: 0 5px 0 5px;
position: relative; position: relative;
@ -141,15 +146,15 @@
color: white; color: white;
display: inline; display: inline;
margin-right: 10px; margin-right: 10px;
} }
&--progress-bar { &--progress-bar {
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;