Added nonfunctional profile picture edit and delete icons#265
Added nonfunctional profile picture edit and delete icons#265
Conversation
HackYourFutures
temporarily deployed
to
dojo-frontend-profile-p-fcc4jt
| width: 180, | ||
| }} | ||
| > | ||
| <Fade in={isHovering}> |
There was a problem hiding this comment.
Do you think this can be made much simple with only a CSS hover rule? What is the added benefit of using Fade?
There was a problem hiding this comment.
Yes it is also possible to do it via CSS, the benefit of using Fade is that it is a part of the MUI that we use.
There was a problem hiding this comment.
Pull request overview
This PR adds non-functional edit and delete icon buttons that appear when hovering over a trainee's profile picture. The implementation uses Material-UI components with fade animations and hover effects, setting the groundwork for future functionality including confirmation modals, upload dialogs, and API integration.
Key Changes:
- Added hover state management using React useState to show/hide edit and delete icons
- Implemented visual feedback with brightness filter on avatar and scale transforms on icons
- Used Material-UI Fade component for smooth icon transitions
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
spearated profile picture modal for better readablity
3 participants
Description
Adds nonfunctional edit and delete buttons only visible when hovering over a trainee profile picture.
Will be expanded to include confirmation and upload modals and finally api implementation.
Showcase