Move brainblast vue app to ui repository

ui/src/views/AboutView.vue

@@ -0,0 +1,24 @@
+<template>
+  <div class="about">
+    <h1>This is an about page</h1>
+    <hr/>
+    <p>
+      Exemple d'une page
+    </p><p>
+      Ou il y a un scroll
+    </p><p>
+      Pour mettre en valeur leu footer fixe en bas de page
+    </p><p>
+      Cette page n'a aucun interet et pourra etre supprimée
+    </p>
+  </div>
+</template>
+
+<style>
+@media (min-width: 1024px) {
+  .about {
+    min-height: 100vh;
+    align-items: center;
+  }
+}
+</style>

ui/src/views/GameControl.vue

@@ -0,0 +1,42 @@
+<template>
+<v-container>
+  <v-row no-gutters>
+    <v-col class="align-start">
+      <card-control />
+    </v-col>
+    <v-col class="pl-3">
+      <card-soundboard />
+    </v-col>
+  </v-row>
+</v-container>
+<v-container>
+  <v-row no-gutters>
+    <v-col>
+      <card-solution />
+    </v-col>
+  </v-row>
+</v-container>
+</template>
+
+<script setup>
+
+import CardSolution from '@/components/CardSolution.vue'
+import CardControl from '@/components/CardControl.vue'
+import CardSoundboard from '@/components/CardSoundboard.vue';
+
+</script>
+
+<style>
+@media (min-width: 1024px) {
+  .card__title.primary {
+      background-color: #2979FF; /* Changez la couleur en fonction de votre thème */
+  }
+  .card__title.feedback {
+      background-color: #2E7D32; /* Changez la couleur en fonction de votre thème */
+  }
+  .btn{
+    border-radius:30px!important;
+    background-color: #2979FF; /* Changez la couleur en fonction de votre thème */
+  }
+}
+</style>

ui/src/views/HomeView.vue

@@ -0,0 +1,11 @@
+<template>
+    <v-img width="1645" src="../assets/BrainBlast-For-HomeView-Alpha.png"></v-img>
+</template>
+
+<script>
+export default {
+  name: 'VotreComposant', // Assurez-vous de donner un nom à votre composant
+  // Votre logique JavaScript ici, par exemple des méthodes, des données, etc.
+};
+</script>
+

ui/src/views/MQTTDebugView.vue

@@ -0,0 +1,21 @@
+<template>
+  <div>
+    <!-- Zone pour publier sur MQTT -->
+    <PublishMQTTComponent />
+
+    <!-- Zone pour afficher la console MQTT -->
+    <MQTTConsoleComponent />
+  </div>
+</template>
+
+<script>
+import PublishMQTTComponent from '@/components/MQTTDebugPublish.vue' // Importer le composant pour publier sur MQTT
+import MQTTConsoleComponent from '@/components/MQTTDebugConsole.vue' // Importer le composant pour la console MQTT
+
+export default {
+  components: {
+    PublishMQTTComponent, // Composant pour publier sur MQTT
+    MQTTConsoleComponent // Composant pour la console MQTT
+  }
+}
+</script>