Fix announcement bar functionality

[kmalap05]

Pull Request for Issue No : #266

Type of Pull Request:

• [ ] Feature Request.
• [x] Bug Request.
• [ ] Report a security vulnerability.

PR Summary:

• Implemented functional next and previous buttons in the announcement bar for smooth navigation between announcements.
• Added continuous cycling through announcements and an option in theme settings to enable/disable automatic sliding with customizable interval settings.

What approach did you take?

• HTML Structure: Utilized a div container with slides and next/previous buttons.
• Looped Announcements: Checked for announcements and displayed them in slides using Liquid templating.
• Next/Previous Buttons: Implemented buttons with onclick functions to navigate between slides.
• Auto-Rotation: Enabled auto-rotation based on a specified interval in the theme settings.
• Tailwind CSS Styling: Provided Tailwind CSS classes for styling the slideshow and slides.

Demo links/Screenshots

https://github.com/dear-digital/shopify-theme-skeleton/assets/83391228/65cf28d7-8545-4156-b4ca-905969ee478c

Code Review Checklist

Please review the following aspects during the code review:

• [x] Added PR summary
• [x] Followed theme code principles
• [x] Checked for any warnings by shopify theme check
• [x] Tested for Responsive
• [x] Tested on multiple browsers

Information Completeness

• [x] Yes, I have provided all the correct and necessary information.

[mihir-bombay-studio]

@kmalap05 can you add sliding in and our animations for announcement items?

[kmalap05]

@kmalap05 can you add sliding in and our animations for announcement items?

Yaa, Sure.

[github-actions[bot]]

This pull request has been marked as stale due to a lack of recent activity. To keep it open, please respond or push new commits within the next 7 days. If you need more time or assistance, please let us know in a comment. We understand that contributions can take time, and we appreciate your effort!