diff --git a/js/components/FavoriteBar.js b/js/components/FavoriteBar.js index 47d62ea..cafe85f 100644 --- a/js/components/FavoriteBar.js +++ b/js/components/FavoriteBar.js @@ -9,6 +9,7 @@ export function FavoriteBar({teams}) { const [favorite, setFavorite] = useState(null); const [isVisible, setIsVisible] = useState(false); const [isLoading, setIsLoading] = useState(true); + const [isPulsing, setIsPulsing] = useState(false); useEffect(() => { const savedFavorite = localStorage.getItem('favoriteTeam'); @@ -28,7 +29,9 @@ export function FavoriteBar({teams}) { } else { setFavorite(team); localStorage.setItem('favoriteTeam', team.id); + setIsPulsing(true); } + setIsVisible(false); // Close the favorite menu }; const scrollToFavorite = () => { @@ -37,6 +40,7 @@ export function FavoriteBar({teams}) { if (el) { el.scrollIntoView({behavior: 'smooth', block: 'end'}); } + setIsPulsing(false); // Stop pulsing when the button is clicked } }; @@ -47,16 +51,20 @@ export function FavoriteBar({teams}) { const sortedTeams = [...teams].sort((a, b) => a.name.localeCompare(b.name)); return ( -
+
-

Favorit:

+

Favorit:

{favorite ? favorite.name : ''}

- {favorite && ( - )} diff --git a/public/static/css/tournament.css b/public/static/css/tournament.css index 9c1f40d..572a1de 100644 --- a/public/static/css/tournament.css +++ b/public/static/css/tournament.css @@ -30,3 +30,19 @@ .scoreInput { width: 11rem; } + +@keyframes pulse { + 0% { + transform: scale(1); + } + 50% { + transform: scale(1.2); + } + 100% { + transform: scale(1); + } +} + +.pulse-animation { + animation: pulse 1s infinite; +} \ No newline at end of file