From 0747d55beeb0d664a0a0eab4a780a8a9133c7cc5 Mon Sep 17 00:00:00 2001
From: Alexis POYEN <apoyen@grandlyon.com>
Date: Thu, 6 Aug 2020 09:54:24 +0200
Subject: [PATCH] UI : get more place for CandidateLists
---
web/components/management/candidate-lists.js | 61 +++++++++++---------
web/style.css | 2 +-
2 files changed, 34 insertions(+), 29 deletions(-)
diff --git a/web/components/management/candidate-lists.js b/web/components/management/candidate-lists.js
index c402261..07b8ca1 100644
--- a/web/components/management/candidate-lists.js
+++ b/web/components/management/candidate-lists.js
@@ -51,9 +51,40 @@ class CandidateList {
</header>
<div id="candidate-lists-dropdown-content" class="columns card-content">
<div class="column">
+ <h5 class="title is-5">
+ Circonscriptions
+ </h5>
<div id="areas-round"></div>
</div>
<div class="column">
+ <nav class="level">
+ <div class="level-left">
+ <h5 class="title is-5">
+ Listes
+ </h5>
+ </div>
+ <div class="level-right">
+ <button
+ id="candidate-list-clone"
+ class="button large-button is-primary"
+ title="Importer une liste"
+ >
+ <span class="icon is-small">
+ <i class="fas fa-download"></i>
+ </span>
+ </button>
+ <button
+ id="candidate-list-new"
+ class="button large-button is-success"
+ title="Ajouter une liste"
+ >
+ <span class="icon is-small">
+ <i class="fas fa-plus"></i>
+ </span>
+ </button>
+ </div>
+ </nav>
+
<div id="candidate-lists-list"></div>
</div>
<div class="column is-two-thirds">
@@ -405,11 +436,7 @@ class CandidateList {
}
async displayAreas() {
- document.getElementById("areas-round").innerHTML = /* HTML */ `<h5
- class="title is-5"
- >
- Circonscriptions
- </h5>`;
+ document.getElementById("areas-round").innerHTML = /* HTML */ ``;
let candidateListHandler = this;
let areas = await this.updateAreas();
const markup = areas.map((area) => this.areaTemplate(area)).join("");
@@ -468,29 +495,7 @@ class CandidateList {
async displayCandidateLists() {
let candidateListHandler = this;
let candidateLists = await this.updateCandidateLists();
- document.getElementById("candidate-lists-list").innerHTML = /* HTML */ `<h5
- class="title is-5"
- >
- Listes
- </h5>
- <button
- id="candidate-list-new"
- class="button large-button is-success"
- title="Ajouter une liste"
- >
- <span class="icon is-small">
- <i class="fas fa-plus"></i>
- </span>
- </button>
- <button
- id="candidate-list-clone"
- class="button large-button is-primary"
- title="Importer une liste"
- >
- <span class="icon is-small">
- <i class="fas fa-download"></i>
- </span>
- </button>`;
+ document.getElementById("candidate-lists-list").innerHTML = /* HTML */ ``;
const markup = candidateLists
.map((candidateList) => this.candidateListTemplate(candidateList))
.join("");
diff --git a/web/style.css b/web/style.css
index 56fdee4..afdce6f 100644
--- a/web/style.css
+++ b/web/style.css
@@ -107,7 +107,7 @@ select {
}
.card-content .level-left {
- flex-basis: 70%;
+ flex-basis: 65%;
}
#vote-section .level-left {
--
GitLab