GarimaSingh0109 / WasteManagment

https://garimasingh0109.github.io/WasteManagment/
MIT License
49 stars 123 forks source link

[DOCS] < Add Shadow Effect and Zoom-in on Hover for Image in about-image Section> #218

Open harshpareshbhaigosalya opened 1 month ago

harshpareshbhaigosalya commented 1 month ago

Issue Description

The image in the about-image section (

) currently does not have any special visual effects. To enhance the UI/UX, I would like to suggest adding a subtle shadow effect and a zoom-in animation when a user hovers over the image.

Screenshots or Examples (if applicable)

Screenshot 2024-10-08 161337

Proposed Solution (optional)

  • Apply a shadow effect to the image using the box-shadow property.
  • Implement a smooth zoom-in effect using the transform: scale() and transition properties.
  • Add an enhanced shadow effect on hover to highlight the interaction.

Checklist

  • [X] I have checked the existing issues.
  • [X] The changes don't break the code.
  • [X] Please attach the screenshots and video of the development work once it is done.

Additional Comments (optional)

No response

github-actions[bot] commented 1 month ago

Hi there! Thanks for opening this issue. We appreciate your contribution to this open-source project. We aim to respond or assign your issue as soon as possible.