-
Notifications
You must be signed in to change notification settings - Fork 2
Description
Issue Description:
Add smooth hover animations to navbar elements to improve user interaction and visual feedback.
Proposed Changes:
- Logo Hover Animation:
Scale up logo on hover (1.05x or 1.1x scale)
Smooth transition duration (~300ms)
Optional: Add subtle glow or color shift
- Navigation Links Hover Effect:
Animated underline that slides in from left to right
Line should match brand color (orange from your theme)
Smooth transition timing
Line appears on hover, disappears on hover out
- Make Navbar Sticky
Current Behaviour
Recording.2025-08-21.140511.mp4
Logo: Static with no hover effects - appears flat and unresponsive when user hovers over it
Navigation Links (Home, Courses, Learn with AI): Plain text links with no visual feedback on hover - users get no indication that these are interactive elements
Overall: While basic hover functionality exists, the lack of smooth transitions makes the navbar feel outdated and less professional
Expected Behavior:
Logo: Smoothly scales up when hovered, returns to normal when mouse leaves
Nav Links: Orange line slides in from left to right underneath text on hover
Timing: All animations should be smooth (~300ms duration)
Performance: Use CSS transforms for optimal performance
Acceptance Criteria:
Logo scales up smoothly on hover
Navigation links show animated underline on hover
Animations work consistently across all modern browsers
No performance issues or layout shifts
Animations reverse smoothly when hover ends
Extra Details
I Am Contributing Under OSCI(Open Source Connect India)