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