Add winning

This commit is contained in:
Joey Yakimowich-Payne 2025-04-19 07:43:27 -06:00
commit d863129361
No known key found for this signature in database
GPG key ID: 6BFE655FA5ABD1E1
3 changed files with 141 additions and 5 deletions

View file

@ -233,3 +233,35 @@ details[open] > .config-summary::before {
.config-content {
padding-left: 1.5rem; /* Indent content */
}
/* --- Animation for winning cells --- */
@keyframes pulse {
0% {
transform: scale(1);
box-shadow: 0 0 0 0 rgba(0, 255, 110, 0.7); /* Emerald-400 */
}
70% {
transform: scale(1.02);
box-shadow: 0 0 10px 10px rgba(0, 255, 110, 0.5); /* Emerald-400 transparent */
}
100% {
transform: scale(1);
box-shadow: 0 0 0 0 rgba(0, 255, 110, 0.2);
}
}
/* --- Style for winning cells --- */
.bingo-cell.win-cell {
/* Apply a distinct border to indicate win */
border-color: #10b981; /* Emerald-500 */
border-width: 3px; /* Make border more prominent */
animation: pulse 1.5s infinite;
z-index: 15; /* Ensure winning cells are on top of highlighted/others */
/* Optional: Slightly different background tint? */
/* Example: background-color: rgba(16, 185, 129, 0.1); /* Light emerald tint */
}
/* Ensure winning cell text is still readable over potential background tint */
.bingo-cell.win-cell .bingo-cell-text {
z-index: 16; /* Keep text above the cell's base styles/animations */
}