diff --git a/VApp/src/views/ScoreDisplay.vue b/VApp/src/views/ScoreDisplay.vue index e9ad6fe1..be73a84f 100644 --- a/VApp/src/views/ScoreDisplay.vue +++ b/VApp/src/views/ScoreDisplay.vue @@ -10,14 +10,18 @@
-
{{ scores.BlueRoundScore }}
+ +
{{ scores.BlueRoundScore }}
+
-
{{ scores.RedRoundScore }}
+ +
{{ scores.RedRoundScore }}
+
Rouge
@@ -38,14 +42,18 @@
-
{{ scores.GreenRoundScore }}
+ +
{{ scores.GreenRoundScore }}
+
-
{{ scores.YellowRoundScore }}
+ +
{{ scores.YellowRoundScore }}
+
Jaune
@@ -301,4 +309,34 @@ .color-yellow { background: linear-gradient(135deg, rgb(var(--v-theme-YellowBuzzer)), #5a5a1a); } + + /* Score Pop Animation */ + .score-pop-enter-active { + animation: pop-in 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275); + } + .score-pop-leave-active { + animation: pop-out 0.2s ease-in; + } + + @keyframes pop-in { + 0% { + transform: scale(0.5); + opacity: 0; + } + 100% { + transform: scale(1); + opacity: 1; + } + } + + @keyframes pop-out { + 0% { + transform: scale(1); + opacity: 1; + } + 100% { + transform: scale(1.5); + opacity: 0; + } + }