Steps
Default Step
1
Shopping
Choose what you want
2
Billing
Pay for the bill
3
Getting
Waiting for the goods
Step with icon
Shopping
Billing
Getting
Step States
A u-step with classname.done A u-step with classname .errorA u-step with classname .currentA u-step with classname .disabled
1
Getting
Waiting for the goods
2
Getting
Waiting for the goods
3
Getting
Waiting for the goods
4
Getting
Waiting for the goods
Step Sizing
A step with classname.u-steps-xs.u-steps-sm.u-steps-lg
Shopping
Billing
Getting
Shopping
Billing
Getting
Shopping
Billing
Getting
Shopping
Billing
Getting
Vertical Step
1
Shopping
Choose what you want
2
Billing
Pay for the bill
3
Getting
Waiting for the goods
Default Pearls Steps
1Account Info
2Billing Info
3Confirmation
Pearls Steps with icon
Account Info
Billing Info
Confirmation
Pearls Step Sizing
A Pearls step with classname.u-pearls-xs.u-pearls-sm.u-pearls-lg
1Account Info
2Billing Info
3Confirmation
1Account Info
2Billing Info
3Confirmation
1Account Info
2Billing Info
3Confirmation
1Account Info
2Billing Info
3Confirmation
Pearls Step States
A pearls step states with different class.done.currunt.error.disabled
1
Account Info
2
Billing Info
3
Confirmation
1
Account Info
2
Billing Info
3
Confirmation
1
Account Info
2
Billing Info
3
Confirmation
1
Account Info
2
Billing Info
3
Confirmation