Rework mobile view

src/app/components/UserQuickToolsProvider.tsx

@@ -0,0 +1,9 @@
+import { ScreenSize, useScreenSizeContext } from '$hooks/useScreenSize';
+import { UserQuickTools } from '$pages/client/sidebar/UserQuickTools';
+
+export function UserQuickToolsProvider() {
+  const screenSize = useScreenSizeContext();
+  const compact = screenSize === ScreenSize.Mobile;
+  if (!compact) return null;
+  return <UserQuickTools compact />;
+}

src/app/components/message/modals/GlobalModalManager.tsx

@@ -34,7 +34,11 @@ export function GlobalModalManager() {
           focusTrapOptions={{
             initialFocus: false,
             onDeactivate: close,
-            clickOutsideDeactivates: true,
+            allowOutsideClick: (e) => {
+              e.preventDefault();
+              close();
+              return false;
+            },
             escapeDeactivates: stopPropagation,
           }}
         >

src/app/components/message/modals/MessageForward.tsx

@@ -17,7 +17,7 @@ import * as Sentry from '@sentry/react';
 import { isRoomPrivate } from '$utils/roomVisibility';
 import { canForwardEvent } from '$utils/room';
 import * as prefix from '$unstable/prefixes';
-import { RoomSearchModal } from '$features/search';
+import { SearchWrapper } from '$features/navigate';
 const debugLog = createDebugLogger('MessageForward');
 
 // Message forwarding component
@@ -270,7 +270,7 @@ export function MessageForwardInternal({
 
   if (!forwardable) return null;
 
-  return <RoomSearchModal requestClose={onClose} pickRoom={pickRoom} />;
+  return <SearchWrapper requestClose={onClose} pickRoom={pickRoom} />;
 }
 
 type MessageForwardItemProps = {

src/app/components/sidebar/Sidebar.css.ts

@@ -132,7 +132,7 @@ export const SidebarItemBottom = recipe({
 
       selectors: {
         '&:hover': {
-          transform: `translateY(${toRem(PUSH_Y)})`,
+          transform: `translateY(${toRem(-PUSH_Y)})`,
         },
         '&::before': {
           content: '',