Allow for locked and inactive disabled buttons to be visually different

[kirsty-hames]

Subject of the enhancement

Depending on the button context, the appropriate .is-locked or .is-disabled classes should be used. This doesn't have any impact on the functionality as all disabled buttons have the attribute aria-disabled. .is-locked or .is-disabled should only be used to apply styles.

Expected behaviour

.is-locked - applies to buttons that are temporarily disabled due to step locked content.
Instances include: Boxmenu item button, Trickle button and PLP.

.is-disabled - applies to buttons with functionality not available.
Instances include: Narrative start/end controls, Submit button when no answers have been selected, Feedback button when question hasn't been submitted.

Plugins with locked states

Boxmenu

Already has .is-locked class. Nothing to action.

pageLevelProgressItem

Replace .is-disabled with .is-locked. This would be consistent with the locked aria-label.

.is-locked style would need adding to Vanilla.

Trickle

Issue already raised adaptlearning/adapt-contrib-trickle#208. Locked styling would also be consistent with the aria-label.

There are no specific Trickle button styles currently. Colours inherit from Vanilla .btn-text instead which already includes .is-locked.

[kirsty-hames]

Issue fixed by the following:

• Drawer item .is-locked styling added to Vanilla in New: Add drawer item locked state  adapt-contrib-vanilla#488
• PLP item .is-locked and .is-disabled classes separated in New: Separate .is-locked and .is-disabled btn state classes adapt-contrib-pageLevelProgress#202
• Trickle btn .is-locked state class added