diff --git a/src/Components/Modals/PaymentModal.js b/src/Components/Modals/PaymentModal.js index 09cc641..a76bb5b 100644 --- a/src/Components/Modals/PaymentModal.js +++ b/src/Components/Modals/PaymentModal.js @@ -25,8 +25,8 @@ const PaymentModal = ({ const monthlyAddAccountPrice = selectedPlan[0].pricing[2].amount; const annualAddAccountPrice = monthlyAddAccountPrice * 12; const showAdditionaLAccountsView = - selectedPlan[0]?.value === "partner" || - selectedPlan[0]?.value === "seniorPartner"; + (selectedPlan[0]?.value === "partner" && numberOfAccountsToAdd > 0) || + (selectedPlan[0]?.value === "seniorPartner" && numberOfAccountsToAdd > 0); const planName = selectedPlan[0].name ? selectedPlan[0].name : null; const billingPeriod = isAnnual ? "Annually" : "Monthly"; const amountToday = isAnnual @@ -34,6 +34,7 @@ const PaymentModal = ({ : selectedPlan[0]?.pricing[1]?.amount; console.log("annualAddAccountPrice", annualAddAccountPrice); console.log("isAnnual", isAnnual); + console.log("numberOfAccountsToAdd", numberOfAccountsToAdd); return ( @@ -65,7 +66,7 @@ const PaymentModal = ({ {isAnnual ? (

{" "} - {numberOfAccountsToAdd}/per year = $ + {numberOfAccountsToAdd}/ x 12 months = $ {annualAddAccountPrice}

) : ( diff --git a/src/Components/SignupPage/SignupPage.js b/src/Components/SignupPage/SignupPage.js index 80d5c9b..9b0ebae 100644 --- a/src/Components/SignupPage/SignupPage.js +++ b/src/Components/SignupPage/SignupPage.js @@ -374,8 +374,8 @@ const SignupPage = () => { const showNoticeOnPage = "" !== notice && !showPaymentModal; const addAccountCopy = selectedPlan[0]?.value === "seniorPartner" - ? "Add up to eight additional accounts to your subscripton" - : "Add up to two additional accounts to your subscripton"; + ? "Add up to eight" + : "Add up to two"; const showAddAccountBtn = selectedPlan[0].value === "seniorPartner" || selectedPlan[0].value === "partner"; @@ -506,59 +506,60 @@ const SignupPage = () => { ))} {showAddAccount ? ( -
- {" "} -
-
- Add additional accounts -
-

- account username(s) and access will be setup later -

-
-
-
-
{addAccountCopy}
+
+
+
+
+ Add additional accounts +
+

+ Username(s) and access will be setup later +

-
- + handleChangeAccountSelect(e, "addAccountsSelect") + } + > - ))} - + value="" + > + {selectAdditionalAccountValues.map((item, i) => ( + + ))} + +
-
-
-
diff --git a/src/styles/modals.scss b/src/styles/modals.scss index 0d2296b..f875a70 100644 --- a/src/styles/modals.scss +++ b/src/styles/modals.scss @@ -110,5 +110,5 @@ .payment-summary-header { border-bottom: 1px solid #cecece; - margin-bottom: 12px; + margin-bottom: 4px; } diff --git a/src/styles/signup.scss b/src/styles/signup.scss index 800303e..0aef894 100644 --- a/src/styles/signup.scss +++ b/src/styles/signup.scss @@ -87,6 +87,8 @@ .plan-header-right-low { display: flex; flex-direction: row; + justify-content: center; + margin: auto; padding: 12px 14px; width: 100%; } @@ -207,11 +209,19 @@ margin-top: 25px; } +.show-addaccount-wrapper { + display: flex; + flex-direction: row; + justify-content: flex-end; + width: 100%; +} + .show-addaccount-container { display: flex; flex-direction: column; - width: 880px; + width: 578px; min-height: 200px; + margin-right: 14px; padding: 12px; border-radius: 10px; background-color: #fff;