2020-01-16 16:38:06 +01:00
|
|
|
<div class="choicebox selection-{{choice.answer}}" ><!-- add .choicebox--active to most voted -->
|
|
|
|
<button
|
|
|
|
class='btn btn--primary'
|
|
|
|
(click)=' choice.simpleAnswer = !choice.simpleAnswer' >
|
|
|
|
<i class='fa fa-gears' ></i >
|
|
|
|
</button >
|
|
|
|
<div
|
|
|
|
class="text title clickable"
|
|
|
|
(click)="setAnswserTo('yes')" >
|
2020-01-15 17:55:22 +01:00
|
|
|
{{choice.name}}
|
2020-01-16 16:38:06 +01:00
|
|
|
</div >
|
2019-10-24 20:51:41 +02:00
|
|
|
|
2020-01-16 16:38:06 +01:00
|
|
|
<div class="choicebox__subject" >
|
2020-01-15 17:55:22 +01:00
|
|
|
|
2019-10-24 20:51:41 +02:00
|
|
|
<!-- TEXT CASE --><!--
|
|
|
|
<p class="choicebox__txt">
|
|
|
|
Lorem ipsum dolor sit amet consectetur, adipisicing elit. Nulla nobis nam culpa !
|
|
|
|
</p>
|
|
|
|
--><!-- TEXT CASE -->
|
|
|
|
|
|
|
|
<!-- IMG CASE --><!--
|
|
|
|
<img class="choicebox__img" src="https://picsum.photos/200" alt="">
|
|
|
|
--><!-- IMG CASE -->
|
|
|
|
|
|
|
|
<!-- DATE CASE -->
|
2020-01-16 16:38:06 +01:00
|
|
|
<div
|
|
|
|
class="dates"
|
|
|
|
*ngIf="choice.date" >
|
|
|
|
<div class="choicebox__date" >
|
2020-01-15 17:55:22 +01:00
|
|
|
{{choice.date | date:'EEE'}} <span
|
2020-01-16 16:38:06 +01:00
|
|
|
class="choicebox__day" >{{choice.date | date:'dd'}}</span > {{choice.date | date:'LLL'}}
|
|
|
|
</div >
|
|
|
|
<div class="choicebox__hour" >
|
2020-01-15 17:55:22 +01:00
|
|
|
08:00
|
2020-01-16 16:38:06 +01:00
|
|
|
</div >
|
|
|
|
</div >
|
2019-10-24 20:51:41 +02:00
|
|
|
<!-- DATE CASE -->
|
|
|
|
|
2020-01-16 16:38:06 +01:00
|
|
|
</div >
|
2019-10-24 20:51:41 +02:00
|
|
|
|
2020-01-16 16:38:06 +01:00
|
|
|
<div class="choicebox__actions" >
|
2019-10-17 21:56:59 +02:00
|
|
|
<!-- show only the yes check if the config is set to simpleAnswer -->
|
2019-10-24 20:51:41 +02:00
|
|
|
<!-- add .choicebox__btn--active to selected <button> -->
|
2020-01-16 16:38:06 +01:00
|
|
|
<span class="simple-answer" >
|
2020-01-15 17:55:22 +01:00
|
|
|
|
2020-01-16 16:38:06 +01:00
|
|
|
<button
|
|
|
|
class="choicebox__btn choicebox__btn--yes"
|
|
|
|
type="button"
|
|
|
|
[ngClass]="{'choicebox__btn--active': choice.answer === 'yes'}"
|
|
|
|
(click)="setAnswserTo('yes')" >
|
|
|
|
<img
|
|
|
|
src="../../../assets/img/check.svg"
|
|
|
|
alt="" >
|
|
|
|
</button >
|
|
|
|
</span >
|
|
|
|
<span
|
|
|
|
class="complex-answers"
|
|
|
|
*ngIf="!choice.simpleAnswer" >
|
|
|
|
<button
|
|
|
|
class="choicebox__btn choicebox__btn--maybe"
|
|
|
|
type="button"
|
|
|
|
[ngClass]="{'choicebox__btn--active': choice.answer === 'maybe'}"
|
|
|
|
(click)="setAnswserTo('maybe')" >
|
|
|
|
<img
|
|
|
|
src="../../../assets/img/check-2.svg"
|
|
|
|
alt="" >
|
|
|
|
</button >
|
|
|
|
<button
|
|
|
|
class="choicebox__btn choicebox__btn--no"
|
|
|
|
type="button"
|
|
|
|
[ngClass]="{'choicebox__btn--active': choice.answer === 'no'}"
|
|
|
|
(click)="setAnswserTo('no')"
|
2020-01-15 17:55:22 +01:00
|
|
|
>
|
2020-01-16 16:38:06 +01:00
|
|
|
<img
|
|
|
|
src="../../../assets/img/croix.svg"
|
|
|
|
alt="" >
|
|
|
|
</button >
|
|
|
|
</span >
|
2020-01-15 17:55:22 +01:00
|
|
|
|
2020-01-16 16:38:06 +01:00
|
|
|
</div >
|
2019-10-24 20:51:41 +02:00
|
|
|
|
2020-01-16 16:38:06 +01:00
|
|
|
<div class="choicebox__count" >
|
|
|
|
<button
|
|
|
|
type="button"
|
|
|
|
aria-describedby="choicebox-tooltip"
|
|
|
|
class="choicebox__votes"
|
|
|
|
*ngIf="choice.votes.count" >
|
|
|
|
<div class="choicebox__vote" >
|
2020-01-15 17:55:22 +01:00
|
|
|
{{choice.votes.count.yes}}
|
2020-01-16 16:38:06 +01:00
|
|
|
<img
|
|
|
|
width="20px"
|
|
|
|
height="21px"
|
|
|
|
src="../../../assets/img/votant-sur.svg"
|
|
|
|
alt="" >
|
|
|
|
</div >
|
|
|
|
<div class="choicebox__vote" >
|
2020-01-15 17:55:22 +01:00
|
|
|
{{choice.votes.count.maybe}}
|
2020-01-16 16:38:06 +01:00
|
|
|
<img
|
|
|
|
width="22px"
|
|
|
|
height="24px"
|
|
|
|
src="../../../assets/img/votant-pas-sur.svg"
|
|
|
|
alt="" >
|
|
|
|
</div >
|
|
|
|
<div
|
|
|
|
class="choicebox__tooltip"
|
|
|
|
id="choicebox-tooltip" >
|
|
|
|
<div class="choicebox__tooltiplist" >
|
|
|
|
<div class="choicebox__tooltipttl" >
|
|
|
|
<img
|
|
|
|
width="20px"
|
|
|
|
height="21px"
|
|
|
|
src="../../../assets/img/votant-sur.svg"
|
|
|
|
alt="" >
|
2020-01-15 17:55:22 +01:00
|
|
|
{{choice.votes.count.yes}} "Oui"
|
2020-01-16 16:38:06 +01:00
|
|
|
</div >
|
|
|
|
<ul >
|
|
|
|
<li >Lorem</li >
|
|
|
|
<li >Ipsum dolor</li >
|
|
|
|
<li >Sit amet</li >
|
|
|
|
<li >Consectetur</li >
|
|
|
|
</ul >
|
|
|
|
</div >
|
|
|
|
<div class="choicebox__tooltiplist" >
|
|
|
|
<div class="choicebox__tooltipttl" >
|
|
|
|
<img
|
|
|
|
width="22px"
|
|
|
|
height="24px"
|
|
|
|
src="../../../assets/img/votant-pas-sur.svg"
|
|
|
|
alt="" >
|
2020-01-15 17:55:22 +01:00
|
|
|
{{choice.votes.count.maybe}} "Peut-être"
|
2020-01-16 16:38:06 +01:00
|
|
|
</div >
|
|
|
|
<ul >
|
|
|
|
<li >Lorem</li >
|
|
|
|
<li >Ipsum dolor</li >
|
|
|
|
<li >Sit amet</li >
|
|
|
|
<li >Consectetur</li >
|
|
|
|
<li >Lorem</li >
|
|
|
|
<li >Ipsum dolor</li >
|
|
|
|
<li >Sit amet</li >
|
|
|
|
<li >Consectetur</li >
|
|
|
|
</ul >
|
|
|
|
</div >
|
|
|
|
</div >
|
|
|
|
</button >
|
|
|
|
<div class="choicebox__countxt" >
|
2019-10-17 21:56:59 +02:00
|
|
|
Choix ayant reçu le plus de votes
|
2020-01-16 16:38:06 +01:00
|
|
|
</div >
|
|
|
|
</div >
|
|
|
|
</div >
|