This is an automated email from the git hooks/post-receive script. New commit to branch feature/pollen-riot-js in repository pollen. See https://gitlab.nuiton.org/chorem/pollen.git commit 6e9a9d6b008c79f1fc3c133affe39146ba70457f Author: Kevin Morin <morin@codelutin.com> Date: Fri Feb 24 10:13:05 2017 +0100 style i18n header --- pollen-ui-riot-js/src/main/web/tag/HeaderI18n.tag | 44 ++++++++++++++--------- 1 file changed, 27 insertions(+), 17 deletions(-) diff --git a/pollen-ui-riot-js/src/main/web/tag/HeaderI18n.tag b/pollen-ui-riot-js/src/main/web/tag/HeaderI18n.tag index ee696b5..2cd054d 100644 --- a/pollen-ui-riot-js/src/main/web/tag/HeaderI18n.tag +++ b/pollen-ui-riot-js/src/main/web/tag/HeaderI18n.tag @@ -21,11 +21,10 @@ <HeaderI18n> <div class="dropdown2"> - <a if="{locale == 'en'}" class="hlink {locale}">Language</a> - <a if="{locale == 'fr'}" class="hlink {locale}">Langue</a> + <a class="hlink flag {locale}"><i class="select"></i></a> <div class="dropdown-content2"> - <a onclick="{toEnglish}"><i class="link en"></i>English</a> - <a onclick="{toFrench}"><i class="link fr"></i>Français</a> + <a onclick="{toEnglish}" class="flag en">English</a> + <a onclick="{toFrench}" class="flag fr">Français</a> </div> </div> @@ -56,48 +55,59 @@ text-align: center; justify-content: center; align-items: center; - height: 62px; - padding: 10px 20px; + padding: 0 20px 0 0; cursor: pointer; + height: 41px; } + .select { + display: inline-block; + width: 30px; + height: 41px; + background-image: + linear-gradient(45deg, transparent 50%, gray 50%), + linear-gradient(135deg, gray 50%, transparent 50%); + background-position: + 0px 18px, + 5px 18px; + background-size: + 5px 5px, + 5px 5px; + background-repeat: no-repeat; + } - .en { - background-position-y: center; + .flag { background-repeat: no-repeat; + background-position: 16px center; + } + + .en { background-image: url(../img/en.png); } .fr { - background-position-y: center; - background-repeat: no-repeat; background-image: url(../img/fr.png); } - .link { - padding-left: 20px; - } - .dropdown2 { position: relative; display: inline-block; - width: 120px; } /* Dropdown Content (Hidden by Default) */ .dropdown-content2 { display: none; position: absolute; + right: 10px; background-color: #f9f9f9; - width: 100px; box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2); } /* Links inside the dropdown */ .dropdown-content2 a { - padding: 12px 16px; text-decoration: none; display: block; + padding: 12px 16px 12px 42px; } /* Change color of dropdown links on hover */ -- To stop receiving notification emails like this one, please contact chorem.org SCM administrator <admin+scm@chorem.org>.