diff --git a/frontend/src/app/feature/lootboxes/lootbox-opening/lootbox-opening.component.css b/frontend/src/app/feature/lootboxes/lootbox-opening/lootbox-opening.component.css index 71b8464..5684ca3 100644 --- a/frontend/src/app/feature/lootboxes/lootbox-opening/lootbox-opening.component.css +++ b/frontend/src/app/feature/lootboxes/lootbox-opening/lootbox-opening.component.css @@ -71,12 +71,12 @@ body { top: 50%; left: 50%; /* Back to center - we'll adjust the animation instead */ transform: translate(-50%, -50%); /* Center precisely */ - width: 4px; + width: 6px; height: 100%; - background: #ff0000; /* Bright red for debugging */ + background: #facc15; box-shadow: - 0 0 10px #ff0000, - 0 0 15px rgba(255, 0, 0, 0.5); + 0 0 10px #facc15, + 0 0 15px rgba(255, 255, 255, 0.5); z-index: 3; animation: indicator-pulse 1.5s ease-in-out 10s infinite alternate; } @@ -85,14 +85,14 @@ body { 0% { opacity: 0.6; box-shadow: - 0 0 10px #ff0000, - 0 0 15px rgba(255, 0, 0, 0.3); + 0 0 10px #facc15, + 0 0 15px rgba(255, 255, 255, 0.3); } 100% { opacity: 1; box-shadow: - 0 0 15px #ff0000, - 0 0 20px rgba(255, 0, 0, 0.7); + 0 0 15px #facc15, + 0 0 20px rgba(255, 255, 255, 0.7); } } @@ -175,7 +175,7 @@ body { .case-item-won .case-item-inner { box-shadow: 0 0 15px rgba(255, 255, 255, 0.3); background: linear-gradient(to right, #232c43, #2a3354, #232c43); - border: 3px solid #ff0000 !important; /* Bright red border for debugging */ + border: 2px solid #facc15; /* Gold border for winning item */ } /* Specific ID for the winning item to ensure it's visible */ diff --git a/frontend/src/app/feature/lootboxes/lootbox-opening/lootbox-opening.component.html b/frontend/src/app/feature/lootboxes/lootbox-opening/lootbox-opening.component.html index 007364d..fef38af 100644 --- a/frontend/src/app/feature/lootboxes/lootbox-opening/lootbox-opening.component.html +++ b/frontend/src/app/feature/lootboxes/lootbox-opening/lootbox-opening.component.html @@ -63,18 +63,18 @@ class="case-item" [class.case-item-won]="isWonReward(reward)" [id]="isWonReward(reward) ? 'winning-item' : ''" - [style.border]="isCenterItem(i) ? '3px solid #00ff00' : 'none'" + [style.border]="'none'" [style.animation-delay]="isWonReward(reward) ? '10s' : (8 + (i % 50) * 0.04) + 's'">