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 706e6d035dc825de4fd5e8a301c10f0aa3b471e2 Author: Sylvain Bavencoff <bavencoff@codelutin.com> Date: Wed Mar 29 11:22:12 2017 +0200 un peu de style sur les choix, podium et votes utilisation du bus pour la touche "Echape" --- pollen-ui-riot-js/src/main/web/tag/Pollen.tag.html | 6 ++++++ .../src/main/web/tag/poll/ChoiceView.tag.html | 25 +++++++++++++++++++--- .../src/main/web/tag/poll/Podium.tag.html | 23 +++++++++++--------- .../src/main/web/tag/poll/Votes.tag.html | 2 ++ 4 files changed, 43 insertions(+), 13 deletions(-) diff --git a/pollen-ui-riot-js/src/main/web/tag/Pollen.tag.html b/pollen-ui-riot-js/src/main/web/tag/Pollen.tag.html index ca4e7a7..b9c8a4e 100644 --- a/pollen-ui-riot-js/src/main/web/tag/Pollen.tag.html +++ b/pollen-ui-riot-js/src/main/web/tag/Pollen.tag.html @@ -162,5 +162,11 @@ require("./UserProfile.tag.html"); route("signin?url=" + window.location.hash.substring(1)); }); + window.onkeydown = e => { + if (e.keyCode === 27) { + this.bus.trigger("escape"); + } + }; + </script> </Pollen> diff --git a/pollen-ui-riot-js/src/main/web/tag/poll/ChoiceView.tag.html b/pollen-ui-riot-js/src/main/web/tag/poll/ChoiceView.tag.html index f18319e..437f1ee 100644 --- a/pollen-ui-riot-js/src/main/web/tag/poll/ChoiceView.tag.html +++ b/pollen-ui-riot-js/src/main/web/tag/poll/ChoiceView.tag.html @@ -1,5 +1,5 @@ <ChoiceView> - <div class="choice-view" + <div class="choice-view {with-info : opts.choice.choiceType === 'RESOURCE' || opts.choice.description}" onclick={openModalImage} title={opts.choice.description}> <span class="choice-text" @@ -23,7 +23,7 @@ </div> </div> - <div if={showModalImage} onclick={closeModalImage}> + <div if={showModalImage} onclick={closeModalImage} onkeydown={keyDown}> <div class="c-overlay"></div> <div class="modal-image o-modal"> <div class="c-card"> @@ -61,6 +61,21 @@ this.closeModalImage = () => { this.showModalImage = false; }; + + this.onEscape = () => { + if (this.showModalImage) { + this.closeModalImage(); + this.update(); + } + }; + + this.bus.on("escape", this.onEscape); + + this.on("before-unmount", () => { + this.bus.off("escape", this.onEscape); + }); + + </script> <style> @@ -69,13 +84,17 @@ justify-content: center; } + .choice-view.with-info { + cursor: pointer; + } + .choice-view .info { font-size: 0.5em; color: #13a2ff; } .choice-ressource .image-preview{ - height: 1.5em; + height: 1.3em; } .modal-image { diff --git a/pollen-ui-riot-js/src/main/web/tag/poll/Podium.tag.html b/pollen-ui-riot-js/src/main/web/tag/poll/Podium.tag.html index 1d3ee58..3bffe60 100644 --- a/pollen-ui-riot-js/src/main/web/tag/poll/Podium.tag.html +++ b/pollen-ui-riot-js/src/main/web/tag/poll/Podium.tag.html @@ -1,22 +1,22 @@ require("./ChoiceView.tag.html"); <Podium> <div class="podium"> - <div if={podium.step2} class="step second-step"> + <div if={podium.step2} each={choice in podium.step2} class="step second-step"> <div class="step-score">2</div> - <div class="choices"> - <ChoiceView each={choice in podium.step2} choice={choice}/> + <div class="choice"> + <ChoiceView choice={choice}/> </div> </div> - <div if={podium.step1} class="step first-step"> + <div if={podium.step1} each={choice in podium.step1} class="step first-step"> <div class="step-score">1</div> - <div class="choices"> - <ChoiceView each={choice in podium.step1} choice={choice}/> + <div class="choice"> + <ChoiceView choice={choice}/> </div> </div> - <div if={podium.step3} class="step third-step"> + <div if={podium.step3} each={choice in podium.step3} class="step third-step"> <div class="step-score">3</div> - <div class="choices"> - <ChoiceView each={choice in podium.step3} choice={choice}/> + <div class="choice"> + <ChoiceView choice={choice}/> </div> </div> </div> @@ -49,6 +49,7 @@ require("./ChoiceView.tag.html"); .step { display: flex; flex-direction: column-reverse; + min-width: 20%; } .step-score { @@ -67,9 +68,11 @@ require("./ChoiceView.tag.html"); height: 2em; } - .step .choices { + .step .choice { display: flex; + justify-content: center; font-size: 2em; + padding: 0 10px; } diff --git a/pollen-ui-riot-js/src/main/web/tag/poll/Votes.tag.html b/pollen-ui-riot-js/src/main/web/tag/poll/Votes.tag.html index ea17a36..a308826 100644 --- a/pollen-ui-riot-js/src/main/web/tag/poll/Votes.tag.html +++ b/pollen-ui-riot-js/src/main/web/tag/poll/Votes.tag.html @@ -388,6 +388,7 @@ require("./Podium.tag.html"); .voters .window { overflow-x: auto; + overflow-y: hidden; } .voters .window .frame { @@ -436,6 +437,7 @@ require("./Podium.tag.html"); display: flex; align-items: center; justify-content: center; + border-top: 1px solid #b2c7d3; } .voters .window .frame .results .score-choice .fa-trophy { -- To stop receiving notification emails like this one, please contact chorem.org SCM administrator <admin+scm@chorem.org>.