Button Animations & Hover States

[Justinabes007]

Describe the bug
Improving Accessibility of Button states is very important update for LSX Design 1.3.0
Currently the Animations are not inline with expected results and require further attention and planning per Block Variation & Style.
Specific animation states are needed for Hover, Active & Focus states.
Clear differentiation is needed between each state for accessibility purposes.

To Reproduce
Steps to reproduce the behavior:

1. Go to https://demo.lsx.design/button-block/
2. View the current Primary or CTA button - Hover over the Buttons to view Hover state.
3. Click each Button to see Focus state - Better animation is needed for this state.
4. Active State - would suggest different colour for Active including Animation affect

Expected behavior
Each Button state should be clear and visibly that an affect has taken place per state and works as expected.

Flat Buttons: Animations with shadow effects
Shadow Buttons: These buttons already contain shadow effects - what Hover, Active, Focus states should be considered as they would be different to the existing buttons with no shadows. Example of Designs needed.

[github-actions]

Stale issue message