status-im
/
nimbus-gui
mirror of https://github.com/status-im/nimbus-gui.git
2
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

feat: add css identifiers for every step

This commit is contained in:
RadoslavDimchev 2023-08-25 15:31:16 +03:00
parent 0074e80f66
commit 8aa4413a5f
1 changed files with 7 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/pages/ValidatorOnboarding/FormStepper/FormStepper.tsx
View File

@ -16,18 +16,20 @@ const FormStepper = ({ activeStep, changeActiveStep }: FormStepperProps) => {
style={{ fontSize: '14px', zIndex: 999, width: '100%', padding: 0, marginBottom: '2rem' }} style={{ fontSize: '14px', zIndex: 999, width: '100%', padding: 0, marginBottom: '2rem' }}
> >
<Step <Step
className="custom-step"
label={'Overview'} label={'Overview'}
className="custom-step"
onClick={() => changeActiveStep(0)} onClick={() => changeActiveStep(0)}
completed={activeStep >= 0} completed={activeStep >= 0}
data-subtitle="Get Started" data-subtitle="Get Started"
data-step="Overview"
/> />
<Step <Step
className="custom-step"
label="Advicsories" label="Advicsories"
className="custom-step"
onClick={() => changeActiveStep(1)} onClick={() => changeActiveStep(1)}
completed={activeStep > 0} completed={activeStep > 0}
data-subtitle="Understand your Duties" data-subtitle="Understand your Duties"
data-step="Advicsories"
/> />
<Step <Step
label="Validator Setup" label="Validator Setup"
@ -35,6 +37,7 @@ const FormStepper = ({ activeStep, changeActiveStep }: FormStepperProps) => {
onClick={() => changeActiveStep(2)} onClick={() => changeActiveStep(2)}
completed={activeStep > 1} completed={activeStep > 1}
data-subtitle="Clients, Nodes & Validators" data-subtitle="Clients, Nodes & Validators"
data-step="Validator Setup"
/> />
<Step <Step
label="Key Generation" label="Key Generation"
@ -42,6 +45,7 @@ const FormStepper = ({ activeStep, changeActiveStep }: FormStepperProps) => {
onClick={() => changeActiveStep(3)} onClick={() => changeActiveStep(3)}
completed={activeStep > 2} completed={activeStep > 2}
data-subtitle="Secure your Keypairs" data-subtitle="Secure your Keypairs"
data-step="Key Generation"
/> />
<Step <Step
label="Activation" label="Activation"
@ -49,6 +53,7 @@ const FormStepper = ({ activeStep, changeActiveStep }: FormStepperProps) => {
onClick={() => changeActiveStep(4)} onClick={() => changeActiveStep(4)}
completed={activeStep > 3} completed={activeStep > 3}
data-subtitle="Complete Setup" data-subtitle="Complete Setup"
data-step="Activation"
/> />
</Stepper> </Stepper>
) )