funky-framadate-front/src/app/features/consultation/consultation.component.html

<section class="loading_poll" *ngIf="fetching"></section>
<section class="poll_loaded padded" *ngIf="!fetching && poll">
	<div class="well debug">
		<!--	infos locales storage-->
	</div>

	<!--	messages-->

	<article class="message is-warning" *ngIf="isArchived">
		<div class="message-body">
			⚰️ Ce sondage a expiré, il n'est plus possible d'y ajouter de votes ou de commentaires
		</div>
	</article>
	<article class="message is-info" *ngIf="poll.stacks.length == 0">
		<div class="message-body">
			aucun vote pour le moment
		</div>
	</article>
	<article class="message is-info" *ngIf="poll.modification_policy == 'self'">
		<div class="message-body">
			Vous ne pouvez modifier que votre propre vote à ce sondage
		</div>
	</article>

	<!--	actions-->

	<div id="export_and_share">
		<div class="sharing" *ngIf="poll">
			<h3 class="margin-top-x8">
				Partager le sondage

				<i class="fa fa-share" aria-hidden="true"></i>
			</h3>
			<p class="nobold text-14" for="copyLink">
				Pour partager le sondage, vous pouvez diffuser ce lien :
				<a href="{{ poll.urlPublic }}">
					{{ poll.urlPublic }}
				</a>
			</p>

			<app-copy-text [textToCopy]="poll.urlPublic"></app-copy-text>
			<h3 class="margin-top-x6 margin-btm-x3">
				Exporter/Imprimer
			</h3>
			<button class="replicate export-csv btn" (click)="duplicate()">
				<i class="fa fa-copy" aria-hidden="true"></i>
				Dupliquer
			</button>
			<button class="export export-csv btn" (click)="exportCSV()">
				<i class="fa fa-file-calc-o" aria-hidden="true"></i>
				Exporter en .csv
			</button>
			<button class="export export-json btn" (click)="exportJson()">
				<i class="fa fa-file-archive-o" aria-hidden="true"></i>
				export json
			</button>
			<button class="export export-print btn" (click)="print()">
				<i class="fa fa-print"></i>
				Imprimer le sondage
			</button>
		</div>
	</div>
	<!--	affichage des possibilités de réponse -->
	<div class="columns">
		<div class="column">
			<div class="card">
				<header class="card-header">
					<p class="card-header-title is-1 title">{{ poll.title }}</p>
					<!--				<p class="card-header-icon">author : {{ poll.owner?.pseudo }}</p>-->
				</header>

				<div class="card-content">
					<div class="content">
						<p class="descr">{{ poll.description }}</p>
						<button
							class="btn is-info"
							(click)="isCompactMode = !isCompactMode"
							[ngClass]="{ 'is-primary': isCompactMode, 'is-default': !isCompactMode }"
						>
							changer d'affichage
						</button>
						<div class="buttons has-addons is-small is-right">
							<button class="button" [class.is-active]="isCompactMode" (click)="isCompactMode = true">
								Compact
							</button>
							<button class="button" [class.is-active]="!isCompactMode" (click)="isCompactMode = false">
								Detailed
							</button>
						</div>
						<app-poll-results-compact *ngIf="isCompactMode" [poll]="poll"></app-poll-results-compact>
						<app-poll-results-detailed *ngIf="!isCompactMode" [poll]="poll"></app-poll-results-detailed>
					</div>
				</div>
				<div class="columns">
					<div class="column">
						<app-comments [poll]="poll" [vote_stack]="storageService.vote_stack"></app-comments>
					</div>
				</div>

				<div class="bar-votestack" *ngIf="!isArchived">
					<button
						class="btn btn-block submit-votestack"
						(click)="addVoteStack()"
						[disabled]="!myTempVoteStack"
						[ngClass]="{ 'btn--primary': myTempVoteStack }"
						*ngIf="!storageService.vote_stack || !storageService.vote_stack.id"
					>
						<i class="fa fa-paper-plane" aria-hidden="true"></i> Envoyer
					</button>
					<button
						class="btn btn--primary btn-block submit-votestack update"
						(click)="updateVoteStack(storageService.vote_stack)"
						*ngIf="storageService.vote_stack && storageService.vote_stack.id"
					>
						<i class="fa fa-edit" aria-hidden="true"></i> Mettre à jour
					</button>
				</div>

				<footer class="card-footer" *ngIf="!isArchived">
					TODO links
				</footer>
			</div>
		</div>
	</div>
</section>