#3896: Make modals containing rich text editor wider

NCI-Agency · Oct 27, 2021 · 8021926 · 8021926
1 parent e0e5af8
commit 8021926
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 2 deletions.
diff --git a/client/src/components/assessments/AssessmentModal.js b/client/src/components/assessments/AssessmentModal.js
@@ -1,7 +1,8 @@
 import API from "api"
 import {
   CustomFieldsContainer,
-  customFieldsJSONString
+  customFieldsJSONString,
+  SPECIAL_WIDGET_TYPES
 } from "components/CustomFields"
 import Messages from "components/Messages"
 import Model, {
@@ -30,6 +31,9 @@ const AssessmentModal = ({
   onCancel
 }) => {
   const [assessmentError, setAssessmentError] = useState(null)
+  const hasRichTextEditor = Object.values(assessmentConfig).find(
+    question => question.widget === SPECIAL_WIDGET_TYPES.RICH_TEXT_EDITOR
+  )
   const edit = !!note.uuid
   const initialValues = useMemo(
     () =>
@@ -44,6 +48,7 @@ const AssessmentModal = ({
         centered
         show={showModal}
         onHide={closeModal}
+        dialogClassName={hasRichTextEditor && "rich-text-modal"}
         style={{ zIndex: "1250" }}
       >
         <Formik

diff --git a/client/src/index.css b/client/src/index.css
@@ -1131,7 +1131,8 @@ header.searchPagination {
 }
 
 .rich-text-modal {
-  min-width: 650px;
+  width: 650px;
+  max-width: 100%;
 }
 
 @page {