more

src/Components/SignupPage/SignupPage.js

@@ -402,16 +402,19 @@ const SignupPage = () => {
             </div>
           </div>
           <div className="select-sub-right">
+            <div className="select-plan-summary-box "></div>
+            <div className="selectplan-payment-button-wrapper">
               <Button
                 className="primary-button signup-proceed"
                 type="button"
                 size="lg"
                 onClick={handleProceedToPayment}
                 disabled={isBusy}
-              labelText="Select A Plan"
+                labelText="Proceed to Payment"
               />
             </div>
           </div>
+        </div>
       ) : (
         <></>
       )}

src/pageElements/Radiogroup.js

@@ -13,6 +13,7 @@ const Radiogroup = (props) => {
     options,
     disabled,
     dynamicClassName,
+    optionContainerDynamicClass,
   } = props;
   const classCheckbox = "checkbox";
   const classOption = "option";
@@ -22,6 +23,10 @@ const Radiogroup = (props) => {
       ? dynamicClassName
       : "checkbox-option-div";
 
+  const optionContainerDynamic = optionContainerDynamicClass
+    ? optionContainerDynamicClass
+    : "";
+
   return (
     <div className="radio-option-container">
       {title && <div className="checkbox-title">{title}</div>}
@@ -30,7 +35,7 @@ const Radiogroup = (props) => {
           options?.length &&
           options.map((option, index) => (
             <div
-              className="option-container"
+              className={`option-container ${optionContainerDynamic}`}
               key={option.name}
               onClick={() => !disabled && onClick && onClick(option)}
             >

src/styles/signup.scss

@@ -101,3 +101,19 @@
   height: 300px;
   background-color: #fff;
 }
+
+.select-plan-summary-box {
+  display: flex;
+  flex-direction: column;
+  height: 200px;
+  width: 100%;
+  background-color: red;
+  padding: 6px;
+}
+
+.selectplan-payment-button-wrapper {
+  display: flex;
+  flex-direction: row-reverse;
+  margin: 6px;
+  padding: 6px;
+}