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

app/components/Settings/BottomScreen/Menus/Clock/Time.vue

@@ -23,6 +23,9 @@ const animation = reactive({
 
 const isAnimating = ref(true);
 
+const bLabel = ref($t("common.goBack"));
+const aLabel = ref($t("common.select"));
+
 const hourRef = useTemplateRef<InstanceType<typeof NumberInput>>("hour");
 const minuteRef = useTemplateRef<InstanceType<typeof NumberInput>>("minute");
 
@@ -34,7 +37,15 @@ const animateIntro = async () => {
     gsap
       .timeline()
       .to(animation, { offsetY: 0, duration: SLIDE_DURATION, ease: "none" }, 0)
-      .to(animation, { opacity: 1, duration: SLIDE_DURATION, ease: "none" }, 0),
+      .to(animation, { opacity: 1, duration: SLIDE_DURATION, ease: "none" }, 0)
+      .call(
+        () => {
+          bLabel.value = $t("common.cancel");
+          aLabel.value = $t("common.confirm");
+        },
+        [],
+        SUBMENU_LABEL_CHANGE_DELAY,
+      ),
   ]);
   isAnimating.value = false;
 };
@@ -98,8 +109,8 @@ defineOptions({ render: () => null });
 
   <CommonButtons
     :y-offset="store.submenuButtonsOffsetY"
-    :b-label="$t('common.cancel')"
-    :a-label="$t('common.confirm')"
+    :b-label="bLabel"
+    :a-label="aLabel"
     @activate-b="handleActivateB"
     @activate-a="handleActivateA"
   />