move resizing logic from js function to css

PlanQK · Sep 27, 2023 · a8b60d4 · a8b60d4
1 parent 2023d50
commit a8b60d4
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 24 deletions.
diff --git a/components/bpmn-q/modeler-component/editor/config/ConfigModal.js b/components/bpmn-q/modeler-component/editor/config/ConfigModal.js
@@ -9,8 +9,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-/* eslint-disable no-unused-vars */
-import React, { useEffect } from "react";
+import React from "react";
 import Modal from "../ui/modal/Modal";
 import "./config-modal.css";
 
@@ -54,27 +53,6 @@ export default function ConfigModal({ onClose, configTabs }) {
     elements[id].hidden = false;
   }
 
-  const updateModalSize = () => {
-    const modalDialog = document.querySelector(".qwm-modal-dialog");
-    const desiredWidth = window.innerWidth * 0.45;
-    const desiredHeight = window.innerHeight * 0.5;
-    modalDialog.style.width = `${desiredWidth}px`;
-    modalDialog.style.height = `${desiredHeight}px`;
-  };
-
-  // Call the function when the component mounts
-  useEffect(() => {
-    updateModalSize();
-
-    // Attach an event listener to recalculate size when the window is resized
-    window.addEventListener("resize", updateModalSize);
-
-    // Remove the event listener when the component unmounts
-    return () => {
-      window.removeEventListener("resize", updateModalSize);
-    };
-  }, []);
-
   return (
     <Modal onClose={onClose} openTab={openTab}>
       <Title>Modeler Configuration</Title>

diff --git a/components/bpmn-q/modeler-component/editor/resources/styling/camunda-styles/_modal.css b/components/bpmn-q/modeler-component/editor/resources/styling/camunda-styles/_modal.css
@@ -68,7 +68,9 @@ body,
   position: fixed;
   left: 0;
   right: 0;
-  width: 638px;
+  width: 40%;
+  max-width: 750px;
+  min-width: 591px;
   margin: 10vh auto 6vh;
   padding: 0;
   z-index: 1001;