Not all .shadow-hover transitions work correctly

[boldc]

Not all .shadow-hover transitions work correctly

Steps To Reproduce:

1. Open Astroid Template Two settings
2. Add a Section to a Layout (or use an existing Section) and add a Grid widget
3. Add a Grid item, set its Box Shadow to Small Shadow and its Hover Shadow to a larger setting. Leave Hover Transition as Default

5. Save Changes to the Grid widget, Save the Layout, save the Template, and Clear Cache
6. Refresh the page that contains the Grid widget
7. Hover your mouse over the Grid item

Expected behavior:
A smooth transition between shadow sizes

Result:
Instant transition between the shadow sizes. Inspection of the page using dev tools shows the transition declaration is defined in the : hover psuedo-classs. This causes the correct transtion declaration to be ignored.

The transition: delcaration should be removed from
.shadow-hover:hover {}

This behavior is most noticeable on these Hover Transitions:

• Default
• Scale Up
• Scale Down
• Bounce In
• Bounce Out
• Rotate
• Grow Rotate
• Float
• Sink
• Skew
• Skew Forward
• Skew Backward

However all transitions appear to be affected to some degree. When your cursor leaves the hover area, each animations/transitions revert instantly to the original state, instead of a smooth transition to the original state.

System Information:

• Joomla Version: 6.0.2
• PHP Version: 8.4.15
• Astroid Version: 3.3.7 (Template Two version 1.0.6)
• Device: Desktop PC
• OS: Windows 11
• Browser: Chrome