You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

_drawer.scss 1.8KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485
  1. .drawer-portal {
  2. position: absolute;
  3. left: 0;
  4. right: 0;
  5. bottom: 0;
  6. z-index: $drawerZ;
  7. background-color: #141414;
  8. border-radius: 16px 16px 0 0;
  9. }
  10. .drawer-menu {
  11. max-height: calc(80vh - 64px);
  12. background: #242528;
  13. border-radius: 16px 16px 0 0;
  14. overflow-y: hidden;
  15. margin-bottom: env(safe-area-inset-bottom, 0);
  16. .drawer-toggle {
  17. display: flex;
  18. justify-content: center;
  19. align-items: center;
  20. height: 44px;
  21. cursor: pointer;
  22. svg {
  23. fill: none;
  24. }
  25. }
  26. .popupmenu {
  27. margin: auto;
  28. width: 100%;
  29. }
  30. .popupmenu__item {
  31. height: 48px;
  32. }
  33. &#{&} .overflow-menu {
  34. margin: auto;
  35. font-size: 1.2em;
  36. list-style-type: none;
  37. padding: 0;
  38. height: calc(80vh - 144px - 64px);
  39. overflow-y: auto;
  40. .overflow-menu-item {
  41. box-sizing: border-box;
  42. height: 48px;
  43. padding: 12px 16px;
  44. align-items: center;
  45. color: $overflowMenuItemColor;
  46. cursor: pointer;
  47. display: flex;
  48. font-size: 16px;
  49. div {
  50. display: flex;
  51. flex-direction: row;
  52. align-items: center;
  53. }
  54. &.unclickable {
  55. cursor: default;
  56. }
  57. @media (hover: hover) and (pointer: fine) {
  58. &.unclickable:hover {
  59. background: inherit;
  60. }
  61. }
  62. &.disabled {
  63. cursor: initial;
  64. color: #3b475c;
  65. }
  66. }
  67. .profile-text {
  68. max-width: 100%;
  69. text-overflow: ellipsis;
  70. overflow: hidden;
  71. white-space: nowrap;
  72. }
  73. }
  74. }