Fix/hover and link styles minor issues

[mghenciu]

Closes #1843 .

Summary

Minor styles changes for hover, focus, links and primary accent colors.

1. Added hover state for the Navigation panels, since we didn't had one

Screen.Recording.2023-09-01.at.13.29.46.mov

2. Improved the hover state for the Accordion Panels, to increase the contrast.

3. Made the toggles, Secondary buttons and link - to use 1 single color. In the current live version, those colors change when changing the theme, which creates inconsistent results (attached below):

---

Test instructions

1. The secondary buttons, link, toggles -> should use the same accent color
2. Test the top navigation, that it has hover state now
3. Test the Accordion hover state, which should also have more contrast now

---

Checklist before the final review

• Included E2E or unit tests for the changes in this PR.
• Visual elements are not affected by independent changes.
• It is at least compatible with the minimum WordPress version.
• It loads additional script in frontend only if it is required.
• Does not impact the Core Web Vitals.
• In case of deprecation, old blocks are safely migrated.
• It is usable in Widgets and FSE.
• Copy/Paste is working if the attributes are modified.
• PR is following the best practices

[pirate-bot]

Bundle Size Diff

Package	Old Size	New Size	Diff
Animations	270.81 KB	270.81 KB	0 B (0.00%)
Blocks	1.42 MB	1.42 MB	0 B (0.00%)
CSS	85.28 KB	85.28 KB	0 B (0.00%)
Dashboard	122.49 KB	123.99 KB	1.5 KB (1.23%)
Export Import	83.17 KB	83.17 KB	0 B (0.00%)
Pro	303.34 KB	303.34 KB	0 B (0.00%)

[pirate-bot]

Plugin build for 108a699 is ready 🛎️!

• Download Otter – Page Builder Blocks & Extensions for Gutenberg - Production ~ Development
• Download Otter Pro - Production ~ Development
• Download Blocks Animation - Production ~ Development
• Download Blocks CSS - Production ~ Development
• Download Blocks Export Import - Production ~ Development

[pirate-bot]

E2E Summary

Typing

Test	Average Time (ms)	Standard Deviation (ms)	Median Time (ms)	Quantile for soft limit (%)	Quantile for hard limit (%)
Typing	54.42	5.87	53.55	84.21 (60ms)	100 (80ms)

Values above 60ms

"0 - 67.80, 13 - 66.29, 16 - 61.89"

[mghenciu]

Here are the details from a test instance, @JohnPixle , in case you have time and also want to test the changes.
Nothing just some colors, hover and focus updates.

https://irritatehorses.s4-tastewp.com/wp-admin
admin | OWX7ndMCiZw

[HardeepAsrani]

Hey @mghenciu,

When you're done with the changes, don't forget to ask Robert or me for a PR review. One thing I wanted to mention is if you're making style changes to core components like buttons, I'll recommend you to test with previous versions of WordPress to ensure it doesn't affect them negatively. Thanks!

[mghenciu]

One thing I wanted to mention is if you're making style changes to core components like buttons, I'll recommend you to test with previous versions of WordPress to ensure it doesn't affect them negatively. Thanks!

Thank you for the feedback, Hardeep.

Do you mean to test in the Otter Dashboard context? or also in other places?
If I am not mistaken, those style changes should apply only the Otter context.

[HardeepAsrani]

@mghenciu Only testing in Dashboard should be enough.

[mghenciu]

I did tested with:

• 6.3.1
• 6.1
• 5.9
• 5.8

And the style changes look ok.

Let me know if something else is required @HardeepAsrani , before asking for a review on this.
Thank you!

[HardeepAsrani]

@mghenciu That's great then, you can put it to a review & then QA.

[HardeepAsrani]

@Soare-Robert-Daniel Can you review the changes here?

[Soare-Robert-Daniel]

Tested and looks good.

[rodica-andronache]

@mghenciu everything's working well here 👍

[pirate-bot]

🎉 This PR is included in version 2.4.1 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀