ENG-2904: Reposition Update text to make sense (#402)

* Reposition header to make sense * Tooltip reposition
comicrelief · Nov 22, 2023 · 1af0140 · 1af0140
1 parent 6f70fbc
commit 1af0140
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 6 deletions.
diff --git a/src/pages/GiftAid/UpdateForm/UpdateForm.js b/src/pages/GiftAid/UpdateForm/UpdateForm.js
@@ -67,14 +67,14 @@ function UpdateForm(props) {
 
       <UrlTransactionIdError />
 
-      <h3 className="form--update__title form--update__title--giftaid text-align-centre">
-          Who is changing their declaration?
-        </h3>
-
       <div className="form-fields--wrapper">
 
         <DonationTypeButtons donationTypeChoices={donationTypeChoices} />
 
+        <h3 className="form--update__title form--update__title--giftaid text-align-centre">
+          Who is changing their declaration?
+        </h3>
+
         <InputFields allFields={inputFieldProps} />
 
         <PostcodeLookup

diff --git a/src/styles/Tooltip.scss b/src/styles/Tooltip.scss
@@ -6,7 +6,7 @@
     height: 30px;
     background: url($image-path + "question-mark-60px.png") center center/30px no-repeat;
     position: absolute;
-    top: 0;
+    bottom: 60px;
     right: 0;
     z-index: 1;
     padding: 20px;
@@ -26,7 +26,7 @@
     visibility: hidden;
     opacity: 0;
     position: absolute;
-    top: -37px;
+    bottom: -38px;
     right: -5px;
     transform: translateY(50%);
     background: black;
@@ -60,6 +60,8 @@
       left: auto;
       right: -195px;
       transform: translateY(-50%);
+      top: auto;
+      bottom: -95px;
 
       &:after {
         border: 15px solid transparent;