Merge branch 'cg-resize' of https://github.com/benediktwerner/lila into benediktwerner-cg-resize

* 'cg-resize' of https://github.com/benediktwerner/lila:
  Remove cg-helper from 3D board styles as well
  Align chessground board to top
  Remove cg-helper CSS
  Remove cg-helper

app/templating/ChessgroundHelper.scala

@@ -10,10 +10,9 @@ import lila.game.Pov
 trait ChessgroundHelper {
 
   private val cgWrap      = div(cls := "cg-wrap")
-  private val cgHelper    = tag("cg-helper")
   private val cgContainer = tag("cg-container")
   private val cgBoard     = tag("cg-board")
-  val cgWrapContent       = cgHelper(cgContainer(cgBoard))
+  val cgWrapContent       = cgContainer(cgBoard)
 
   def chessground(board: Board, orient: Color, lastMove: List[Pos] = Nil)(implicit ctx: Context): Frag =
     wrap {
@@ -50,10 +49,8 @@ trait ChessgroundHelper {
 
   private def wrap(content: Frag): Frag =
     cgWrap {
-      cgHelper {
-        cgContainer {
-          content
-        }
+      cgContainer {
+        content
       }
     }
 

ui/common/css/vendor/chessground/_board-3d.scss

@@ -18,18 +18,6 @@ $td-inner-relative-percent: $td-inner-height-ratio / $td-outer-height-ratio * 10
   }
 }
 
-cg-helper {
-  // Default (from 2D boards) would be 12.5% of width.
-  padding-bottom: $td-inner-height-ratio * 12.5%;
-
-  // The "display: table" hack is not useful here, because the board is not
-  // square. So heights corresponding to rounded widths are not always
-  // integers, much less have the desired effect.
-  // Additionally behavior with non-integer heights varies across Chrome
-  // versions.
-  display: block;
-}
-
 piece {
   /* original size: width: 140.625%; height: 179.6875%; */
   /* size on 3D board, with height/width = 90.78571% */
@@ -59,11 +47,6 @@ cg-board::before {
 
 .is2d {
   /* override miniboards */
-  cg-helper {
-    padding-bottom: 12.5%;
-    display: table;
-  }
-
   cg-board {
     top: 0;
     height: 100%;

ui/common/css/vendor/chessground/_chessground.scss

@@ -131,20 +131,12 @@ piece {
   }
 }
 
-cg-helper {
-  position: absolute;
-  width: 12.5%;
-  padding-bottom: 12.5%;
-  display: table; // hack to round to full pixel size in chrome
-  bottom: 0;
-}
-
 cg-container {
   position: absolute;
-  width: 800%;
-  height: 800%;
+  width: 100%;
+  height: 100%;
   display: block;
-  bottom: 0;
+  top: 0;
 }
 
 cg-container .cg-shapes,