index.module.scss 1.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859
  1. .FloorBtn {
  2. position: absolute;
  3. right: 25px;
  4. bottom: 25px;
  5. z-index: 10;
  6. display: flex;
  7. :global {
  8. div {
  9. background-size: 100% 100%;
  10. transition: all 0.3s;
  11. width: 50px;
  12. height: 50px;
  13. cursor: pointer;
  14. }
  15. .FloorBtn0 {
  16. // margin-right: 5px;
  17. background-image: url('../../assets/img/icon-game.png');
  18. &:hover {
  19. background-image: url('../../assets/img/icon-game1.png');
  20. }
  21. }
  22. .FloorBtn1 {
  23. // margin-right: 5px;
  24. background-image: url('../../assets/img/icon-walk.png');
  25. &:hover {
  26. background-image: url('../../assets/img/icon-walk1.png');
  27. }
  28. }
  29. .FloorBtn2 {
  30. background-image: url('../../assets/img/icon-more.png');
  31. &:hover {
  32. background-image: url('../../assets/img/icon-more1.png');
  33. }
  34. }
  35. .FloorBtn3 {
  36. background-image: url('../../assets/img/icon-nonggen.png');
  37. &:hover {
  38. background-image: url('../../assets/img/icon-nonggen1.png');
  39. }
  40. }
  41. .FloorBtn4 {
  42. background-image: url('../../assets/img/icon-mol.png');
  43. &:hover {
  44. background-image: url('../../assets/img/icon-mol1.png');
  45. }
  46. }
  47. @media screen and (min-width: 1200px) {
  48. div {
  49. width: 35px;
  50. height: 35px;
  51. }
  52. }
  53. }
  54. }