update with nuxt4 for docker-web

app/components/terminal.vue

@@ -0,0 +1,34 @@
+<script>
+export default {
+  props: {
+    terminalContent: {
+      required: true,
+      type: String
+    }
+  }
+}
+</script>
+
+<template>
+  <div
+    class="bg-slate-900 flex-row rounded-xl w-4/5 md:w-96 max-w-full md:min-w-max h-56 md:z-10 -mb-8 md:-mb-0"
+  >
+    <div class="p-3 flex justify-between w-20">
+      <div class="bg-green-400 h-4 w-4 r-1 rounded-full" />
+      <div class="bg-yellow-300 h-4 w-4 r-1 rounded-full" />
+      <div class="bg-red-600 h-4 w-4 r-1 rounded-full" />
+    </div>
+    <div class="flex h-4/5">
+      <code
+        class="w-full text-white font-mono text-base p-4 pt-0 mr-0 overflow-scroll whitespace-pre"
+      >
+        {{ terminalContent }}
+        <span
+          ref="terminal"
+          class="w-2 h-4 bg-white inline-block relative"
+          style="margin-bottom: -2px"
+        />
+      </code>
+    </div>
+  </div>
+</template>