Add Animated Falling Hearts Feature & UI Improvements#2
Open
tmsachith wants to merge 1 commit intoReal-Sam:mainfrom
Open
Add Animated Falling Hearts Feature & UI Improvements#2tmsachith wants to merge 1 commit intoReal-Sam:mainfrom
tmsachith wants to merge 1 commit intoReal-Sam:mainfrom
Conversation
- Added animated colorful hearts that fall in the background when text is typing - Hearts appear with random colors (7 different pink/red shades) and low opacity (0.4) - Smooth falling animation with rotation effect - Hearts spawn every 200ms with varying sizes (20-40px) and durations (3-6s) - Removed white flash transition bug for smoother user experience - Technical changes: - Added createHeart() and startHeartRain() functions in function.js - Added .falling-heart CSS class and @Keyframes fall animation in default.css - Modified moveAnimate() to remove jarring white background flash - Integrated heart animation to start when text begins typing
|
Hello |
1 similar comment
|
Hello |
Author
|
if you like my implementations please review and accept my pull request. |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
🎉 Feature: Animated Falling Hearts
This PR adds a beautiful falling hearts animation feature that enhances the birthday wish experience.
✨ New Features
🐛 Bug Fixes
🔧 Technical Implementation
createHeart()andstartHeartRain()functions infunction.js.falling-heartCSS class and@keyframes fallanimation indefault.cssmoveAnimate()function to eliminate the white background flash📹 Demo
The falling hearts create a romantic, festive atmosphere that enhances the emotional impact of the birthday message.
Contribution by: @tmsachith