From 8b012757f3cf71e67a23416b898e583623748295 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?J=C3=A9r=C3=A9my=20CHOMAZ?= <jeremy.chomaz20@gmail.com>
Date: Fri, 5 Apr 2024 15:48:39 +0200
Subject: [PATCH] =?UTF-8?q?Ajustement=20de=20la=20section=20Son=20pourque?=
 =?UTF-8?q?=20les=20emplacements=20soient=20plus=20optimis=C3=A9s?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ui/src/components/BrainBlastBar.vue |  2 +-
 ui/src/plugins/router.js            |  2 +-
 ui/src/views/GameDisplay.vue        |  3 ++
 ui/src/views/SettingsView.vue       | 50 +++++++++++++++++++++++------
 4 files changed, 45 insertions(+), 12 deletions(-)

diff --git a/ui/src/components/BrainBlastBar.vue b/ui/src/components/BrainBlastBar.vue
index ca8e097..563ca13 100644
--- a/ui/src/components/BrainBlastBar.vue
+++ b/ui/src/components/BrainBlastBar.vue
@@ -1,7 +1,7 @@
 <template>
   <v-app-bar :elevation="5" height="50">
     <RouterMenu />
-    <v-app-bar-title v-if="$route.name !== 'Home'">Brain Blast</v-app-bar-title>
+    <v-app-bar-title v-if="$route.name !== 'Accueil'">Brain Blast</v-app-bar-title>
 
     <template v-slot:append>
       <v-btn icon @click="toggleTheme">
diff --git a/ui/src/plugins/router.js b/ui/src/plugins/router.js
index ced6885..76ba658 100644
--- a/ui/src/plugins/router.js
+++ b/ui/src/plugins/router.js
@@ -6,7 +6,7 @@ const router = createRouter({
   routes: [
     {
       path: '/',
-      name: 'Home',
+      name: 'Accueil',
       component: HomeView
     },
     {
diff --git a/ui/src/views/GameDisplay.vue b/ui/src/views/GameDisplay.vue
index e69de29..27e0f69 100644
--- a/ui/src/views/GameDisplay.vue
+++ b/ui/src/views/GameDisplay.vue
@@ -0,0 +1,3 @@
+<template>
+    
+</template>
\ No newline at end of file
diff --git a/ui/src/views/SettingsView.vue b/ui/src/views/SettingsView.vue
index 92ef5b2..5a3ad49 100644
--- a/ui/src/views/SettingsView.vue
+++ b/ui/src/views/SettingsView.vue
@@ -1,20 +1,22 @@
 <template>
-
-    <h1 class="title mb-4 ml-5 mt-5">Paramètres</h1>
+    <v-label class="title-style-1">Paramètres</v-label>
     <v-divider :thickness="2" class="border-opacity-100" color="primary"/>
-    <h2 class="title ml-10 mb-5 mt-5">Son</h2>
-    <div style="display: flex; align-items: center;">
-      <v-switch label="Activer le son intégré" v-model="EmbeddedSound" class="ml-15" color="primary"/>
-      <div style="width: 250px; margin-left: 16px;">
-        <v-slider class="ml-15" :disabled="EmbeddedSound === false" v-model="EmbeddedSoundVolume" color="primary"/>
+    <v-label class="title-style-2">Son</v-label>
+    <div class="mutltiple-per-line">
+      <v-switch hide-details label="Activer le son intégré" v-model="EmbeddedSound" class="ml-15" color="primary"/>
+      <div>
+        <v-slider hide-details class="v-slider-style ml-15" :disabled="EmbeddedSound === false" v-model="EmbeddedSoundVolume" color="primary"/>
       </div>
     </div>
     <v-switch label="Activer le son MQTT" v-model="MQTTSound" class="ml-15" color="primary"/>
+
     <v-divider />
-    <h2 class="title ml-10 mb-5 mt-5">Affichage</h2>
+    <v-label class="title-style-2">Affichage</v-label>
+
     <v-switch label="Activer l'affichage des sattelites" v-model="SattelitesDisplay" class="ml-15" color="primary"/>
     <v-divider />
-    <h2 class="title ml-10 mb-5 mt-5">MQTT</h2>
+    <v-label class="title-style-2">MQTT</v-label>
+    
     <div style="display: flex; align-items: center;">
       <v-icon v-model="MQTTBrokerState" class="ml-15 mb-5" color="error" icon="record">mdi-record</v-icon>
       <v-label class="ml-2 mb-10 mt-5">Etat du serveur MQTT</v-label>
@@ -68,4 +70,32 @@
     } 
 });
  
-</script>
\ No newline at end of file
+</script>
+
+<style>
+.title-style-1{
+  margin-top: 20px;
+  margin-bottom: 16px;
+  margin-left: 20px;
+  font-size: 30px;
+  opacity: 100%;
+  font-weight: 500;
+}
+.title-style-2{
+  margin-top: 20px;
+  margin-bottom: 10px;
+  margin-left: 40px;
+  font-size: 25px;
+  opacity: 100%;
+  font-weight: 500;
+}
+.mutltiple-per-line{
+  display: flex;
+  align-items: center;
+}
+.v-slider-style{
+  width: 250px; 
+  margin-left: 16px;
+  padding-top: px;
+}
+</style>
\ No newline at end of file