Show popup window in full screen at mobile devices

diff --git a/src/app/molecules/dialog/Dialog.jsx b/src/app/molecules/dialog/Dialog.jsx
index a59520f6154acbb12487f26850350e0ed307d434..2f29971d54295725570be73218270b835c4d0ea7 100644 (file)
--- a/src/app/molecules/dialog/Dialog.jsx
+++ b/src/app/molecules/dialog/Dialog.jsx
@@ -16,7 +16,7 @@ function Dialog({
 }) {
   return (
     <RawModal
-      className={`${className === null ? '' : `${className} `}dialog-model`}
+      className={`${className === null ? '' : `${className} `}dialog-modal`}
       isOpen={isOpen}
       onAfterOpen={onAfterOpen}
       onAfterClose={onAfterClose}

diff --git a/src/app/molecules/dialog/Dialog.scss b/src/app/molecules/dialog/Dialog.scss
index 77e5f059c205b921fd247f8e0c931abd862aa6da..269d909e1b81b0519239a54609f1bc7ac4d7d04a 100644 (file)
--- a/src/app/molecules/dialog/Dialog.scss
+++ b/src/app/molecules/dialog/Dialog.scss
@@ -1,4 +1,4 @@
-.dialog-model {
+.dialog-modal {
   --modal-height: 656px;
   max-height: min(100%, var(--modal-height));
   display: flex;

diff --git a/src/app/molecules/popup-window/PopupWindow.jsx b/src/app/molecules/popup-window/PopupWindow.jsx
index 1133252ac3b80017cc5fb19a8b2a739c4b2731d7..4179f49a892fa86894e0c372e8765f6c558fb427 100644 (file)
--- a/src/app/molecules/popup-window/PopupWindow.jsx
+++ b/src/app/molecules/popup-window/PopupWindow.jsx
@@ -58,7 +58,8 @@ function PopupWindow({
 
   return (
     <RawModal
-      className={`${className === null ? '' : `${className} `}pw-model`}
+      className={`${className === null ? '' : `${className} `}pw-modal`}
+      overlayClassName="pw-modal__overlay"
       isOpen={isOpen}
       onAfterClose={onAfterClose}
       onRequestClose={onRequestClose}

diff --git a/src/app/molecules/popup-window/PopupWindow.scss b/src/app/molecules/popup-window/PopupWindow.scss
index f03d1dcd908ed3f89bfa4c693d643a9f5f2471fa..3251b02d7eb787786ee1fda1dd79b7191c8f7783 100644 (file)
--- a/src/app/molecules/popup-window/PopupWindow.scss
+++ b/src/app/molecules/popup-window/PopupWindow.scss
@@ -1,9 +1,18 @@
 @use '../../partials/dir';
+@use '../../partials/screen';
 
-.pw-model {
+.pw-modal {
   --modal-height: 774px;
   max-height: var(--modal-height) !important;
   height: 100%;
+
+  @include screen.smallerThan(mobileBreakpoint) {
+    --modal-height: 100%;
+    border-radius: 0 !important;
+    &__overlay {
+      padding: 0 !important;
+    }
+  }
 }
 
 .pw {

diff --git a/src/app/molecules/room-tile/RoomTile.jsx b/src/app/molecules/room-tile/RoomTile.jsx
index 7dd4292b87f50bad8722b5f5a6fb5d9349dfffee..95481ecec9aaf2c3d03a7fe5f3999b813d39ea8b 100644 (file)
--- a/src/app/molecules/room-tile/RoomTile.jsx
+++ b/src/app/molecules/room-tile/RoomTile.jsx
@@ -3,7 +3,6 @@ import PropTypes from 'prop-types';
 import './RoomTile.scss';
 
 import { twemojify } from '../../../util/twemojify';
-import { sanitizeText } from '../../../util/sanitize';
 
 import colorMXID from '../../../util/colorMXID';
 

diff --git a/src/app/organisms/drag-drop/DragDrop.jsx b/src/app/organisms/drag-drop/DragDrop.jsx
index 4fd0bb7f9f549106d0b016acb4d7c63cadc43095..e92f8a703f05f7230e81025ea0791b9a26685d93 100644 (file)
--- a/src/app/organisms/drag-drop/DragDrop.jsx
+++ b/src/app/organisms/drag-drop/DragDrop.jsx
@@ -8,7 +8,7 @@ import Text from '../../atoms/text/Text';
 function DragDrop({ isOpen }) {
   return (
     <RawModal
-      className="drag-drop__model"
+      className="drag-drop__modal"
       overlayClassName="drag-drop__overlay"
       isOpen={isOpen}
     >

diff --git a/src/app/organisms/drag-drop/DragDrop.scss b/src/app/organisms/drag-drop/DragDrop.scss
index 6361553f06b3a80fe18f05f5171970f0a91b67c8..2e5b4f51236254bf50acf0c75e2e31ed42d2dfa4 100644 (file)
--- a/src/app/organisms/drag-drop/DragDrop.scss
+++ b/src/app/organisms/drag-drop/DragDrop.scss
@@ -1,4 +1,4 @@
-.drag-drop__model {
+.drag-drop__modal {
   box-shadow: none;
   text-align: center;
 

diff --git a/src/app/organisms/search/Search.jsx b/src/app/organisms/search/Search.jsx
index 1eddbf6796f609a5d3f8ff9b3ed8242fb4a027b5..d40d8615eee470f11d54759afc17cc453377a49a 100644 (file)
--- a/src/app/organisms/search/Search.jsx
+++ b/src/app/organisms/search/Search.jsx
@@ -199,7 +199,7 @@ function Search() {
 
   return (
     <RawModal
-      className="search-dialog__model dialog-model"
+      className="search-dialog__modal dialog-modal"
       isOpen={isOpen}
       onAfterOpen={handleAfterOpen}
       onAfterClose={handleAfterClose}

diff --git a/src/app/organisms/search/Search.scss b/src/app/organisms/search/Search.scss
index 97106e0a639d481afb918432b2f51a6a29acbef8..3612d742bb89fe80a3023258de58fe9b0ca24d99 100644 (file)
--- a/src/app/organisms/search/Search.scss
+++ b/src/app/organisms/search/Search.scss
@@ -1,6 +1,6 @@
 @use '../../partials/dir';
 
-.search-dialog__model {
+.search-dialog__modal {
   --modal-height: 380px;
   height: 100%;
   background-color: var(--bg-surface);