AOSSIE-Org / AOSSIE-Org/PictoPy-Website
[BUG]: Gallery Features Cards Overflow and Time Delay
- Vorherrschende Sprache
- TypeScript
- Sterne
- 12
- Forks
- 16
- PR-Merge-Kennzahlen
- Keine gemergten PRs in 30 T.
Beschreibung
### Bug Description
The Gallery Features section exhibits visual overflow when hovering over feature cards. The expanded content spills outside card boundaries, breaking the layout.
In `HowItWorks.tsx`, the grid forces 4 narrow columns at the lg breakpoint (lg:grid-cols-4). When hover reveals additional details, the constrained card width causes text to overflow.
Additionally, time delay of 1000ms is usually too long for hover UX; it feels laggy more than “optimized.”
For this case, use 200–300ms as a good default (quick but avoids accidental triggers), or 0ms if you want instant response. Performance impact is negligible either way—the main win is better user feel.
### Steps to Reproduce
1. Go to website
2. scroll to Gallery Features
3. Hover on any feature tab you will find that content is overflowing
### Logs and Screenshots
https://github.com/user-attachments/assets/1cd2eaa0-7d0f-43a8-ae0e-956dca50211f
### Environment Details
It reproduces in `HowItWorks.tsx` at large-screen card hover with `lg:grid-cols-4`, while build still passes via `npm run build` on Windows.
### Impact
High - Major feature is broken
### Code of Conduct
- [x] I have joined the [Discord server](https://discord.gg/hjUhu33uAn) and will post updates there
- [x] I have searched existing issues to avoid duplicates
Beitragsleitfaden
Bewertung
Dieses Issue wurde noch nicht bewertet.