X-Git-Url: https://git.auder.net/?a=blobdiff_plain;f=client%2Fsrc%2FApp.vue;h=ed8d15201e561715b8f1745dcdcd3f06e738df8e;hb=2c5d7b20742b802d9c47916915c1114bcfc9a9c3;hp=c71ebfc41893f215d3ad027f727d440cb562619e;hpb=934f7f70431e9892b3ea48ba199356b4f24eaf1b;p=vchess.git diff --git a/client/src/App.vue b/client/src/App.vue index c71ebfc4..ed8d1520 100644 --- a/client/src/App.vue +++ b/client/src/App.vue @@ -24,8 +24,7 @@ router-link(to="/problems") | {{ st.tr["Problems"] }} #rightMenu - .clickable(onClick="window.doClick('modalUser')") - | {{ st.user.id > 0 ? (st.user.name || "@nonymous") : "Login" }} + .clickable(onClick="window.doClick('modalUser')") {{ userName }} #divSettings.clickable(onClick="window.doClick('modalSettings')") span {{ st.tr["Settings"] }} img(src="/images/icons/settings.svg") @@ -72,6 +71,15 @@ export default { } ); }, + computed: { + userName: function() { + return ( + this.st.user.id > 0 + ? (this.st.user.name || "@nonymous") + : "Login" + ); + } + }, methods: { hideDrawer: function(e) { e.preventDefault(); //TODO: why is this needed? @@ -149,6 +157,7 @@ table padding: 0 10px 0 0 height: 100% & > span + padding-right: 5px vertical-align: middle & > img padding: 0 @@ -273,25 +282,18 @@ footer border: none @media screen and (max-width: 420px) + .container + min-height: calc(100vh - 55px) footer height: 55px display: block padding: 5px 0 .menuitem.somenews - animation: blinkNews 1s infinite; color: red &:link, &:visited, &:hover color: red -@keyframes blinkNews - 0%, 49% - background-color: yellow - padding: 3px - 50%, 100% - background-color: grey - padding: 3px - // Styles for diagrams and board (partial). // TODO: where to put that ? @@ -307,10 +309,18 @@ div.board display: inline-block position: relative +div.board5 + width: 20% + padding-bottom: 20% + div.board8 width: 12.5% padding-bottom: 12.5% +div.board9 + width: 11.1% + padding-bottom: 11.1% + div.board10 width: 10% padding-bottom: 10%