Merge pull request #99 from kjannette/updateUI

Update UI

src/Components/Footer/Footer.js

@@ -17,7 +17,7 @@ const Footer = () => {
             <img className="footer-logo" src={logoWhite}></img>
           </div>
         </div>
-        <div className="footer-right-box">
+        <div className="footer-right-box" id="scroll-target-id">
           <a className="footer-item-link" onClick={() => handleClick("tos")}>
             Terms of Service
           </a>

src/Components/Home/HomePage.js

@@ -215,7 +215,7 @@ const HomePage = () => {
               <div className="col-md-6">
                 <div className="bottom-header-box">
                   <h4 className="heading-6">
-                    Questions about our products and services? We’re here to
+                    Questions about our services? <br></br>We are here to
                     answer!
                   </h4>
                   <h4 className="heading-6-mobile">
@@ -223,9 +223,9 @@ const HomePage = () => {
                   </h4>
                   <h4 className="heading-6-mobile">We’re here to answer!</h4>
                 </div>
-                <h6 className="foo-heading">
+                <h6 className="join-heading">
                   Let us show you how Novodraft will revolutionize your
-                  practice. Join our growing base of satisfied Novodrafters.
+                  practice. Request a demo - join our satisfied Novodrafters.
                 </h6>
               </div>
               <div className="col-md-6 d-flex">
@@ -233,7 +233,7 @@ const HomePage = () => {
                   Request a demo
                 </button>
                 <button className="button-2" onClick={handleLogin}>
-                  Go to product login
+                  Go to login
                 </button>
               </div>
             </div>

src/Components/SignupPage/SignupPage.js

@@ -44,11 +44,9 @@ const SignupPage = () => {
     getFormDataDefaults(paymentfields)
   );
   const [showPaymentModal, setShowPaymentModal] = useState(false);
-
   const [showSelectPlan, setShowSelectPlan] = useState(
     isUpgrade ? true : false
   );
-
   //const [showSelectPlan, setShowSelectPlan] = useState(true);
   const [activeRadioOption, setActiveRadioOption] = useState("partner");
   const [selectedPlan, setSelectedPlan] = useState([signupRadioFields[1]]);
@@ -255,8 +253,19 @@ const SignupPage = () => {
     setShowPaymentModal(true);
   };
 
+  const scrollToLowerPanel = () => {
+    let target = document.getElementById("scroll-target-id");
+    if (target) {
+      window.scrollTo({
+        top: target.offsetTop,
+        behavior: "smooth",
+      });
+    }
+  };
+
   const handleCancelModal = () => {
     setShowPromoModal(!showPromoModal);
+    setTimeout(scrollToLowerPanel, 93);
     setShowSelectPlan(!showSelectPlan);
   };
 
@@ -490,7 +499,7 @@ const SignupPage = () => {
         <h1 className="signup-header-text">Create A Novodraft Account</h1>
         {!isUpgrade ? (
           <h5 className="signup-header-text trial">
-            Start a free trial - save hours and draft better discovery
+            Start a free trial - save hours and draft smarter discovery
           </h5>
         ) : (
           <></>
@@ -574,7 +583,9 @@ const SignupPage = () => {
           labelText="Select A Plan"
         />
       </div>
-      <div className="signup-freebie-box ">Free trial available!</div>
+      <div className="signup-freebie-box" id="signup-freebiee">
+        Free trial available!
+      </div>
     </div>
   );
   const disableIndex =
@@ -585,7 +596,7 @@ const SignupPage = () => {
       {isBusy ? <LoadingSpinner message={""} loaderType="MoonLoader" /> : null}
       {!isUpgrade && !isBusy ? signupForm : <></>}
       {showSelectPlan && !isBusy ? (
-        <div className="select-plan-container">
+        <div className="select-plan-container" id="select-plan-scid">
           <div className="select-plan-header">
             <div className="plan-header-right">
               <h5 className="signup-subheader-text">

src/Constants/Copy/featuresCopy.js

@@ -1,21 +1,21 @@
 export const FeaturesTop = () => {
   return (
     <div className="features-copy-wrapper">
-      <h4 className="features-header-text">Discovery responses in a dash</h4>
+      <h4 className="features-header-text">Discovery responses in minutes</h4>
       <ul className="features-list">
         <li className="features-list-item">
-          Dashing: go from a discovery request on your desk to a precise
+          Don't blink: go from a discovery request on your desk to a precise
           response, ready for service, in less time than it takes to order
           lunch.
         </li>
         <li className="features-list-item">
-          Configurable: adjust the verbosity of your AI assistant's rhetoric.
+          Configurable: adjust the verbosity of your AI assistant's responses.
           Dial down for a concise response or up for more analysis and
-          persuasive arguments supporting objections.
+          persuasive arguments.
         </li>
         <li className="features-list-item">
-          Done: Impressive response documents are editable and pre-formatted to
+          Perfection, simply: Impressive response documents are editable to your
-          comport with applicable local rules.
+          taste, pre-formatted and comport with applicable local style.
         </li>
       </ul>
       <p className="steps-p"></p>

src/styles/homepage.scss

@@ -491,9 +491,11 @@ h4.heading-6 {
   font-family: Roboto;
   font-size: 28px;
   font-weight: 500;
-  line-height: 40px; /* 156.25% */
+  line-height: 38px; /* 156.25% */
   letter-spacing: 0.369px;
   text-transform: capitalize;
+  margin-bottom: 18px;
+  margin-top: 6px;
 }
 
 h6.heading-7 {
@@ -502,15 +504,16 @@ h6.heading-7 {
   font-size: 16px;
   font-style: normal;
   font-weight: 500;
-  line-height: 36.197px; /* 228.571% */
+  line-height: 24px;
   letter-spacing: 0.339px;
 }
 
-.foo-heading {
+.join-heading {
   font-family: Roboto;
   color: #fff;
   font-size: 1.1rem;
   font-weight: 400;
+  width: 520px;
 }
 
 .d-flex.div-block-3 {
@@ -1143,7 +1146,7 @@ li.nav-item {
     justify-content: center;
   }
 
-  .foo-heading {
+  .join-heading {
     font-size: 1rem;
     text-align: justify;
     margin: 1.1rem 0rem;