UI improvements: Enhanced hero section and search functionality

[Solomon-mithra]

UI Enhancement: Hero Section and Search Improvements

Overview

This PR enhances the user experience on the Owncast website homepage with improved hero section design and better search functionality.

Changes Made

Hero Section Improvements

• Modern Badge Component: Added animated badge with blinking red dot indicator
• Enhanced Typography: Improved headline structure with better visual hierarchy
• Hero Image Loading: Implemented smooth image loading transition with better UX
• Background Effects: Added subtle blur effect to hero background for visual depth
• Responsive Design: Maintained mobile-first responsive behavior

Search Functionality Enhancements

• Scrollable Suggestions: Added scrolling to search dropdown with custom scrollbar
• Theme-consistent Styling: Purple-themed scrollbar matching site design

User Experience Benefits

• More engaging and modern homepage design
• Better search interaction with scrollable results

Testing

• ✅ Tested on desktop and mobile viewports
• ✅ Verified search functionality remains intact

Visual Changes

The changes focus on:

1. Hero section: Modern badge, improved typography, better image loading
2. Search component: Better sizing, scrollable dropdown

Compatibility

All existing functionality is preserved. These are purely additive UI/UX improvements that enhance the current design without breaking changes.

[Solomon-mithra]

Hey @gabek! 👋 Here are some UI improvements I thought would give the hero section a more modern feel. If you like the direction, I'd love to collaborate on other enhancements for the site and would appreciate your consideration for a merge.

[gabek]

Hi @Solomon-mithra, thanks so much for wanting to take part in improving our home page! There's actually a considerable amount of a discussion happening at owncast/owncast#4346 regarding this, and any updates and improvements will require some in-depth conversation before things get put into action.

We'll have to decide specifically what our goals are for any future updates, and draw up a game plan for us to get there. The start of that is with the wish list and list of complaints with the current one. Please do join in!

GitHub

New home page and documentation site? Wishlist? · owncast owncast · Discussion #4346

After hitting the 5yr anniversary milestone, I've been thinking about our current website a bit. It's been quite useful to us, and while there isn't anything "wrong", I think there are things we sh...