feat: mobile breakpoint for vue nodes banner (#6942)

## Summary

Add mobile breakpoint to vue nodes banner

## Changes

- **What**: main.json and vue nodes banner

## Screenshots (if applicable)

<img width="500" height="615" alt="image"
src="https://github.com/user-attachments/assets/fd8cc621-c335-41c9-bbee-4ec0ae04b226"
/>
<img width="980" height="615" alt="image"
src="https://github.com/user-attachments/assets/30e17fc2-fc91-44a3-b9f0-85d5146e861b"
/>

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-6942-feat-mobile-breakpoint-for-vue-nodes-banner-2b66d73d36508139b69afd7e7134b72e)
by [Unito](https://www.unito.io)

src/components/topbar/TryVueNodeBanner.vue

@@ -3,9 +3,12 @@
     v-if="showVueNodesBanner"
     class="pointer-events-auto relative w-full h-10 bg-gradient-to-r from-blue-600 to-blue-700 flex items-center justify-center px-4"
   >
-    <div class="flex items-center">
+    <div class="flex items-center text-sm">
       <i class="icon-[lucide--rocket]"></i>
-      <span class="pl-2 text-sm">{{ $t('vueNodesBanner.message') }}</span>
+      <span class="pl-2">{{ $t('vueNodesBanner.title') }}</span>
+      <span class="pl-1.5 hidden md:inline">{{
+        $t('vueNodesBanner.desc')
+      }}</span>
       <Button
         class="cursor-pointer bg-transparent rounded h-7 px-3 border border-white text-white ml-4 text-xs"
         @click="handleTryItOut"