_game.scss 1.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182
  1. @import "chat";
  2. @import "chessboard";
  3. #clock {
  4. width: 148px;
  5. height: 50px;
  6. position: absolute;
  7. text-align: center;
  8. border: 4px solid lighten($grey, 5%);
  9. li {
  10. width: 70px;
  11. display: inline-block;
  12. line-height: 42px;
  13. opacity: .9;
  14. position: absolute;
  15. &.white {
  16. left: 0;
  17. color: #424242;
  18. background: #fff;
  19. }
  20. &.black {
  21. right: 0;
  22. color: #fff;
  23. background: #424242;
  24. }
  25. &.ticking {
  26. z-index: 1;
  27. font-size: 1.125rem;
  28. opacity: 1;
  29. box-shadow: 0 0 5px lighten($grey, 5%);
  30. transform: scale(1.2);
  31. transition: all 0.2s ease-in-out;
  32. }
  33. }
  34. }
  35. span#game-type {
  36. position: absolute;
  37. line-height: 50px;
  38. margin-left: 175px;
  39. opacity: 0.9;
  40. }
  41. .resign, .rematch {
  42. margin-right: 10px;
  43. }
  44. .rematch {
  45. display: none;
  46. }
  47. #sounds-label {
  48. width: 800px;
  49. height: 30px;
  50. line-height: 30px;
  51. display: block;
  52. margin: .5em auto;
  53. }
  54. #captured-pieces {
  55. position: absolute;
  56. width: 100px;
  57. margin-left: -100px;
  58. font-size: 2rem;
  59. line-height: 2rem;
  60. height: 517px;
  61. overflow-y: auto;
  62. ul {
  63. width: 50px;
  64. min-height: 5px;
  65. float: left;
  66. display: block;
  67. text-align: center;
  68. li {
  69. list-style-type: none;
  70. }
  71. }
  72. }