menu.css 729 B

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152
  1. .mask-box {
  2. position: fixed;
  3. top: 0;
  4. left: 0;
  5. background-color: rgba(0, 0, 0, 0.2);
  6. z-index: 9;
  7. width: 100vw;
  8. height: 110vh;
  9. visibility: hidden;
  10. transition: all 0.5s;
  11. }
  12. .mask-box-show {
  13. transition: all 0.5s;
  14. visibility: inherit !important;
  15. }
  16. .menu-box {
  17. width: 40vw;
  18. height: 100%;
  19. background-color: #fff;
  20. position: absolute;
  21. top: 0;
  22. left: 0;
  23. transition: all 0.5s;
  24. transform: translate(-40vw, 0);
  25. z-index: 10;
  26. }
  27. .menu-box-show {
  28. transform: translate(0, 0) !important;
  29. }
  30. .menu-box-title {
  31. width: 100%;
  32. height: 6rem;
  33. }
  34. .menu-box-title img {
  35. margin: 0 !important;
  36. }
  37. .menu-box-item {
  38. height: 6.25rem;
  39. /* border-bottom: 0.0625rem solid #ddd; */
  40. font-size: 1.5rem;
  41. }
  42. .menu-box-item a {
  43. color: #000;
  44. }