X-Git-Url: https://git.auder.net/?a=blobdiff_plain;f=client%2Fsrc%2Fstyles%2F_board_squares_img.sass;fp=client%2Fsrc%2Fstyles%2F_board_squares_img.sass;h=e9606602579ab55a8cf40b66e4de34d1f957bdf6;hb=26d8a01a40dc198b633ae86f698b1ae82415e5e1;hp=0000000000000000000000000000000000000000;hpb=de6860abfca2fee63d61b6ec7145dfc89d9e50c8;p=vchess.git

diff --git a/client/src/styles/_board_squares_img.sass b/client/src/styles/_board_squares_img.sass
new file mode 100644
index 00000000..e9606602
--- /dev/null
+++ b/client/src/styles/_board_squares_img.sass
@@ -0,0 +1,63 @@
+// Styles for diagrams and board (partial).
+
+.light-square-diag
+  background-color: #e5e5ca
+
+.dark-square-diag
+  background-color: #6f8f57
+
+div.board
+  user-select: none
+  float: left
+  height: 0
+  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%
+
+div.board11
+  width: 9.09%
+  padding-bottom: 9.09%
+
+div.board12
+  width: 8.33%
+  padding-bottom: 8.33%
+
+img.piece
+  width: 100%
+
+img.piece, img.mark-square, img.circle-square
+  max-width: 100%
+  height: auto
+  display: block
+
+img.mark-square
+  opacity: .7
+  width: 76%
+  position: absolute
+  top: 12%
+  left: 12%
+
+img.circle-square
+  opacity: 0.7
+  width: 100%
+  position: absolute
+  top: 0
+  left: 0
+
+.in-shadow
+  filter: brightness(50%)