Unverified Commit 0a830d7e authored by Zhou (Link)  Fang's avatar Zhou (Link) Fang Committed by GitHub
Browse files

Updated mandatory fields and styles related to titles (#221)

* updated mandatory fields and styles related to titles

* improved the header levels
parent bb86b882
......@@ -217,12 +217,12 @@ const CompanyInformation = ({ formik, isStartNewForm }) => {
return (
<form onSubmit={formik.handleSubmit}>
<h1 className="fw-600 h2">Company Information</h1>
<p>
Please complete your company information below. This should be the legal
name and address of your organization.
</p>
<div className="align-center">
<h1 className="fw-600 h2">Company Information</h1>
<p>
Please complete your company information below. This should be the
legal name and address of your organization.
</p>
<CompanyInformationCompany formik={formik} useStyles={useStyles} />
<CompanyInformationContacts formik={formik} />
<CompanyInformationVAT formik={formik} useStyles={useStyles} />
......
......@@ -25,7 +25,7 @@ const CompanyInformationCompany = ({ formik, useStyles }) => {
return (
<>
<h2 className="fw-600 h4" id={organizationName.name}>
Organization <span className="orange-star">*</span>
Organization
</h2>
<Input
......@@ -44,7 +44,7 @@ const CompanyInformationCompany = ({ formik, useStyles }) => {
labelName={organizationTwitter.label}
placeholder={organizationTwitter.placeholder}
ariaLabel={organizationName.name}
requiredMark={true}
requiredMark={false}
value={formik.values.organization.twitterHandle}
onChange={formik.handleChange}
error={Boolean(formik.errors.organization?.twitterHandle)}
......@@ -53,9 +53,9 @@ const CompanyInformationCompany = ({ formik, useStyles }) => {
</div>
</div>
<h4 className="fw-600" id={`${organizationName.name}-address`}>
<h2 className="fw-600 h4" id={`${organizationName.name}-address`}>
Address
</h4>
</h2>
<div className="row">
<div className="col-md-16">
<Input
......@@ -132,7 +132,7 @@ const CompanyInformationCompany = ({ formik, useStyles }) => {
name={organizationAddress.provinceOrState.name}
labelName={organizationAddress.provinceOrState.label}
placeholder={organizationAddress.provinceOrState.placeholder}
requiredMark={true}
requiredMark={false}
value={formik.values.organization.address.provinceOrState}
onChange={formik.handleChange}
ariaLabel={`${organizationName.name}-address`}
......@@ -144,7 +144,7 @@ const CompanyInformationCompany = ({ formik, useStyles }) => {
name={organizationAddress.postalCode.name}
labelName={organizationAddress.postalCode.label}
placeholder={organizationAddress.postalCode.placeholder}
requiredMark={true}
requiredMark={false}
value={formik.values.organization.address.postalCode}
onChange={formik.handleChange}
ariaLabel={`${organizationName.name}-address`}
......
......@@ -121,10 +121,10 @@ const Contacts = ({ formik }) => {
return (
<>
<h4 className="fw-600" id="company-rep">
<h2 className="fw-600 h4" id="company-rep">
Company Member Representative
<span className="orange-star margin-left-5">*</span>
</h4>
</h2>
<p>
Please indicate the primary point of contact between your organization
and the Eclipse Foundation. As per the Eclipse Bylaws, the Member
......@@ -141,9 +141,10 @@ const Contacts = ({ formik }) => {
{generateContacts(companyRep, 'company-rep', 'member', false)}
</div>
<h4 className="fw-600" id="marketing-rep">
<h2 className="fw-600 h4" id="marketing-rep">
Company Marketing Representative
</h4>
<span className="orange-star margin-left-5">*</span>
</h2>
<FormControlLabel
control={
<Checkbox
......@@ -167,9 +168,10 @@ const Contacts = ({ formik }) => {
)}
</div>
<h4 className="fw-600" id="accounting-rep">
<h2 className="fw-600 h4" id="accounting-rep">
Company Accounting Representative
</h4>
<span className="orange-star margin-left-5">*</span>
</h2>
<FormControlLabel
control={
<Checkbox
......
......@@ -25,13 +25,13 @@ export default function CompanyInformationVAT({ formik, useStyles }) {
return (
<>
<h4
className="fw-600 section-header"
<h2
className="fw-600 h4 section-header"
id={`${purchasingProcess.name}-ctn`}
>
Purchasing Process
<span className="orange-star margin-left-5">*</span>
</h4>
</h2>
<p>
Does your organization require a Purchase Order to facilitate payment of
your membership dues?
......@@ -83,9 +83,9 @@ export default function CompanyInformationVAT({ formik, useStyles }) {
</div>
</div>
<h4 className="fw-600" id="vatRegistration">
<h2 className="fw-600 h4" id="vatRegistration">
VAT Registration
</h4>
</h2>
<FormControlLabel
control={
<Checkbox
......
......@@ -38,8 +38,9 @@ const MembershipLevel = ({ formik }) => {
<p>
Please indicate the class of membership for which you are applying
</p>
<h2 className="fw-600 h3" id={membershipLevel.name}>
<h2 className="fw-600 h4" id={membershipLevel.name}>
What is your intended Membership Level?
<span className="orange-star margin-left-5">*</span>
</h2>
<div className="row">
<div className="col-md-12">
......
......@@ -20,39 +20,46 @@ const SigningAuthority = ({ formik }) => {
return (
<form onSubmit={formik.handleSubmit}>
<h1 className="fw-600 h2" id={sectionName}>
Signing Authority
</h1>
<p>
Please indicate the individual who has the signing authority for the
agreement
</p>
<div className="align-center">
<h1 className="fw-600 h2" id={sectionName}>
Signing Authority
</h1>
<p>
Please Indicate the individual who has the signing authority for the
agreement
</p>
<div className="row">
{signingAuthorityRepresentative.map((el, index) => (
<div key={index} className="col-md-12">
<Input
name={`signingAuthorityRepresentative.${el.name}`}
labelName={el.label}
placeholder={el.placeholder}
requiredMark={true}
onChange={formik.handleChange}
value={formik.values.signingAuthorityRepresentative[`${el.name}`]}
error={
formik.touched.signingAuthorityRepresentative?.[`${el.name}`] &&
Boolean(
<div className="row">
{signingAuthorityRepresentative.map((el, index) => (
<div key={index} className="col-md-12">
<Input
name={`signingAuthorityRepresentative.${el.name}`}
labelName={el.label}
placeholder={el.placeholder}
requiredMark={true}
onChange={formik.handleChange}
value={
formik.values.signingAuthorityRepresentative[`${el.name}`]
}
error={
formik.touched.signingAuthorityRepresentative?.[
`${el.name}`
] &&
Boolean(
formik.errors.signingAuthorityRepresentative?.[`${el.name}`]
)
}
helperText={
formik.touched.signingAuthorityRepresentative?.[
`${el.name}`
] &&
formik.errors.signingAuthorityRepresentative?.[`${el.name}`]
)
}
helperText={
formik.touched.signingAuthorityRepresentative?.[`${el.name}`] &&
formik.errors.signingAuthorityRepresentative?.[`${el.name}`]
}
/>
</div>
))}
}
/>
</div>
))}
</div>
</div>
<CustomStepButton
previousPage="/working-groups"
nextPage="/review"
......
......@@ -12,7 +12,7 @@ const SubmitSuccess = () => {
}, []);
return (
<>
<h2>Confirmation message on submission: </h2>
<h1 className="fw-600 h2">Confirmation message on submission: </h1>
<p>We thank you for completing the membership application.</p>
<p>
Our membership coordination team will send a ready to sign membership
......
......@@ -161,12 +161,15 @@ const WorkingGroupsWrapper = ({ formik, isStartNewForm }) => {
return (
<form onSubmit={formik.handleSubmit}>
<FormikProvider value={formik}>
<h1 className="fw-600 h2">Working Group</h1>
<p>Please complete the following details for joining a Working Group</p>
<div
id="working-groups-page"
className="align-center margin-top-50 margin-bottom-30"
>
<h1 className="fw-600 h2">Working Group</h1>
<p>
Please complete the following details for joining a Working Group
</p>
<WorkingGroup
formik={formik}
workingGroupsUserJoined={workingGroupsUserJoined}
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment