funky-framadate-front/src/app/pages/answers/answers.component.html

102 lines
2.9 KiB
HTML

<div class="answers" >
<h1 i18n >
Choisir les propositions
</h1 >
<p
class="subtitle"
i18n >
Vous pouvez utiliser la syntaxe markdown, et naviguer entre les inputs avec les flèches du clavier.
</p >
<ol >
<li
#answers
*ngFor="let answer of config.answers; index as i;trackBy trackFunction"
class="answer-item" >
<button
class='btn btn--default'
title='ajouter une image'
(click)='showModalForPictureOfAnswer(answer)' >
<i class='fa fa-image' ></i >
</button >
<label
for='answer_{{answer.id}}_url'
(click)='showModalForPictureOfAnswer(answer)' >
<img
class='img-thumbnail'
src='{{answer.url}}'
alt='image {{answer.url}}' >
</label >
<p-dialog
class='url-dialog'
[(visible)]="display"
[modal]='true' >
<p-header >
{{answer.text}}
</p-header >
<form
action='#'
(submit)='display=false' >
<label for='answer_{{answer.id}}_url' >
Choisissez une URL pour illustrer le choix de réponse
</label >
<i class='fa fa-image' ></i >
<br >
<input
class='input is-block'
id='answer_{{answer.id}}_url'
type='text'
autofocus='autofocus'
name='answer-url'
[(ngModel)]='answer.url' >
</form >
</p-dialog >
<input
type="name"
class="answer"
id='answer_{{answer.id}}'
[(ngModel)]="answer.text"
(keyup.enter)="addAnswer()"
(keyup)="navigateOrDelete($event,i)"
required='required'
placeholder="réponse"
>
<button
class="btn btn--alert"
(click)="config.answers.splice(i,1)" >X
</button >
</li >
</ol >
<button
class="btn btn--primary btn--outline"
(click)="addAnswer()"
[ngClass]="{'btn--primary': allAnswersAreValid}"
i18n
>
<i class='fa fa-plus' ></i >
Ajouter une proposition
</button >
<br >
<button
[routerLink]="'/step/resume'"
class="btn btn--full "
i18n
[ngClass]="{'btn--primary': allAnswersAreValid}"
[disabled]='!allAnswersAreValid'
>
Voyons ce que ça donne
</button >
<br >
<a
class="prev"
i18n >
Retour
</a >
</div >