musicScore.module.less 1.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596
  1. .musicScore {
  2. position: relative;
  3. width: 100%;
  4. height: 100%;
  5. -webkit-overflow-scrolling: touch;
  6. // overflow: scroll;
  7. // padding-top: 30px;
  8. .container {
  9. position: relative;
  10. display: block;
  11. border: none;
  12. width: 100%;
  13. height: 100%;
  14. z-index: 10;
  15. }
  16. .musicModel {
  17. position: absolute;
  18. left: 0;
  19. top: 0;
  20. right: 0;
  21. bottom: 0;
  22. }
  23. }
  24. .errorModel {
  25. position: absolute;
  26. left: 0;
  27. top: 0;
  28. right: 0;
  29. bottom: 0;
  30. background: #000;
  31. display: flex;
  32. align-items: center;
  33. justify-content: center;
  34. overflow: hidden;
  35. }
  36. .startBtn {
  37. position: absolute;
  38. left: 50%;
  39. bottom: 6vh;
  40. transform: translateX(-50%);
  41. z-index: 11;
  42. &:active {
  43. opacity: .8;
  44. }
  45. }
  46. .loading {
  47. position: absolute;
  48. left: 4%;
  49. top: 50%;
  50. margin-top: -15px;
  51. }
  52. .skeletonWrap {
  53. position: absolute;
  54. left: 0;
  55. top: 0;
  56. right: 0;
  57. height: 100%;
  58. z-index: 1;
  59. padding-top: 1.2rem;
  60. display: flex;
  61. flex-direction: column;
  62. justify-content: center;
  63. overflow: hidden;
  64. background: #fff;
  65. pointer-events: none;
  66. font-size: 40px;
  67. }
  68. .skeleton {
  69. --van-skeleton-paragraph-height: 24px;
  70. :global {
  71. .van-skeleton__content {
  72. .van-skeleton-paragraph {
  73. margin: 12px auto;
  74. width: 80% !important;
  75. &:first-child {
  76. width: 60% !important;
  77. }
  78. &:last-child {
  79. width: 100% !important;
  80. }
  81. }
  82. }
  83. }
  84. }