more

src/Components/SignupPage/SignupPage.js

@@ -43,9 +43,12 @@ 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]]);
   const [isAnnual, setIsAnnual] = useState(1);
@@ -538,6 +541,7 @@ const SignupPage = () => {
                     isUpgrade={index < disableIndex ? true : false}
                     disabled={index < disableIndex ? true : false}
                     currentPlan={currentPlan}
+                    parentIndex={index}
                   />
                 </div>
               ))}

src/Constants/Fields/RadioFields.js

@@ -5,7 +5,7 @@ export const signupRadioFields = [
     value: "associate",
     description: [
       "1 document per month",
-      "Carryover 1 document to next period",
+      "Carryover 1 unused document each subscription period",
       "Documents conforming with state rules",
       "24/7 support",
       "First month free!",
@@ -24,7 +24,7 @@ export const signupRadioFields = [
     value: "partner",
     description: [
       "3 documents per month",
-      "Carryover 2 documents to next period",
+      "Carryover 1 unused document per month",
       "Documents conforming with state rules",
       "Up to 2 additional accounts: $49/each",
       "24/7 support",
@@ -55,5 +55,22 @@ export const signupRadioFields = [
       { type: "additionalAccount", amount: 39 },
     ],
   },
+  {
+    name: "Of Counsel",
+    label: "Of Counsel",
+    value: "ofCounsel",
+    description: [
+      "One document - pay as you go",
+      "24/7 support",
+      "Document conforming with state rules",
+    ],
+    details: "",
+    docsAllowedPerMonth: 1,
+    pricing: [
+      { type: "oneTime", amount: 59 },
+      { type: "oneTime", amount: 59 },
+      { type: "oneTime", amount: 59 },
+    ],
+  },
 ];
 //

src/pageElements/Radio.js

@@ -15,6 +15,7 @@ const Radio = (props) => {
     isAnnual,
     isUpgrade,
     currentPlan,
+    parentIndex,
   } = props;
 
   const classCheckbox = "checkbox";
@@ -43,9 +44,15 @@ const Radio = (props) => {
               )}
               <div className="radio-name-box"> {`${name}`} </div>
               <div className="radio-price-box">
-                <div className="radio-price">
+                {parentIndex > 2 ? (
-                  {`$${price[index]["amount"]}/mo`}
+                  <div className="radio-price">
-                </div>
+                    {`$${price[index]["amount"]}/doc`}
+                  </div>
+                ) : (
+                  <div className="radio-price">
+                    {`$${price[index]["amount"]}/mo`}
+                  </div>
+                )}
               </div>
             </div>
             <div className="radio-circle-lower">

src/styles/signup.scss

@@ -124,11 +124,9 @@
   align-items: center;
   margin-top: 45px;
   width: 100%;
-  padding: 12px;
   border-radius: 10px;
   background-color: rgb(240, 247, 250);
   border: 1px solid #e9e9e9;
-  padding: 6px;
 }
 
 .select-sub-right {
@@ -168,6 +166,7 @@
 .radio-group-box {
   display: flex;
   flex-direction: row;
+  flex-wrap: wrap;
   padding: 6px;
   width: 100%;
   height: 340px;
@@ -197,7 +196,7 @@
 }
 
 .signup-radio-container {
-  width: 350px;
+  width: 300px;
   height: 100%;
 }