Ronniie/ZoneOut
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Implement new notification system for game events, enhancing user feedback on score, lives, and bonuses. Update game.js to replace popup notifications with a dynamic notification banner. Modify index.html to include notification structure and update styles.css for notification styling and animations.

Browse source
This commit is contained in:
Ronnie 2025-05-27 19:27:18 -04:00
parent 50ab82b641
commit 1c8782b1cd
3 changed files with 201 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

45
styles.css
View file

@ -642,4 +642,49 @@ button:hover {
transform: scale(1);
opacity: 1;
}
}
.notification-banner {
position: fixed;
top: 120px;
left: 50%;
transform: translateX(-50%);
z-index: 1000;
width: 300px;
pointer-events: none;
}
.notification-content {
background: rgba(15, 23, 42, 0.95);
backdrop-filter: blur(8px);
border: 1px solid rgba(96, 165, 250, 0.2);
border-radius: 12px;
padding: 12px 20px;
color: white;
font-size: 1.1rem;
text-align: center;
opacity: 0;
transform: translateY(-20px);
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}
.notification-content.show {
opacity: 1;
transform: translateY(0);
}
.notification-content .score-change {
color: #4ecca3;
font-weight: 600;
}
.notification-content .lives-change {
color: #ff6b6b;
font-weight: 600;
}
.notification-content .bonus-change {
color: #ffd93d;
font-weight: 600;
}