menu.css 802 B

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950
  1. .noscroll {
  2. overflow: hidden;
  3. }
  4. .menu-background {
  5. position: fixed;
  6. top: 0;
  7. left: 0;
  8. width: 100vw;
  9. height: 100vh;
  10. z-index: 10;
  11. }
  12. .menu {
  13. background: rgba(255, 255, 255, 1);
  14. position: fixed;
  15. z-index: 11;
  16. padding: 8px 0;
  17. box-shadow: 0 1px 6px rgba(0, 0, 0, 0.12), 0 1px 4px rgba(0, 0, 0, 0.24);
  18. overflow-y: auto;
  19. max-height: 80vh;
  20. transform-origin: top left;
  21. animation: new-menu-animation .08s ease-out forwards;
  22. }
  23. @keyframes new-menu-animation {
  24. from {
  25. transform: scaleY(0);
  26. }
  27. to {
  28. transform: scaleY(1);
  29. }
  30. }
  31. .menu li {
  32. cursor: pointer;
  33. display: block;
  34. font-size: 16px;
  35. padding: 16px 32px 16px 16px;
  36. color: rgba(0, 0, 0, 0.87);
  37. }
  38. .menu li:hover {
  39. background: rgba(0, 0, 0, 0.07);
  40. }
  41. .menu li:active {
  42. background: rgba(0, 0, 0, 0.07);
  43. }