Merge pull request #6329 from weseek/feat/render-presentation-modal

render presentation modal

packages/app/src/components/Layout/BasicLayout.tsx

@@ -26,6 +26,7 @@ export const BasicLayout = ({ children, title, className }: Props): JSX.Element
   const PageDuplicateModal = dynamic(() => import('../PageDuplicateModal'), { ssr: false });
   const PageDeleteModal = dynamic(() => import('../PageDeleteModal'), { ssr: false });
   const PageRenameModal = dynamic(() => import('../PageRenameModal'), { ssr: false });
+  const PagePresentationModal = dynamic(() => import('../PagePresentationModal'), { ssr: false });
 
   return (
     <RawLayout title={title} className={className}>
@@ -47,6 +48,7 @@ export const BasicLayout = ({ children, title, className }: Props): JSX.Element
       <PageDuplicateModal />
       <PageDeleteModal />
       <PageRenameModal />
+      <PagePresentationModal />
       {/* <HotkeysManager /> */}
 
       <ShortcutsModal />

packages/app/src/components/PagePresentationModal.jsx

@@ -6,6 +6,8 @@ import {
 
 import { usePagePresentationModal } from '~/stores/modal';
 
+import styles from './PagePresentationModal.module.scss';
+
 const PagePresentationModal = () => {
 
   const { data: presentationData, close: closePresentationModal } = usePagePresentationModal();
@@ -15,7 +17,7 @@ const PagePresentationModal = () => {
       isOpen={presentationData.isOpened}
       toggle={closePresentationModal}
       data-testid="page-presentation-modal"
-      className="grw-presentation-modal"
+      className={`grw-presentation-modal ${styles['grw-presentation-modal']}`}
       unmountOnClose={false}
     >
       <ModalBody className="modal-body">

packages/app/src/styles/_page-presentation.scss → packages/app/src/components/PagePresentationModal.module.scss

@@ -1,5 +1,7 @@
-.grw-presentation-modal {
-  @include expand-modal-fullscreen(false, false);
+@use '~/styles/mixins' as mi;
+
+.grw-presentation-modal :global {
+  @include mi.expand-modal-fullscreen(false, false);
 
   .modal-body {
     background: black;