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.6KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384
  1. .drawer-portal {
  2. position: absolute;
  3. left: 0;
  4. right: 0;
  5. bottom: 0;
  6. z-index: $drawerZ;
  7. }
  8. .drawer-menu {
  9. max-height: 50vh;
  10. background: #242528;
  11. border-radius: 16px 16px 0 0;
  12. overflow-y: auto;
  13. &.expanded {
  14. max-height: 80vh;
  15. }
  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. .overflow-menu-item {
  39. box-sizing: border-box;
  40. height: 48px;
  41. padding: 12px 16px;
  42. align-items: center;
  43. color: $overflowMenuItemColor;
  44. cursor: pointer;
  45. display: flex;
  46. font-size: 16px;
  47. div {
  48. display: flex;
  49. flex-direction: row;
  50. align-items: center;
  51. }
  52. &.unclickable {
  53. cursor: default;
  54. }
  55. @media (hover: hover) and (pointer: fine) {
  56. &.unclickable:hover {
  57. background: inherit;
  58. }
  59. }
  60. &.disabled {
  61. cursor: initial;
  62. color: #3b475c;
  63. }
  64. }
  65. .profile-text {
  66. max-width: 100%;
  67. text-overflow: ellipsis;
  68. overflow: hidden;
  69. white-space: nowrap;
  70. }
  71. }
  72. }