💡 [FEATURE] - Improve 404 error page

[Aditi22Bansal]

Idea Contribution

• [X] I have read all the feature request issues.
• [X] I'm interested in working on this issue
• [X] I'm part of GSSOC organization

Explain feature request

To improve the 404 error page and add a new feature, I have included an animated background with CSS animations. This enhancement will create a more engaging and visually appealing user experience. I'll add a simple animation to the background and incorporate a subtle particle effect.

Explain your solution

• Background Animation:

1. Added a background div containing three stars divs to create a parallax star field effect.
2. Applied different animation durations to the stars elements to create a layered movement effect.

• CSS Animation for Background:

1. Created animStars keyframes to animate the background stars.

• General Styling:

1. Adjusted overall styling and positioning to ensure the new background effect integrates well with the existing content.

This improvement adds visual interest to the 404 error page, making it more engaging for users.

Any alternative approaches/features

Yes, there are several alternative approaches and features you can consider to further enhance your 404 error page. Here is an idea:

1. Interactive Elements a. Interactive Animation Add an interactive animation that users can engage with. For example, an animation where elements react to the mouse movement.

Additional Context

Search Bar Include a search bar to help users quickly find what they were looking for.

[Kumar-Ankit56]

@Aditi22Bansal Please go ahead to work on this.

[Aditi22Bansal]

@Kumar-Ankit56 I have created the PR Kindly review and merge Thankyou