Design and implement a disabled state

[romaricpascal]

What

Design and implement a disabled state for the component.

This is only about implementing the visual design, as the disabled state of the component is already synchronised from the <input> to the <button> (avoiding breaking changes for code that may disable an existing <input>).

Why

Despite us not recommending you disable form fields as it causes barriers to users, there's nothing stopping a user disabling the <input> being enhanced and the visual design of the component should reflect that.

Who needs to work on this

Designers + Developers

Note Good opportunity for pairing.

Who needs to review this

Designers + Developers

Done when

• We have a design for the disabled state
• Design has been implemented

[CharlotteDowns]

When the <button></button> is given a disabled state we change the opacity to .5; and the cursor to not-allowed;

This follows the same behaviour as the secondary button under the same conditions.

You can follow the implementation in this SPIKE #5701