19 lines
850 B
Markdown
19 lines
850 B
Markdown
# Notification Animation Fix
|
|
|
|
Fixed the download notification display issue where notifications appeared strangely (first in corner, then stretched).
|
|
|
|
## Problem
|
|
- `.tg-status-message` had conflicting width properties
|
|
- Complex positioning caused weird stretch animation
|
|
- Used `transform: translateX(-50%)` with multiple width calculations
|
|
|
|
## Solution
|
|
- Simplified positioning: `left/right` with `var(--tg-spacing-lg)` margins
|
|
- Removed conflicting width properties (`max-width`, `width`, `min-width`)
|
|
- Changed position from `top: 80px` to `top: 20px`
|
|
- Updated animation from `tg-slide-in` to `tg-slide-down` for natural top-to-bottom appearance
|
|
|
|
## Files Modified
|
|
- `public/style.css`: Updated `.tg-status-message` styles and animation keyframes
|
|
|
|
The notification now appears smoothly at the top of the screen without strange stretching effects. |