From: Benjamin Auder Date: Tue, 11 Dec 2018 13:52:30 +0000 (+0100) Subject: Fix settings button on small screens X-Git-Url: https://git.auder.net/variants/Chakart/css/current/scripts/img/DESCRIPTION?a=commitdiff_plain;h=05290bf9c98d159a3f45d4961b26ef5806834b89;p=vchess.git Fix settings button on small screens --- diff --git a/public/javascripts/components/game.js b/public/javascripts/components/game.js index c7ec715a..f5b7eda2 100644 --- a/public/javascripts/components/game.js +++ b/public/javascripts/components/game.js @@ -92,7 +92,7 @@ Vue.component('my-game', { const settingsBtnElt = document.getElementById("settingsBtn"); const indicWidth = !!settingsBtnElt //-2 for border: ? parseFloat(window.getComputedStyle(settingsBtnElt).height.slice(0,-2)) - 2 - : 37; //TODO: always 37? + : (smallScreen ? 31 : 37); if (this.mode == "human") { let connectedIndic = h( @@ -140,8 +140,8 @@ Vue.component('my-game', { "tooltip": true, "topindicator": true, "indic-right": true, - "settings-btn": true, - "small": smallScreen, + "settings-btn": !smallScreen, + "settings-btn-small": smallScreen, }, }, [h('i', { 'class': { "material-icons": true } }, "settings")] diff --git a/public/stylesheets/variant.sass b/public/stylesheets/variant.sass index 0ea9af42..9f38e774 100644 --- a/public/stylesheets/variant.sass +++ b/public/stylesheets/variant.sass @@ -76,6 +76,9 @@ figure.diagram-container > .diagram .settings-btn padding: 6px 7px 0 7px +.settings-btn-small + padding: 0 3px + .white-turn background-color: white