more

src/Components/SignupPage/SignupPage.js

@@ -51,7 +51,6 @@ const SignupPage = () => {
   const [showAddAccount, setShowAddAccount] = useState(false);
   const [numberOfAccountsToAdd, setNumberOfAccountsToAdd] = useState();
   const modalText = "MAYBE PUT TOTAL HERE";
-  const selectValues = [1, 2, 3, 4, 5, 6, 7, 8];
 
   const handleChangeInput = (e, name) => {
     const newData = handleFormDataChange(e, name, data, signupFields);
@@ -88,7 +87,11 @@ const SignupPage = () => {
     setSelectedPlan(tempPlan);
     setActiveRadioOption(tempPlan[0].value);
   };
-
+  const vals = [
+    [1, 2, 3, 4, 5, 6, 7, 8],
+    [1, 2],
+  ];
+  const selectValues = selectedPlan === "partner" ? vals[1] : vals[0];
   const validateData = () => {
     const newData = getValidatedFormData(data, signupFields);
     const hasErrors = isFormDataHasErrors(newData);
@@ -460,32 +463,34 @@ const SignupPage = () => {
                     account username(s) and access will be setup later
                   </p>
                 </div>
-                <div>
+                <div className="signup-select-wrapper">
-                  {" "}
+                  <div>{}</div>
-                  <select
+                  <div className="signup-select-box">
-                    id="accountNo"
+                    <select
-                    className={`form-select`}
+                      id="accountNo"
-                    value={numberOfAccountsToAdd}
+                      className={`form-select`}
-                    name={"addAccountsSelect"}
+                      value={numberOfAccountsToAdd}
-                    onChange={(e) =>
+                      name={"addAccountsSelect"}
-                      handleChangeAccountSelect(e, "addAccountsSelect")
+                      onChange={(e) =>
-                    }
+                        handleChangeAccountSelect(e, "addAccountsSelect")
-                  >
+                      }
-                    <option
+                    >
-                      id="ddlProducts"
-                      className={`select-option`}
-                      value=""
-                    ></option>
-                    {selectValues.map((item, i) => (
                       <option
                         id="ddlProducts"
                         className={`select-option`}
-                        key={`item${i}`}
+                        value=""
-                      >
+                      ></option>
-                        {item}
+                      {selectValues.map((item, i) => (
-                      </option>
+                        <option
-                    ))}
+                          id="ddlProducts"
-                  </select>
+                          className={`select-option`}
+                          key={`item${i}`}
+                        >
+                          {item}
+                        </option>
+                      ))}
+                    </select>
+                  </div>
                 </div>
                 <div className="details-button-box">
                   <Button
@@ -509,12 +514,13 @@ const SignupPage = () => {
               {!showAddAccount ? (
                 <>
                   <Button
-                    className="secondary-button"
+                    className="secondary-button cancel-add-account-btn"
                     type="button"
                     size="lg"
                     onClick={handleAddAccounts}
                     disabled={isBusy}
                     labelText="Add Account(s)"
+                    style={{ marginTight: "12px;" }}
                   />
                   <Button
                     className="primary-button signup-proceed"

src/styles/signup.scss

@@ -223,3 +223,22 @@
   margin-top: 0px;
   margin-left: 5px;
 }
+
+.signup-select-wrapper {
+  display: flex;
+  flex-direction: row;
+  justify-content: flex-end;
+  width: 100%;
+  margin: 6px 0px;
+}
+
+.signup-select-box {
+  width: 90px;
+  margin-left: auto;
+  margin-top: 12px;
+  margin-bottom: 12px;
+}
+
+.cancel-add-account-btn {
+  margin-right: 16px;
+}