X-Git-Url: https://git.auder.net/?a=blobdiff_plain;f=client%2Fsrc%2Fcomponents%2FBoard.vue;h=25da6f1444c1e61ecfe84bad3fb8932bbe9b6c2c;hb=cf94b843f223b34fd2f3680112a183f6d5cd409c;hp=914b3c3f36769adbceddc588ac3ab34ca8e34a97;hpb=06e79b0783d6e9962ca6b2a25f62d46f46fa5c8b;p=vchess.git diff --git a/client/src/components/Board.vue b/client/src/components/Board.vue index 914b3c3f..25da6f14 100644 --- a/client/src/components/Board.vue +++ b/client/src/components/Board.vue @@ -21,7 +21,15 @@ export default { }, render(h) { if (!this.vr) - return; + { + // Return empty div of class 'game' to avoid error when setting size + return h("div", + { + "class": { + "game": true, + }, + }); + } const [sizeX,sizeY] = [V.size.x,V.size.y]; // Precompute hints squares to facilitate rendering let hintSquares = ArrayFun.init(sizeX, sizeY, false); @@ -30,9 +38,9 @@ export default { let incheckSq = ArrayFun.init(sizeX, sizeY, false); this.incheck.forEach(sq => { incheckSq[sq[0]][sq[1]] = true; }); - let firstRow = document.querySelector(".game > .row"); - const squareWidth = (!!firstRow - ? document.querySelector(".game > .row").offsetWidth / sizeY + let boardElt = document.querySelector(".game"); + const squareWidth = (!!boardElt + ? boardElt.offsetWidth / sizeY : 40); //arbitrary value (not relevant) const choices = h( 'div', @@ -386,13 +394,10 @@ div.board11 padding-bottom: 9.1% .game - width: #{'min(80vw, 500px)'} - margin: 0 auto + width: 100% + margin: 0 .board cursor: pointer - @media screen and (max-width: 767px) - width: 100% - margin: 0 #choices margin: 0 auto 0 auto