chore(docs): add soon badges

docs/components/organisms/SectionContentItem.vue

@@ -13,8 +13,9 @@
     >
       <img loading="lazy" :src="image" :alt="`A ${title} image`">
     </InjectComponent>
-    <h3 class="mb-1 text-center text-body-lg lg:text-body-xl font-bold">
+    <h3 class="relative inline-flex mb-1 text-center text-body-lg items-center lg:text-body-xl font-bold">
       {{ title }}
+      <span v-if="soon" class="absolute -right-48px inline-flex items-center mt-1px px-1.5 py-0.5 rounded text-xs font-medium font-mono bg-cloud-surface dark:bg-sky-dark dark:text-white">soon</span>
     </h3>
     <p class="text-center text-sm lg:text-base mb-4">
       {{ description }}
@@ -35,6 +36,10 @@ export default defineComponent({
       type: String,
       default: ''
     },
+    soon: {
+      type: Boolean,
+      default: false
+    },
     hoverClass: {
       type: String,
       default: ''

docs/content/index.md

@@ -53,6 +53,7 @@ Nuxt 3 has been re-architected with a smaller core and optimized for faster perf
   ::
   ::section-content-item
   ---
+  soon: true
   title: Hybrid
   description: 'Incremental Static Generation and other advanced modes are now possible.'
   image: IconHybrid
@@ -85,6 +86,7 @@ Nuxt 3 has been re-architected with a smaller core and optimized for faster perf
   ::
   ::section-content-item
   ---
+  soon: true
   title: Nuxt Devtools
   description: 'Work faster with info and quick fixes right in the browser.'
   image: IconDevtools