diff --git a/src/Components/SignupPage/SignupPage.js b/src/Components/SignupPage/SignupPage.js
index 481da78..a3cdbb5 100644
--- a/src/Components/SignupPage/SignupPage.js
+++ b/src/Components/SignupPage/SignupPage.js
@@ -63,7 +63,7 @@ const SignupPage = () => {
const [issueText, setIssueText] = useState("");
const [isAnnual, setIsAnnual] = useState(1);
const [valX, setValX] = useState(0);
- const [valY, setValY] = useState(2);
+ const [valY, setValY] = useState(3);
const handleChangeInput = (e, name) => {
const newData = handleFormDataChange(e, name, data, signupFields);
@@ -612,7 +612,7 @@ const SignupPage = () => {
- {signupRadioFields?.slice(0, 3).map((option, index) => (
+ {signupRadioFields?.slice(valX, valY).map((option, index) => (
{
>
{value == activeRadioOption && !isUpgrade ? (
-
+
) : (
-
+
)}
{`${name}`}
@@ -58,7 +58,7 @@ const Radio = (props) => {
{description.map((item, i) => {
const el =
- item == "First month free!" && !isUpgrade ? (
+ item == "First month is free!" && !isUpgrade ? (
diff --git a/src/styles/radio.scss b/src/styles/radio.scss
index c6c50bf..c150f0c 100644
--- a/src/styles/radio.scss
+++ b/src/styles/radio.scss
@@ -1,6 +1,9 @@
.radio-circle-container {
display: flex;
flex-direction: column;
+ align-items: center;
+ margin-right: auto;
+ margin-left: auto;
&.upgrade {
background-color: rgb(149, 149, 149);
}
@@ -8,17 +11,19 @@
background-color: #fff;
}
height: 345px;
- margin: 10px 8px 0px 8px;
border-radius: 5px;
border: 1px solid #d4d4d4;
}
.radio-circle-top {
+ width: 248px;
height: 40px;
display: flex;
flex-direction: row;
- margin-top: 12px;
+ margin-top: 18px;
margin-left: 2px;
+ border: 1px solid var(--accent-orange-light);
+ border-radius: 10px;
}
.radio-circle-lower {
diff --git a/src/styles/signup.scss b/src/styles/signup.scss
index 26176d0..2c846e1 100644
--- a/src/styles/signup.scss
+++ b/src/styles/signup.scss
@@ -214,11 +214,13 @@
.offer-div {
display: flex;
justify-content: center;
- align-items: center;
height: 30px;
border: 1px solid #fdbe72;
border-radius: 10px;
margin-top: 25px;
+ margin-left: auto;
+ margin-right: auto;
+ width: 220px;
}
.show-addaccount-wrapper {