Checkbox - Update to design 1.7

[AlexSkrypnyk]

See epic: #121

We are looking for a bulletproof, icon-less and customisable implementation of a checkbox using CSS-only.

SD

1. Update the implementation to match all states in Figma v1.7.0. Note that some of the states were fixed in Figma, so these should be reflected in code. Use this code for reference.
2. Update component to correctly use updated Label's props for for and required.
3. Update component to use new helpers instead of using its own and decommission existing helpers.

[fionamorrison23]

Awaiting design.

[sonamchaturvedi28]

Test Env: DEV
Test Status: FAIL
Test Result:

1. Border radius of checkbox is 2px. Expected is 4px as per Figma.
2. Checkbox border and background colour for Disabled Checked state is incorrect. It should be same as Disabled unchecked state

Issue#1:

Issue#2:

[AlexSkrypnyk]

1. Acknowledged. Fixed now. Also, some sub-pixel sizing dimensions were fixed.

2. We are not updating the background for the disabled state - we are making the whole control semi-transparent. This is an industry standard practice as it also takes care of the label.

[sonamchaturvedi28]

Test Env: DEV
Test Status: PASS
Test Result:

• Retested issue#1 and it is fixed, border radius of checkbox is 4px.
• Border width pixel is also now better.