_game.scss 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778
  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. #sounds-label {
  45. width: 800px;
  46. height: 50px;
  47. line-height: 50px;
  48. display: block;
  49. margin: 0 auto;
  50. }
  51. #captured-pieces {
  52. position: absolute;
  53. width: 100px;
  54. margin-left: -100px;
  55. font-size: 2rem;
  56. line-height: 2rem;
  57. height: 517px;
  58. overflow-y: auto;
  59. ul {
  60. width: 50px;
  61. min-height: 5px;
  62. float: left;
  63. display: block;
  64. text-align: center;
  65. li {
  66. list-style-type: none;
  67. }
  68. }
  69. }