client/src/styles/_board_squares_img.sass

   1 // Styles for diagrams and board (partial).
   2
   3 div.board
   4   user-select: none
   5   float: left
   6   height: 0
   7   display: inline-block
   8   position: relative
   9
  10 div.board5
  11   width: 20%
  12   padding-bottom: 20%
  13
  14 div.board8
  15   width: 12.5%
  16   padding-bottom: 12.5%
  17
  18 div.board9
  19   width: 11.1%
  20   padding-bottom: 11.1%
  21
  22 div.board10
  23   width: 10%
  24   padding-bottom: 10%
  25
  26 div.board11
  27   width: 9.09%
  28   padding-bottom: 9.09%
  29
  30 div.board12
  31   width: 8.33%
  32   padding-bottom: 8.33%
  33
  34 img.piece
  35   width: 100%
  36   z-index: 10
  37
  38 img.piece, img.mark-square, img.circle-square
  39   max-width: 100%
  40   height: auto
  41   display: block
  42
  43 img.mark-square, img.circle-square
  44   position: absolute
  45   z-index: 20
  46
  47 img.mark-square
  48   opacity: .7
  49   width: 76%
  50   top: 12%
  51   left: 12%
  52
  53 img.circle-square
  54   opacity: 0.7
  55   width: 100%
  56   top: 0
  57   left: 0
  58
  59 .in-shadow
  60   filter: brightness(50%)
  61
  62 .monochrome
  63   border-bottom: 1px solid black
  64   border-right: 1px solid black
  65   box-sizing: border-box
  66
  67 .border-left
  68   border-left: 1px solid black
  69   box-sizing: border-box
  70
  71 .border-top
  72   border-top: 1px solid black
  73   box-sizing: border-box
  74
  75 .light-square.lichess
  76   background-color: #f0d9b5
  77 .dark-square.lichess
  78   background-color: #b58863
  79 .middle-square.lichess
  80   background-color: #D3B18C
  81
  82 .light-square.chesscom
  83   background-color: #e5e5ca
  84 .dark-square.chesscom
  85   background-color: #6f8f57
  86 .middle-square.chesscom
  87   background-color: #AABA91
  88
  89 .light-square.chesstempo
  90   background-color: #dfdfdf
  91 .dark-square.chesstempo
  92   background-color: #7287b6
  93 .middle-square.chesstempo
  94   background-color: #A9B3CB
  95
  96 .light-square.orangecc
  97   background-color: #fce4b2
  98 .dark-square.orangecc
  99   background-color: #d08b18
 100 .middle-square.orangecc
 101   background-color: #E6B865