Add styling to LinkModal.tsx

matrix-org · Dec 16, 2022 · 5061d7e · 5061d7e
1 parent 2831d0f
commit 5061d7e
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 2 deletions.
diff --git a/res/css/views/rooms/wysiwyg_composer/components/_LinkModal.pcss b/res/css/views/rooms/wysiwyg_composer/components/_LinkModal.pcss
@@ -16,4 +16,19 @@ limitations under the License.
 
 .mx_LinkModal {
     padding: 32px;
+
+    .mx_Dialog_content {
+        margin-top: 30px;
+        margin-bottom: 42px;
+    }
+
+    .mx_LinkModal_content {
+        display: flex;
+        flex-direction: column;
+    }
+
+    .mx_Dialog_primary {
+        // Override the default min-with of the primary button
+        min-width: 76px !important;
+    }
 }
diff --git a/src/components/views/rooms/wysiwyg_composer/components/LinkModal.tsx b/src/components/views/rooms/wysiwyg_composer/components/LinkModal.tsx
@@ -67,7 +67,7 @@ export function LinkModal({ composer, isTextEnabled, onClose }: LinkModalProps)
                 onClose();
             }}
             description={
-                <>
+                <div className="mx_LinkModal_content">
                     {isTextEnabled && (
                         <Field
                             label={_td("Text")}
@@ -84,7 +84,7 @@ export function LinkModal({ composer, isTextEnabled, onClose }: LinkModalProps)
                             setFields((fields) => ({ ...fields, link: e.target.value }))
                         }
                     />
-                </>
+                </div>
             }
         />
     );