This is an automated email from the git hooks/post-receive script. New commit to branch develop in repository pollen. See https://gitlab.nuiton.org/chorem/pollen.git commit 104bfed267fea9412d6cffb902311f462577e4f5 Author: Kevin Morin <morin@codelutin.com> Date: Mon Sep 11 16:05:35 2017 +0200 Les textes débordent en dessous des cases de résultat quand l'écran est trop petit --- .../src/main/web/tag/poll/Choices.tag.html | 6 +- .../voteCountingType/BordaDetailResult.tag.html | 95 +++++++--------------- .../CondorcetDetailResult.tag.html | 77 ++++++------------ .../voteCountingType/CoombsDetailResult.tag.html | 91 +++++++++------------ .../InstantRunoffDetailResult.tag.html | 69 ++++------------ 5 files changed, 114 insertions(+), 224 deletions(-) diff --git a/pollen-ui-riot-js/src/main/web/tag/poll/Choices.tag.html b/pollen-ui-riot-js/src/main/web/tag/poll/Choices.tag.html index 2c07a18c..04ffe3d5 100644 --- a/pollen-ui-riot-js/src/main/web/tag/poll/Choices.tag.html +++ b/pollen-ui-riot-js/src/main/web/tag/poll/Choices.tag.html @@ -8,13 +8,13 @@ require("./Choice.tag.html"); <Choice ref="choice" class="choice c-field" name={"choice" + index} - disabled={form.hasVotes} + disabled={form.hasVotes || form.model.closed} choice="{choice}"/> </div> <button type="button" class="c-button c-button--ghost-error" show={!form.hasVotes} - disabled={form.hasVotes} + disabled={form.hasVotes || form.model.closed} onclick="{removeChoice(index)}"> <i class="fa fa-trash"/> </button> @@ -25,7 +25,7 @@ require("./Choice.tag.html"); <button type="button" class="c-button c-button--brand u-small" show={!form.hasVotes} - disabled={form.hasVotes} + disabled={form.hasVotes || form.model.closed} onclick="{addOneChoice}"> <i class="fa fa-plus"/> {__.moreChoice} </button> diff --git a/pollen-ui-riot-js/src/main/web/tag/voteCountingType/BordaDetailResult.tag.html b/pollen-ui-riot-js/src/main/web/tag/voteCountingType/BordaDetailResult.tag.html index 1a84123e..fa0a5a13 100644 --- a/pollen-ui-riot-js/src/main/web/tag/voteCountingType/BordaDetailResult.tag.html +++ b/pollen-ui-riot-js/src/main/web/tag/voteCountingType/BordaDetailResult.tag.html @@ -1,40 +1,34 @@ require("../poll/ChoiceView.tag.html"); <BordaDetailResult> <h3 class="c-heading">{__.title}</h3> - <div class="ranks"> - <div class="choices"> - <div class="cell separator-right">{__.ranks}</div> - <div class="cell separator-right separator-top">{__.points}</div> - <div each={choice in poll.choices} class="cell separator-top separator-right"> - <ChoiceView choice={choice} center="true"/> - </div> - </div> - <div class="window"> - <div class="frame"> - <div class="rank separator-right" each={rank in Array.from(Array(poll.choices.length).keys())}> - <div class="cell"> - {rank + 1} - </div> - <div class="cell separator-top"> - {poll.choices.length - rank} - </div> - <div each={choice in poll.choices} class="cell separator-top"> - {getRankScore(choice, rank)} - </div> - </div> - <div class="rank score"> - <div class="cell"> </div> - <div class="cell"> - {__.total} - </div> - <div each={choice in poll.choices} class="cell separator-top"> - {getScore(choice)} - </div> - </div> - </div> - </div> - </div> + <table class="ranks"> + <tr> + <td class="cell">{__.ranks}</td> + <td class="cell rank" each={rank in Array.from(Array(poll.choices.length).keys())}> + {rank + 1} + </td> + <td class="cell"></td> + </tr> + <tr> + <td class="cell separator-top">{__.points}</td> + <td class="cell separator-top" each={rank in Array.from(Array(poll.choices.length).keys())}> + {poll.choices.length - rank} + </td> + <td class="cell score">{__.total}</td> + </tr> + <tr each={choice in poll.choices}> + <td class="cell separator-top"> + <ChoiceView choice={choice} center="true"/> + </td> + <td class="cell separator-top" each={rank in Array.from(Array(poll.choices.length).keys())}> + {getRankScore(choice, rank)} + </td> + <td class="cell separator-top score"> + {getScore(choice)} + </td> + </tr> + </table> <script type="es6"> let session = require("../../js/Session"); @@ -71,42 +65,13 @@ require("../poll/ChoiceView.tag.html"); } .ranks { - display: flex; - flex-direction: row; - flex-wrap: nowrap; - justify-content: center; - align-items: stretch; - margin-top: 20px; - - } - - .choices, - .rank { - min-width: 100px; - } - - .choices { - flex-grow: 0 + margin: 10px auto 0; + border-collapse : collapse; } .cell { text-align: center; - padding: 3px 0; - height: 1.5em - } - - .window { - overflow-x: auto; - overflow-y: hidden; - } - - .window .frame { - display: flex; - flex-direction: row; - flex-wrap: nowrap; - justify-content: flex-start; - align-items: stretch; - height: 100%; + padding: 3px 20px; } .score { diff --git a/pollen-ui-riot-js/src/main/web/tag/voteCountingType/CondorcetDetailResult.tag.html b/pollen-ui-riot-js/src/main/web/tag/voteCountingType/CondorcetDetailResult.tag.html index f84f049b..a335cb9f 100644 --- a/pollen-ui-riot-js/src/main/web/tag/voteCountingType/CondorcetDetailResult.tag.html +++ b/pollen-ui-riot-js/src/main/web/tag/voteCountingType/CondorcetDetailResult.tag.html @@ -1,30 +1,30 @@ require("../poll/ChoiceView.tag.html"); <CondorcetDetailResult> <h3 class="c-heading">{__.title}</h3> - <div class="battles"> - <div class="runners"> - <div class="cell separator-right"></div> - <div each={runner in poll.choices} class="cell separator-top separator-right"> + <table class="battles"> + <tr> + <td class="cell runners"></td> + <td class="cell opponent" each={opponent in poll.choices}> + <ChoiceView choice={opponent} center="true"/> + </td> + </tr> + <tr each={runner in poll.choices}> + <td class="cell separator-top"> <ChoiceView choice={runner} center="true"/> - </div> - <div class="cell separator-top separator-right score">{__.total}</div> - </div> - <div class="window"> - <div class="frame"> - <div class="opponent separator-right" each={opponent in poll.choices}> - <div class="cell"> - <ChoiceView choice={opponent} center="true"/> - </div> - <div each={runner in poll.choices} class="cell separator-top"> - {getBattleScore(opponent, runner)} - </div> - <div class="cell separator-top score"> - {getScore(opponent)} - </div> - </div> - </div> - </div> - </div> + </td> + <td each={opponent in poll.choices} class="cell separator-top"> + {getBattleScore(opponent, runner)} + </td> + </tr> + <tr> + <td class="cell separator-top score"> + {__.total} + </td> + <td each={opponent in poll.choices} class="cell separator-top score"> + {getScore(opponent)} + </td> + </tr> + </table> <script type="es6"> let session = require("../../js/Session"); @@ -64,18 +64,8 @@ require("../poll/ChoiceView.tag.html"); } .battles { - display: flex; - flex-direction: row; - flex-wrap: nowrap; - justify-content: center; - align-items: stretch; - margin-top: 20px; - - } - - .runners, - .opponent { - min-width: 100px; + margin: 10px auto 0; + border-collapse: collapse; } .runners { @@ -84,22 +74,7 @@ require("../poll/ChoiceView.tag.html"); .cell { text-align: center; - padding: 3px 0; - height: 1.5em - } - - .window { - overflow-x: auto; - overflow-y: hidden; - } - - .window .frame { - display: flex; - flex-direction: row; - flex-wrap: nowrap; - justify-content: flex-start; - align-items: stretch; - height: 100%; + padding: 3px 10px; } .score { diff --git a/pollen-ui-riot-js/src/main/web/tag/voteCountingType/CoombsDetailResult.tag.html b/pollen-ui-riot-js/src/main/web/tag/voteCountingType/CoombsDetailResult.tag.html index 47712009..aa12dd78 100644 --- a/pollen-ui-riot-js/src/main/web/tag/voteCountingType/CoombsDetailResult.tag.html +++ b/pollen-ui-riot-js/src/main/web/tag/voteCountingType/CoombsDetailResult.tag.html @@ -1,41 +1,53 @@ require("../poll/ChoiceView.tag.html"); <CoombsDetailResult> <h3 class="c-heading">{__.title}</h3> - <div class="rounds"> - <div class="choices"> - <div class="cell separator-right">{__.rounds}</div> - <div class="cell separator-top separator-right">{__.ranks}</div> - <div each={choice in poll.choices} class="cell separator-top separator-right"> - <ChoiceView choice={choice} center="true"/> - </div> - </div> - <div class="window"> - <div class="frame"> - <div class="round separator-right" each={round, index in ((poll.results && poll.results.detail && poll.results.detail.rounds) || [])}> + <table class="rounds"> + <tr> + <td class="cell">{__.rounds}</td> + <td class="cell" each={round, index in rounds}> + {index + 1} + </td> + </tr> + <tr> + <td class="cell separator-top">{__.ranks}</td> + <td class="separator-top" each={round in rounds}> + <div class="cell2"> <div class="cell"> - {index + 1} + {parent.__.firstRank} </div> - <div class="cell2"> - <div class="cell separator-top separator-right">{parent.__.firstRank}</div> - <div class="cell separator-top">{parent.__.lastRank}</div> + <div class="cell"> + {parent.__.lastRank} </div> - - <div each={choice in poll.choices} class="cell2 {eliminate: isExclude(choice, round)}"> - <div class="cell separator-top separator-right">{getRoundFirstScore(choice, round)}</div> - <div class="cell separator-top">{getRoundLastScore(choice, round)}</div> + </div> + </td> + </tr> + <tr each={choice in poll.choices}> + <td class="cell separator-top"> + <ChoiceView choice={choice} center="true"/> + </td> + <td class="separator-top" each={round in rounds}> + <div class="cell2"> + <div class="cell {eliminate: isExclude(choice, round)}"> + {getRoundFirstScore(choice, round)} + </div> + <div class="cell {eliminate: isExclude(choice, round)}"> + {getRoundLastScore(choice, round)} </div> </div> - </div> - </div> - </div> + </td> + </tr> + </table> <script type="es6"> let session = require("../../js/Session"); this.installBundle(session, "poll_results_coombs"); this.poll = require("../../js/Poll.js"); + this.rounds = []; + this.onPollChange = poll => { this.poll = poll; + this.rounds = (poll.results && poll.results.detail && poll.results.detail.rounds) || []; this.update(); }; @@ -67,28 +79,13 @@ require("../poll/ChoiceView.tag.html"); } .rounds { - display: flex; - flex-direction: row; - flex-wrap: nowrap; - justify-content: center; - align-items: stretch; - margin-top: 20px; - - } - - .choices, - .round { - min-width: 100px; - } - - .choices { - flex-grow: 0 + margin: 10px auto 0; + border-collapse: collapse; } .cell { text-align: center; - padding: 3px 0; - height: 1.5em + padding: 3px 10px; } .cell2 { @@ -100,20 +97,6 @@ require("../poll/ChoiceView.tag.html"); width: 50% } - .window { - overflow-x: auto; - overflow-y: hidden; - } - - .window .frame { - display: flex; - flex-direction: row; - flex-wrap: nowrap; - justify-content: flex-start; - align-items: stretch; - height: 100%; - } - .eliminate { text-decoration: line-through; } diff --git a/pollen-ui-riot-js/src/main/web/tag/voteCountingType/InstantRunoffDetailResult.tag.html b/pollen-ui-riot-js/src/main/web/tag/voteCountingType/InstantRunoffDetailResult.tag.html index 1be16270..264d5564 100644 --- a/pollen-ui-riot-js/src/main/web/tag/voteCountingType/InstantRunoffDetailResult.tag.html +++ b/pollen-ui-riot-js/src/main/web/tag/voteCountingType/InstantRunoffDetailResult.tag.html @@ -1,26 +1,22 @@ require("../poll/ChoiceView.tag.html"); <InstantRunoffDetailResult> <h3 class="c-heading">{__.title}</h3> - <div class="rounds"> - <div class="choices"> - <div class="cell separator-right">{__.rounds}</div> - <div each={choice in poll.choices} class="cell separator-top separator-right"> + <table class="rounds"> + <tr> + <td class="cell">{__.rounds}</td> + <td class="cell" each={round, index in poll.results.detail.rounds}> + {index + 1} + </td> + </tr> + <tr each={choice in poll.choices}> + <td class="cell separator-top"> <ChoiceView choice={choice} center="true"/> - </div> - </div> - <div class="window"> - <div class="frame"> - <div class="round separator-right" each={round, index in poll.results.detail.rounds}> - <div class="cell"> - {index + 1} - </div> - <div each={choice in poll.choices} class="cell separator-top {eliminate: isExclude(choice, round)}"> - {getRoundScore(choice, round)} - </div> - </div> - </div> - </div> - </div> + </td> + <td class="cell separator-top {eliminate: isExclude(choice, round)}" each={round in poll.results.detail.rounds}> + {getRoundScore(choice, round)} + </td> + </tr> + </table> <script type="es6"> let session = require("../../js/Session"); @@ -55,42 +51,13 @@ require("../poll/ChoiceView.tag.html"); } .rounds { - display: flex; - flex-direction: row; - flex-wrap: nowrap; - justify-content: center; - align-items: stretch; - margin-top: 20px; - - } - - .choices, - .round { - min-width: 100px; - } - - .choices { - flex-grow: 0 + margin: 10px auto 0; + border-collapse: collapse; } .cell { text-align: center; - padding: 3px 0; - height: 1.5em - } - - .window { - overflow-x: auto; - overflow-y: hidden; - } - - .window .frame { - display: flex; - flex-direction: row; - flex-wrap: nowrap; - justify-content: flex-start; - align-items: stretch; - height: 100%; + padding: 3px 15px; } .eliminate { -- To stop receiving notification emails like this one, please contact chorem.org SCM administrator <admin+scm@chorem.org>.