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