From 64e2a86d104f838d9d0aabb177063632a67bfd69 Mon Sep 17 00:00:00 2001
From: akiyamn
Date: Wed, 8 Jun 2022 12:28:31 +1000
Subject: Refactor infoboxes and minor adjustments

---
 src/31.html           |  2 +-
 src/31new.html        |  2 +-
 src/32.html           | 13 ++++++++-----
 src/css/buttons.css   |  1 +
 src/css/infobox.css   | 52 ++++++++-------------------------------------------
 src/css/style.css     |  5 +----
 src/css/uploadbox.css |  2 ++
 7 files changed, 22 insertions(+), 55 deletions(-)

diff --git a/src/31.html b/src/31.html
index 8edf6db..7eed37f 100644
--- a/src/31.html
+++ b/src/31.html
@@ -35,7 +35,7 @@
 
                             <h2>Uploading</h2>
                             <div class="file-size">File size: 378 KB</div>
-                            <div class="info-box inline">
+                            <div class="info-box info-box--info">
                               <img class="info-box__icon" src="img/info.png" />
                               <div class="info-box__text">
                                 Lorem ipsum dolor sit amet, consec tetur adipiscing elit.
diff --git a/src/31new.html b/src/31new.html
index 21a6b8a..07ab216 100644
--- a/src/31new.html
+++ b/src/31new.html
@@ -34,7 +34,7 @@
 
                             <h2>Uploading</h2>
                             <div class="file-size">File size: 378 KB</div>
-                            <div class="info-box inline">
+                            <div class="info-box info-box--info">
                               <img class="info-box__icon" src="img/info.png" />
                               <div class="info-box__text">
                                 Lorem ipsum dolor sit amet, consec tetur adipiscing elit.
diff --git a/src/32.html b/src/32.html
index fbbb562..21a1b6d 100644
--- a/src/32.html
+++ b/src/32.html
@@ -46,7 +46,7 @@
                               </div>
                             </div>
                           </div>
-                          <div class="info-box inline">
+                          <div class="info-box info-box--info">
                             <img class="info-box__icon" src="img/info.png" />
                             <div class="info-box__text">
                               Lorem ipsum dolor sit amet, consec tetur adipiscing elit.
@@ -66,7 +66,7 @@
                               </div>
                             </div>
                           </div>
-                          <div class="info-box inline">
+                          <div class="info-box info-box--info">
                             <img class="info-box__icon" src="img/info.png" />
                             <div class="info-box__text">
                               Lorem ipsum dolor sit amet, consec tetur adipiscing elit.
@@ -78,8 +78,11 @@
                         <div class="spacer"></div>
                         <h2>Supporting documents</h2>
                         <div class="upload-box">
-                          <div class="upload-box__title">Permanent residency application</div>
-                          <hr />
+                          <div class="left-right-box">
+                            <div class="upload-box__title">Permanent residency application</div>
+                            <i class="upload-box__close-icon"></i>
+                          </div>
+                            <hr />
                           <div class="upload-box__file-list">
                             <div class="upload-box__file-item">
                               <div class="upload-box__file-item-textbox">
@@ -89,7 +92,7 @@
                               </div>
                             </div>
                           </div>
-                          <div class="info-box inline">
+                          <div class="info-box info-box--loading">
                             <img class="info-box__icon" src="img/loading.png" />
                             <div class="info-box__text">
                               Processing...
diff --git a/src/css/buttons.css b/src/css/buttons.css
index 176b226..1491dd2 100644
--- a/src/css/buttons.css
+++ b/src/css/buttons.css
@@ -24,6 +24,7 @@
 .page-mygov-auth-account .authenticated-body-container__page .documentlodgementservice .btn.btn--tertiary {
     background-color: var(--white);
     border-color: #a7a8a9;
+    font-weight: normal;
 }
 .page-mygov-auth-account .authenticated-body-container__page .documentlodgementservice .btn:hover {
     background-color: var(--light-navy);
diff --git a/src/css/infobox.css b/src/css/infobox.css
index f521d8c..3365f3c 100644
--- a/src/css/infobox.css
+++ b/src/css/infobox.css
@@ -1,64 +1,28 @@
-
-/* General info box settings */
-
 .page-mygov-auth-account .authenticated-body-container__page .documentlodgementservice .info-box {
     display: flex;
-    align-items: flex-start;
-    margin: 1rem 0;
+    align-items: center;
+    margin: 16px 0;
 }
 
 .page-mygov-auth-account .authenticated-body-container__page .documentlodgementservice .info-box .info-box__icon {
     display: inline-block;
-    background-image: url(../img/info-grey.png);
     background-size: cover;
     min-width: 16px;
     min-height: 16px;
-    margin: 0 6px 0 0;
+    margin-right: 4px;
 }
 .page-mygov-auth-account .authenticated-body-container__page .documentlodgementservice .info-box .info-box__text {
     display: inline-block;
     font-weight: normal;
     font-size: var(--font-size-16);
     color: var(--black);
-    margin-top: 0.25rem;
-}
-
-/* Inline info boxes (for file upload errors etc...) */
-
-.page-mygov-auth-account .authenticated-body-container__page .documentlodgementservice .info-box.inline .info-box__text {
     font-weight: bold;
     font-size: var(--font-size-14);
-    color: var(--dark-grey);
 }
 
-/* Block sized info boxes */
-
-/*
-.page-mygov-auth-account .authenticated-body-container__page .documentlodgementservice .info-box.message {
-    background-color: #f7f7f7;
-    padding: 0.75rem;
-    border-radius: 3px;
-}
-.page-mygov-auth-account .authenticated-body-container__page .documentlodgementservice .info-box.message .info-box__icon {
-    background-image: url(../img/info-grey.png);
+.page-mygov-auth-account .authenticated-body-container__page .documentlodgementservice .info-box--info .info-box__text {
+    color: #2D7FC5;
 }
-
-.page-mygov-auth-account .authenticated-body-container__page .documentlodgementservice .info-box.info {
-    background-color: var(--white);
-    padding: 0.75rem;
-    border-radius: 3px;
-    border: 1px solid var(--dark-grey);
-}
-.page-mygov-auth-account .authenticated-body-container__page .documentlodgementservice .info-box.info .info-box__icon {
-    background-image: url(../img/info-grey.png);
-}
-
-.page-mygov-auth-account .authenticated-body-container__page .documentlodgementservice .info-box.warning {
-    background-color: #FFE679;
-    padding: 0.75rem;
-    border-radius: 3px;
-}
-.page-mygov-auth-account .authenticated-body-container__page .documentlodgementservice .info-box.warning .info-box__icon {
-    background-image: url(../img/warning.png);
-}
-*/
\ No newline at end of file
+.page-mygov-auth-account .authenticated-body-container__page .documentlodgementservice .info-box--loading .info-box__text {
+    color: var(--dark-grey);
+}
\ No newline at end of file
diff --git a/src/css/style.css b/src/css/style.css
index d69f000..e671f36 100644
--- a/src/css/style.css
+++ b/src/css/style.css
@@ -63,12 +63,9 @@
 }
 .page-mygov-auth-account .authenticated-body-container__page .documentlodgementservice .left-right-box {
     display: flex;
-    align-items: center;
+    align-items: baseline;
     justify-content: space-between;
 }
-.page-mygov-auth-account .authenticated-body-container__page .documentlodgementservice .left-right-box * {
-    display: inline-block;
-}
 
 /* Desktop (at least 64em) */
 
diff --git a/src/css/uploadbox.css b/src/css/uploadbox.css
index a8563aa..17d6648 100644
--- a/src/css/uploadbox.css
+++ b/src/css/uploadbox.css
@@ -22,6 +22,8 @@
     background-image: url(../img/close.png);
     width: 16px;
     height: 16px;
+    background-size: cover;
+    cursor: pointer;
     
 }
 .page-mygov-auth-account .authenticated-body-container__page .documentlodgementservice .upload-box .upload-box__title {
-- 
cgit v1.2.3