From 6ca2630d068787f511a375fdeb272132313e9297 Mon Sep 17 00:00:00 2001
From: vgaNAR6ta <vga.nar6.ta@gmail.com>
Date: Wed, 4 Mar 2026 03:20:49 +0100
Subject: [PATCH] =?UTF-8?q?add:=20composant=20GeneratedContent.vue=20pour?=
 =?UTF-8?q?=20g=C3=A9rer=20et=20afficher=20la=20partie=20g=C3=A9n=C3=A9rat?=
 =?UTF-8?q?ive?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/GeneratedContent.vue | 31 +++++++++++++++++++++++++++++
 src/components/MainContent.vue      |  5 ++++-
 src/main.js                         |  3 +++
 3 files changed, 38 insertions(+), 1 deletion(-)
 create mode 100644 src/components/GeneratedContent.vue

diff --git a/src/components/GeneratedContent.vue b/src/components/GeneratedContent.vue
new file mode 100644
index 0000000..6af4f2c
--- /dev/null
+++ b/src/components/GeneratedContent.vue
@@ -0,0 +1,31 @@
+<script setup>
+</script>
+
+<template>
+  <div id="generatorContainer">
+    <p>It's empty for now!</p>
+  </div>
+</template>
+
+<style scoped>
+  /*=====================Generated Content CSS*/
+  #generatorContainer{
+    pointer-events: none;
+    position:absolute;
+    inset:0;
+    z-index: 3;
+    background-color: transparent;
+    opacity: 50%;
+    box-sizing: border-box;
+  }
+
+</style>
+
+<script>
+  export default {
+    name : 'GeneratedContent',
+    mounted(){
+      console.log("Content generator is loaded!");
+    }
+  };
+</script>
diff --git a/src/components/MainContent.vue b/src/components/MainContent.vue
index 5ddf46c..5b00349 100644
--- a/src/components/MainContent.vue
+++ b/src/components/MainContent.vue
@@ -3,11 +3,14 @@
 
 <template>
   <div id="mainContainer">
+    <generatorDiv></generatorDiv>
     <div class="windowContainer" id="mainPannel">
       <div class="windowTitle">
         <div class="titleContent">
           <p>./MainContent.333</p>
-          <button type="button" class="titleBtn"> <p>RELOAD</p> </button>
+          <!--<Teleport to="div#generatorContainer">-->
+            <button type="button" class="titleBtn"> <p>RELOAD</p> </button>
+          <!--</Teleport>-->
         </div>
       </div>
     </div>
diff --git a/src/main.js b/src/main.js
index 0387049..baf5021 100644
--- a/src/main.js
+++ b/src/main.js
@@ -6,6 +6,7 @@ import App from './App.vue'
 // import composants
 import MainContent from './components/MainContent.vue'
 import ExtraContent from './components/ExtraContent.vue'
+import GeneratedContent from './components/GeneratedContent.vue'
 
 // création app racine
 const app = createApp(App);
@@ -13,6 +14,8 @@ const app = createApp(App);
 //Composants
 app.component('mainDiv',MainContent);
 app.component('extraDiv',ExtraContent);
+app.component('generatorDiv',GeneratedContent);
+
 
 //Démarrage dans div#app de index.html
 app.mount('#app');