diff --git a/packages/desktop/app/javascripts/Renderer/Renderer.ts b/packages/desktop/app/javascripts/Renderer/Renderer.ts index 0850df91e..a13399e95 100644 --- a/packages/desktop/app/javascripts/Renderer/Renderer.ts +++ b/packages/desktop/app/javascripts/Renderer/Renderer.ts @@ -114,18 +114,6 @@ async function configureWindow(remoteBridge: CrossProcessBridge) { if (isMacOS || useSystemMenuBar) { // !important is important here because #desktop-title-bar has display: flex. sheet.insertRule('#desktop-title-bar { display: none !important; }', sheet.cssRules.length) - } else { - /* Use custom title bar. Take the sn-titlebar-height off of - the app content height so its not overflowing */ - sheet.insertRule( - 'body, [data-dialog], [data-mobile-popover] { padding-top: var(--sn-desktop-titlebar-height) !important; }', - sheet.cssRules.length, - ) - sheet.insertRule( - `.main-ui-view { height: calc(100vh - var(--sn-desktop-titlebar-height)) !important; - min-height: calc(100vh - var(--sn-desktop-titlebar-height)) !important; }`, - sheet.cssRules.length, - ) } } diff --git a/packages/desktop/app/stylesheets/renderer.css b/packages/desktop/app/stylesheets/renderer.css index b9b640592..02eba8bcd 100644 --- a/packages/desktop/app/stylesheets/renderer.css +++ b/packages/desktop/app/stylesheets/renderer.css @@ -37,7 +37,6 @@ panel-resizer { display: flex; justify-content: space-between; z-index: 99999; - position: absolute; width: 100%; top: 0; } @@ -84,3 +83,14 @@ input, .panel-resizer { -webkit-app-region: no-drag; } + +body { + display: flex; + flex-direction: column; + height: 100%; + overflow: hidden; +} + +#app-group-root { + min-height: 0; +} diff --git a/packages/web/src/javascripts/Components/Modal/ModalOverlay.tsx b/packages/web/src/javascripts/Components/Modal/ModalOverlay.tsx index deec21b44..2c4ceab30 100644 --- a/packages/web/src/javascripts/Components/Modal/ModalOverlay.tsx +++ b/packages/web/src/javascripts/Components/Modal/ModalOverlay.tsx @@ -6,32 +6,39 @@ import { useModalAnimation } from '../Modal/useModalAnimation' type Props = { isOpen: boolean children: ReactNode + portal?: boolean } -const ModalOverlay = forwardRef(({ isOpen, children, ...props }: Props, ref: ForwardedRef) => { - const [isMounted, setElement] = useModalAnimation(isOpen) - const dialog = useDialogStore({ - open: isMounted, - }) +const ModalOverlay = forwardRef( + ({ isOpen, children, portal = true, ...props }: Props, ref: ForwardedRef) => { + const [isMounted, setElement] = useModalAnimation(isOpen) + const dialog = useDialogStore({ + open: isMounted, + }) - if (!isMounted) { - return null - } + if (!isMounted) { + return null + } - return ( - - {children} - - ) -}) + return ( + + {children} + + ) + }, +) export default ModalOverlay diff --git a/packages/web/src/javascripts/Components/Preferences/PreferencesViewWrapper.tsx b/packages/web/src/javascripts/Components/Preferences/PreferencesViewWrapper.tsx index 4b8f97709..957b68203 100644 --- a/packages/web/src/javascripts/Components/Preferences/PreferencesViewWrapper.tsx +++ b/packages/web/src/javascripts/Components/Preferences/PreferencesViewWrapper.tsx @@ -20,7 +20,7 @@ const PreferencesViewWrapper: FunctionComponent = ( }, [commandService, viewControllerManager]) return ( - + viewControllerManager.preferencesController.closePreferences()} application={application}