funky-framadate-front/mocks/old-stuff/pages/answers/answers.component.html

77 lines
2.0 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" aria-hidden="true"></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" aria-hidden="true"></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" aria-hidden="true"></i>
Ajouter une proposition
</button>
<br />
<button
routerLink="../resume"
class="btn btn--full"
i18n
[ngClass]="{ 'btn--primary': allAnswersAreValid }"
[disabled]="!allAnswersAreValid"
>
Voyons ce que ça donne
</button>
<br />
<a routerLink="./../home" class="prev" i18n>
Retour
</a>
</div>