funky-framadate-front/src/app/shared/components/comments/comments.component.html

84 lines
2.4 KiB
HTML

<div class="comments padded" id="comments">
<section class="add-comment" *ngIf="!poll.is_archived">
<h2 class="margin-top-x7">Laisser un commentaire</h2>
<article class="message">
<div class="message-header">
<div class="field">
<span class="control has-icons-left has-icons-right">
<input
type="email"
name="cremail"
id="email_comment"
[(ngModel)]="config.myEmail"
placeholder="chuck@norris.com"
required="required"
/>
<span class="icon is-small is-left">
<i class="fa fa-envelope"></i>
</span>
</span>
<span class="control has-icons-left">
<input
type="text"
class="margin-btm-x3"
name="crname"
[(ngModel)]="config.myName"
id="crname"
placeholder="pseudo"
required="required"
/>
<span class="icon is-small is-left">
<i class="fa fa-user"></i>
</span>
</span>
</div>
<!-- <label for="crname"><i class="fa fa-user" aria-hidden="true"></i> Votre nom / pseudo :</label>-->
<!-- <label for="cremail"><i class="fa fa-envelope" aria-hidden="true"></i> Votre email :</label>-->
</div>
<div class="message-body">
<label for="comment">Votre commentaire :</label>
<br />
<textarea name="comment" id="comment" [(ngModel)]="config.myComment"> </textarea>
<input
type="submit"
name="add-comment"
class="btn btn--primary btn--outline"
value="Ajouter mon commentaire ✉️"
(click)="addComment()"
/>
</div>
</article>
</section>
<div class="message-body" *ngIf="poll.is_archived">
⚰️ Ce sondage a expiré, il n'est plus possible d'y ajouter de votes ou de commentaires
</div>
<section class="comments-part" *ngIf="poll && poll.comments">
<h2 class="title is-2">
<i class="fa fa-comment"></i>
{{ poll.comments.length }} Commentaires
</h2>
<article class="message" *ngFor="let comment of poll.comments">
<div class="message-header">
<p>
<em class="cname"> {{ comment.pseudo }} </em>,
<span class="date-days-ago is-small">
il y a
{{ calculateDaysAgoOfComment(comment.date.date) }} jours, le </span
><span class="date is-small"> {{ comment.date.date }} </span>
</p>
</div>
<div class="message-body">
<p class="text">
{{ comment.text }}
</p>
</div>
</article>
</section>
</div>