Fix context menu being hidden on mobile

As well as back button not visible on 750px width
cinnyapp · Dec 22, 2023 · ce4bbdc · ce4bbdc
1 parent 2a1bf4a
commit ce4bbdc
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 6 deletions.
diff --git a/src/app/organisms/navigation/Selector.jsx b/src/app/organisms/navigation/Selector.jsx
@@ -44,7 +44,7 @@ function Selector({
   const openOptions = (e) => {
     e.preventDefault();
     openReusableContextMenu(
-      'right',
+      window.innerWidth <= 750 ? 'bottom' : 'right',
       getEventCords(e, '.room-selector'),
       room.isSpaceRoom()
         ? (closeMenu) => <SpaceOptions roomId={roomId} afterOptionSelect={closeMenu} />

diff --git a/src/app/organisms/room/RoomViewHeader.scss b/src/app/organisms/room/RoomViewHeader.scss
@@ -33,15 +33,15 @@
   }
 }
 .room-header__members-btn {
-  @include screen.biggerThan(tabletBreakpoint) {
+  @include screen.biggerEqualsThan(tabletBreakpoint) {
     display: none;
   }
 }
 
 .room-header__back-btn {
   @include dir.side(margin, 0, var(--sp-tight));
 
-  @include screen.biggerThan(mobileBreakpoint) {
+  @include screen.biggerEqualsThan(mobileBreakpoint) {
     display: none;
   }
 }
diff --git a/src/app/partials/_screen.scss b/src/app/partials/_screen.scss
@@ -15,13 +15,13 @@ $breakpoint-mobile: 750px;
   }
 }
 
-@mixin biggerThan($deviceBreakpoint) {
+@mixin biggerEqualsThan($deviceBreakpoint) {
   @if $deviceBreakpoint==mobileBreakpoint {
-    @media screen and (min-width: $breakpoint-mobile) {
+    @media screen and (min-width: ($breakpoint-mobile + 1)) {
       @content;
     }
   } @else if $deviceBreakpoint==tabletBreakpoint {
-    @media screen and (min-width: $breakpoint-tablet) {
+    @media screen and (min-width: ($breakpoint-tablet + 1)) {
       @content;
     }
   }