added geo location cta to uac-transient-town

ONSdigital · Jul 22, 2020 · 9ebce27 · 9ebce27
1 parent 875e3d9
commit 9ebce27
Show file tree

Hide file tree

Showing 3 changed files with 31 additions and 7 deletions.
diff --git a/_prototypes/end-to-end/style.css b/_prototypes/end-to-end/style.css
@@ -51,7 +51,7 @@ h4 {
 }
 
 .u-fs-s {
-    font-size: .8rem;
+    font-size: .77777778rem;
 }
 
 .logo__img {
@@ -96,7 +96,7 @@ h4 {
     }
 
     .u-fs-s {
-        font-size: .8rem;
+        font-size: .77777778rem;
     }
 }
 
@@ -289,8 +289,8 @@ a:focus:not(.btn--link):not(.btn--ghost):not(.js-clear-btn):not(.download__thumb
     text-decoration: none;
 }
 
-.icon--external:before,
-.icon--external:after {
+[class*="icon--"]:before,
+[class*="icon--"]:after {
     display: inline-block;
     background-repeat: no-repeat;
     content: '';
@@ -307,6 +307,16 @@ a:focus:not(.btn--link):not(.btn--ghost):not(.js-clear-btn):not(.download__thumb
     transform: none;
 }
 
+.icon--location:before {
+    width: 1rem;
+    height: 1rem;
+    background-image: url(/img/icons/icons--location.svg);
+    background-size: 1rem 1rem;
+    margin: 0 .5rem 0 0;
+    -webkit-transform: none;
+    transform: translateY(-1px);
+}
+
 .collapsible {
     margin-top: 1.5rem;
 }
@@ -390,7 +400,7 @@ details summary:focus {
 }
 
 .panel--warning--small .panel__text {
-    font-size: 0.8rem
+    font-size: .77777778rem
 }
 
 .panel--branded {

diff --git a/_prototypes/end-to-end/uac-transient-town.html b/_prototypes/end-to-end/uac-transient-town.html
@@ -24,7 +24,7 @@
             <main role="main" id="main" class="page__main">
                 <form id="form" name="trav" class="form qa-questionnaire-form"
                       role="form" autocomplete="new-password" action="../individual-details-language">
-                    <div class="group u-mb-l">
+                    <div class="group">
                         <div class="block">
                             <section class="section">
                                 <div class="question u-mb-s">
@@ -56,8 +56,9 @@
 
                             </section>
                         </div>
+                        <a href="" class="icon--location">Find using my current location</a>
                     </div>
-                    <button class="btn btn--primary btn--lg qa-btn-submit venus u-mb-xl"
+                    <button class="btn btn--primary btn--lg qa-btn-submit u-mt-xl"
                             type="submit" name="">Save and continue
                     </button>
                 </form>

diff --git a/img/icons/icons--location.svg b/img/icons/icons--location.svg