From 156b285344de208ffcd3766eb543f8d5cd8ba714 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Joel=20Elias=20M=C3=A9ndez?=
 <67445275+joelmendez1@users.noreply.github.com>
Date: Fri, 3 Dec 2021 12:19:41 -0300
Subject: [PATCH] align response actions (#1106)

---
 client/src/app-components/ticket-viewer.js   | 16 +++++++++-------
 client/src/app-components/ticket-viewer.scss | 15 +++++++++++++--
 2 files changed, 22 insertions(+), 9 deletions(-)

diff --git a/client/src/app-components/ticket-viewer.js b/client/src/app-components/ticket-viewer.js
index cb2520c0..987640a5 100644
--- a/client/src/app-components/ticket-viewer.js
+++ b/client/src/app-components/ticket-viewer.js
@@ -461,13 +461,15 @@ class TicketViewer extends React.Component {
                     </div>
                     <div className="ticket-viewer__response-field row">
                         <FormField name="content" validation="TEXT_AREA" required field="textarea" fieldProps={{allowImages: allowAttachments}} />
-                        <div className="ticket-viewer__response-buttons">
-                            {allowAttachments ? <FormField name="file" field="file" /> : null}
-                            <SubmitButton type="secondary">{i18n('RESPOND_TICKET')}</SubmitButton>
-                        </div>
-                        <div className="ticket-viewer__buttons-column">
-                            <div className="ticket-viewer__buttons-row">
-                                {this.renderCloseTicketButton()}
+                        <div className="ticket-viewer__response-container">
+                            <div className="ticket-viewer__response-buttons">
+                                {allowAttachments ? <FormField name="file" field="file" /> : null}
+                                <SubmitButton type="secondary">{i18n('RESPOND_TICKET')}</SubmitButton>
+                            </div>
+                            <div className="ticket-viewer__buttons-column">
+                                <div className="ticket-viewer__buttons-row">
+                                    {this.renderCloseTicketButton()}
+                                </div>
                             </div>
                         </div>
                     </div>
diff --git a/client/src/app-components/ticket-viewer.scss b/client/src/app-components/ticket-viewer.scss
index 25c8e761..26c85e2e 100644
--- a/client/src/app-components/ticket-viewer.scss
+++ b/client/src/app-components/ticket-viewer.scss
@@ -33,6 +33,9 @@
         justify-content: space-between;
         align-items: flex-start;
         width: 250px;
+        position: absolute;
+        left: 0;
+        bottom: 0;
     }
 
     &__edited-title-text {
@@ -214,11 +217,19 @@
             }
         }
 
+        &-container {
+            display: flex;
+            position: relative;
+            flex-direction: row-reverse;
+        }
+
         &-buttons {
             display: flex;
-            flex-direction: row;
+            flex-direction: column;
             justify-content: space-between;
-            align-items: center;
+            align-items: flex-end;
+            width: 50%;
+            min-width: 50%;
         }
 
     }