From c6861d16902756adee459c17de2ecc6ea2c9fe2a Mon Sep 17 00:00:00 2001
From: Tykayn <contact@cipherbliss.com>
Date: Tue, 22 Mar 2022 10:31:05 +0100
Subject: [PATCH] put correct icons in participation vote, add dropdown on
 option button

---
 .../actions-menu/actions-menu.component.html  | 14 +++-----
 .../actions-menu/actions-menu.component.scss  | 15 +++++++++
 .../actions-menu/actions-menu.component.ts    |  2 +-
 .../consultation/consultation.component.html  | 32 +++++++++----------
 .../consultation/consultation.component.scss  |  3 +-
 .../participation.component.html              |  2 +-
 src/styles/dev-utilities/_helpers.scss        |  6 ++--
 7 files changed, 43 insertions(+), 31 deletions(-)

diff --git a/src/app/features/administration/actions-menu/actions-menu.component.html b/src/app/features/administration/actions-menu/actions-menu.component.html
index 0d8f9175..f3e4883b 100644
--- a/src/app/features/administration/actions-menu/actions-menu.component.html
+++ b/src/app/features/administration/actions-menu/actions-menu.component.html
@@ -1,21 +1,17 @@
-<div class="actions">
-	<button class="button" (click)="displayMenu = false">
-		{{ 'SENTENCES.Close' | translate }}
-		<i class="fa fa-times"></i>
-	</button>
-	<button class="export export-print btn" (click)="print()">
+<div class="actions-menu">
+	<button class="export export-print button is-secondary" (click)="print()">
 		<i class="fa fa-print"></i>
 		{{ 'participation.modal.options.print' | translate }}
 	</button>
-	<button class="export export-csv btn" (click)="exportCSV()">
+	<button class="export export-csv button is-secondary" (click)="exportCSV()">
 		<i class="fa fa-file-calc-o" aria-hidden="true"></i>
 		{{ 'participation.modal.options.export_csv' | translate }}
 	</button>
-	<button class="export export-json btn" (click)="exportJson()">
+	<button class="export export-json button is-secondary" (click)="exportJson()">
 		<i class="fa fa-file-archive-o" aria-hidden="true"></i>
 		JSON
 	</button>
-	<button class="replicate duplicate btn" (click)="duplicate()">
+	<button class="replicate duplicate button is-secondary" (click)="duplicate()">
 		<i class="fa fa-copy" aria-hidden="true"></i>
 		{{ 'success.copy' | translate }}
 	</button>
diff --git a/src/app/features/administration/actions-menu/actions-menu.component.scss b/src/app/features/administration/actions-menu/actions-menu.component.scss
index e69de29b..6b01bd47 100644
--- a/src/app/features/administration/actions-menu/actions-menu.component.scss
+++ b/src/app/features/administration/actions-menu/actions-menu.component.scss
@@ -0,0 +1,15 @@
+.actions-menu {
+	background: white;
+	padding: 1rem;
+	border-radius: 8px;
+	border: solid 1px #ccc;
+	position: relative;
+	z-index: 10;
+	margin-top: 4rem;
+	margin-bottom: 1rem;
+	.button {
+		margin-right: 1ch;
+		margin-bottom: 1ch;
+		width: 100%;
+	}
+}
diff --git a/src/app/features/administration/actions-menu/actions-menu.component.ts b/src/app/features/administration/actions-menu/actions-menu.component.ts
index 33bf5277..3136512d 100644
--- a/src/app/features/administration/actions-menu/actions-menu.component.ts
+++ b/src/app/features/administration/actions-menu/actions-menu.component.ts
@@ -14,7 +14,7 @@ import { ConfirmationService } from 'primeng/api';
 	styleUrls: ['./actions-menu.component.scss'],
 })
 export class ActionsMenuComponent implements OnInit {
-	@Input() displayMenu = false;
+	@Input() displayMenu: boolean;
 
 	constructor(
 		private router: Router,
diff --git a/src/app/features/consultation/consultation.component.html b/src/app/features/consultation/consultation.component.html
index 6cebcb98..39b483e4 100644
--- a/src/app/features/consultation/consultation.component.html
+++ b/src/app/features/consultation/consultation.component.html
@@ -3,9 +3,9 @@
 <section class="poll_loaded padded consultation" *ngIf="!fetching && poll">
 	<div class="step contained-in-large-column">
 		<div class="rounded-block admin-share-link" *ngIf="poll.admin_key || show_admin_stuff">
-			<h2 class="title is-2">
+			<h1 class="title is-2">
 				{{ 'participation.share_title' | translate }}
-			</h2>
+			</h1>
 			<p class="description">
 				{{ 'participation.share_description' | translate }}
 			</p>
@@ -22,24 +22,24 @@
 			</div>
 		</div>
 		<section class="main-title-poll rounded-block">
-			<div class="columns">
-				<div class="column">
-					<h2 class="title is-2">
-						{{ poll.title }}
-					</h2>
-				</div>
-				<div class="columns">
-					<button class="options-button pull-right" (click)="displayOptions()">
-						{{ 'participation.menu_label' | translate }}
-						<i class="fa fa-chevron-down"></i>
-					</button>
-				</div>
-			</div>
+			<h2 class="title is-2">
+				{{ poll.title }}
+			</h2>
+
+			<button
+				class="pull-right button is-action"
+				(click)="displayOptions()"
+				[ngClass]="{ 'is-active': display_options_menu }"
+			>
+				{{ 'participation.menu_label' | translate }}
+				<i class="fa fa-chevron-down"></i>
+			</button>
+			<app-actions-menu [displayMenu]="display_options_menu" *ngIf="display_options_menu"></app-actions-menu>
 
 			<p class="description">
 				{{ poll.description }}
 			</p>
-			<app-actions-menu [displayMenu]="display_options_menu" *ngIf="display_options_menu"></app-actions-menu>
+
 			<button
 				class="vote-button is-primary button"
 				*ngIf="poll.votes_allowed"
diff --git a/src/app/features/consultation/consultation.component.scss b/src/app/features/consultation/consultation.component.scss
index 80f7d287..0ea6ca7c 100644
--- a/src/app/features/consultation/consultation.component.scss
+++ b/src/app/features/consultation/consultation.component.scss
@@ -15,5 +15,6 @@
 	background: transparent;
 }
 .vote-button {
-	margin-right: 2rem;
+	margin-right: 1ch;
+	margin-bottom: 1ch;
 }
diff --git a/src/app/features/participation/participation.component.html b/src/app/features/participation/participation.component.html
index 09b7ba7e..1c881fa4 100644
--- a/src/app/features/participation/participation.component.html
+++ b/src/app/features/participation/participation.component.html
@@ -1,6 +1,6 @@
 <div class="columns">
 	<div class="column has-text-centered">
-		<h1>Participation</h1>
+		<h1 class="title is-1">Participation</h1>
 	</div>
 </div>
 
diff --git a/src/styles/dev-utilities/_helpers.scss b/src/styles/dev-utilities/_helpers.scss
index c9b6177e..261d3d65 100644
--- a/src/styles/dev-utilities/_helpers.scss
+++ b/src/styles/dev-utilities/_helpers.scss
@@ -127,13 +127,13 @@
 }
 
 .has-background-answer-YES {
-	background: url('/assets/icons/plus-circle.svg') no-repeat 28px center;
+	background: url('/assets/icons/advanced/yes.svg') no-repeat 28px center;
 }
 .has-background-answer-MAYBE {
-	background: url('/assets/icons/help-circle.svg') no-repeat 28px center;
+	background: url('/assets/icons/advanced/maybe.svg') no-repeat 28px center;
 }
 .has-background-answer-NO {
-	background: url('/assets/icons/x.svg') no-repeat 28px center;
+	background: url('/assets/icons/advanced/no.svg') no-repeat 28px center;
 }
 
 .has-background-link-icon {