wip: Update copy

sparkbox · Sep 13, 2022 · 5dcfefb · 5dcfefb
1 parent 3896db4
commit 5dcfefb
Show file tree

Hide file tree

Showing 3 changed files with 42 additions and 23 deletions.
diff --git a/components/apply-hero/apply-hero.js b/components/apply-hero/apply-hero.js
@@ -1,5 +1,6 @@
 import React from 'react';
 import Logo from '../logo/logo';
+import Link from '../link/link';
 import styles from './apply-hero.module.scss';
 
 const ApplyHero = () => (
@@ -8,14 +9,14 @@ const ApplyHero = () => (
       <Logo />
       <div className={styles['apply-hero__header-content']}>
         <div className={styles['apply-hero__text']}>
-          <h1>Ullam Pariatur Rerum Tenetur</h1>
+          <h1>Become an Apprentice</h1>
           <p>
-            Lorem ipsum dolor sit amet, consectetur adipisicing elit.
-            Officia nam impedit rem?
-            Dolorum distinctio provident officiis vero,
-            sapiente debitis dicta vitae aut perferendis ad,
-            eos veritatis iusto harum dolores eligendi fuga,
-            omnis culpa quod ut qui porro a sed repudiandae.
+            We&apos;re honored that you&apos;re here!
+            We trust that you&apos;ve read all about our apprenticeships, but if not,
+            {' '}
+            <Link href="/" ariaLabel="">
+              you&apos;ll want to take a few minutes to do that.
+            </Link>
           </p>
         </div>
         <div aria-hidden className={styles['apply-hero__art-container']}>

diff --git a/components/subscribe-cta/subscribe-cta.js b/components/subscribe-cta/subscribe-cta.js
@@ -5,21 +5,17 @@ const SubscribeCTA = () => (
   <footer className={styles['subscribe-cta']}>
     <div className={styles['subscribe-cta__container']}>
       <div className={styles['subscribe-cta__text-container']}>
-        <h2>Deserunt, Nulla Non?</h2>
+        <h2>Keep in Touch</h2>
         <p>
-          Ab repellendus, repudiandae amet itaque.
-          Quod doloribus dolore sapiente id accusamus in deserunt,
-          incidunt facere porro excepturi iste architecto quasi.
-          Adipisci expedita quia modi aspernatur.
-          Hic pariatur eos voluptatem tenetur natus.
-          Necessitatibus inventore vero reiciendis culpa excepturi saepe repudiandae.
+          Sign up for our monthly newsletter
+          to be notified when applications open,
+          or you can check out our careers page
+          for all currently available positions.
         </p>
-        <p>
-          Alias placeat fuga voluptates, impedit optio labore eius vitae explicabo.
-          Tempora exercitationem quis accusantium illo! Doloribus, deleniti!
-          Repellendus, voluptatibus ratione laudantium minima dignissimos commodi similique qui.
-        </p>
-        <a href="https://apprentices.sparkbox.com">Consectetur Adipisicing Elit</a>
+        <div className={styles['subscribe-cta__link-container']}>
+          <a href="https://sparkbox.us1.list-manage.com/subscribe/post?u=c2fcafb7ccc2db34e99075bb1&id=2835f91fa5&f_id=00847ae1f0">Newsletter Sign-up</a>
+          <a href="https://sparkbox.com/careers">Sparkbox Careers</a>
+        </div>
       </div>
       <div aria-hidden className={styles['subscribe-cta__art-container']}>
         <div className={styles['subscribe-cta__grid']}>

diff --git a/components/subscribe-cta/subscribe-cta.module.scss b/components/subscribe-cta/subscribe-cta.module.scss
@@ -31,20 +31,42 @@
     p {
       margin-bottom: 3rem;
     }
+  }
+
+  &__link-container {
+    $bp-links-move-inline: 37.5rem;
 
-    p:first-of-type {
-      margin-bottom: 1.5rem;
+    display: flex;
+    flex-direction: column;
+
+    @media (min-width: $bp-links-move-inline) {
+      flex-direction: row;
     }
 
     a {
-      width: 15rem;
+      width: 100%;
       padding: 0.5rem;
       font-size: 1.15rem;
       border: 3px white solid;
+      box-sizing: border-box;
       color: white;
       background-color: rgba(0, 0, 0, 0);
       text-decoration: none;
 
+      @media (min-width: $bp-links-move-inline) {
+        width: fit-content;
+        max-width: 15rem;
+      }
+
+      & + a {
+        margin-top: 1.5rem;
+
+        @media (min-width: $bp-links-move-inline) {
+          margin-top: 0;
+          margin-left: 1.5rem;
+        }
+      }
+
       &:hover {
         color: black;
         background-color: white;