fix(settings): synchronize button animation with arrows of number input

app/components/Settings/BottomScreen/Menus/User/Birthday.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import { SettingsBottomScreenNumberInput as NumberInput } from "#components";
+import gsap from "gsap";
 
 const store = useSettingsStore();
 const confirmationModal = useConfirmationModal();
@@ -10,6 +11,9 @@ const BIRTHDAY_YEAR = 2002;
 
 const isAnimating = ref(true);
 
+const bLabel = ref($t("common.goBack"));
+const aLabel = ref($t("common.select"));
+
 const monthRef = useTemplateRef<InstanceType<typeof NumberInput>>("month");
 const dayRef = useTemplateRef<InstanceType<typeof NumberInput>>("day");
 const yearRef = useTemplateRef<InstanceType<typeof NumberInput>>("year");
@@ -20,6 +24,14 @@ const animateIntro = async () => {
     monthRef.value?.animateIntro(),
     dayRef.value?.animateIntro(),
     yearRef.value?.animateIntro(),
+    gsap.timeline().call(
+      () => {
+        bLabel.value = $t("common.cancel");
+        aLabel.value = $t("common.confirm");
+      },
+      [],
+      SUBMENU_LABEL_CHANGE_DELAY,
+    ),
   ]);
   isAnimating.value = false;
 };
@@ -113,8 +125,8 @@ defineOptions({ render: () => null });
 
   <CommonButtons
     :y-offset="confirmationModal.buttonsYOffset + store.submenuButtonsOffsetY"
-    :b-label="$t('common.cancel')"
-    :a-label="$t('common.confirm')"
+    :b-label="bLabel"
+    :a-label="aLabel"
     @activate-b="handleActivateB"
     @activate-a="handleActivateA"
   />