From a4de8607a299f10afb857f8c75b82a3d635ed637 Mon Sep 17 00:00:00 2001
From: Okke Harsta <oharsta@zilverline.com>
Date: Fri, 13 Sep 2024 11:01:56 +0200
Subject: [PATCH] Fixes #231

---
 client/src/components/InputField.jsx  | 7 +++++--
 client/src/components/InputField.scss | 4 ++++
 client/src/pages/InvitationForm.js    | 3 ++-
 3 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/client/src/components/InputField.jsx b/client/src/components/InputField.jsx
index 62232229..320cb790 100644
--- a/client/src/components/InputField.jsx
+++ b/client/src/components/InputField.jsx
@@ -22,6 +22,7 @@ export default function InputField({
                                        link = null,
                                        externalLink = false,
                                        large = false,
+                                       small = false,
                                        noInput = false,
                                        error = false,
                                        cols = 5,
@@ -68,13 +69,15 @@ export default function InputField({
                               onChange={onChange}
                               onBlur={onBlur}
                               id={name}
-                              className={`${className} sds--text-area ${large ? "large" : ""}`}
+
+                              className={`${className} sds--text-area ${large ? "large" : ""} ${small ? "small" : ""}`}
                               onKeyDown={e => {
                                   if (onEnter && e.keyCode === 13) {//enter
                                       onEnter(e);
                                   }
                               }}
-                              placeholder={placeholder} cols={cols}/>}
+                              placeholder={placeholder}
+                              cols={cols}/>}
                 {button && button}
                 {copyClipBoard && <ClipBoardCopy txt={value} right={true} input={true}/>}
                 {link && <div className="input-field-link" onClick={() => navigate(link)}>
diff --git a/client/src/components/InputField.scss b/client/src/components/InputField.scss
index 40469fea..346820bc 100644
--- a/client/src/components/InputField.scss
+++ b/client/src/components/InputField.scss
@@ -38,6 +38,10 @@
     textarea {
         height: 90px;
 
+        &.small {
+            height: 51px;
+        }
+
         &.large {
             height: 170px;
         }
diff --git a/client/src/pages/InvitationForm.js b/client/src/pages/InvitationForm.js
index b42d15e1..af0b2bf3 100644
--- a/client/src/pages/InvitationForm.js
+++ b/client/src/pages/InvitationForm.js
@@ -259,7 +259,8 @@ export const InvitationForm = () => {
                             value={invitation.message}
                             onChange={e => setInvitation({...invitation, message: e.target.value})}
                             placeholder={I18n.t("invitations.messagePlaceholder")}
-                            large={true}
+                            small={true}
+                            cols={1}
                             multiline={true}/>
 
                 <SelectField