Restyling tos (start)

src/views/documentation/HelpAndContact.vue

@@ -1,16 +1,20 @@
 <template>
-  <div class="DocContainer">
-    <h1 class="DocTitle py-10">Aide et Contact</h1>
-    <p class="text-justify">
+  <div class="relative pb-5"> 
+    <img src="/images/hutopymedia/tospage/headerbackground.png" class="mx-auto block max-w-[1000px] shadow-2xl rounded-none md:rounded-2xl" alt="">
+    <h1 class="h1-tos py-10 absolute inset-0 flex items-center justify-center text-white uppercase">Aide et Contact</h1>
+  </div>
+
+  <div class="mx-auto max-w-[1000px] px-4">
+    <p class="text-justify p-tos">
       Bienvenue dans notre espace d'assistance ! Que vous soyez un créateur à la recherche de conseils pour optimiser votre présence sur Hutopy, ou un utilisateur curieux d'en apprendre plus sur notre plateforme, vous êtes au bon endroit. Notre objectif est de vous fournir tout le soutien nécessaire pour que votre expérience sur Hutopy soit aussi enrichissante et agréable que possible.
     </p>
 
-    <h2 class="SubTitle">FAQ (Foire Aux Questions)</h2>
+    <h2 class="h2-tos">FAQ (Foire Aux Questions)</h2>
     <p class="text-justify">
       Retrouvez les réponses aux questions les plus fréquemment posées concernant l'utilisation d’Hutopy, les fonctionnalités de la plateforme, les options de monétisation, et plus encore. Consulter la FAQ
     </p>
 
-    <h2 class="SubTitle">Contactez-Nous</h2>
+    <h2 class="h2-tos">Contactez-Nous</h2>
     <p class="text-justify">
       Nous sommes toujours ravis d'entendre nos utilisateurs ! Que ce soit pour partager vos retours, poser une question spécifique, ou demander des renseignements sur des partenariats, n'hésitez pas à nous contacter.
     </p>
@@ -20,7 +24,7 @@
       - Suivez-nous pour rester informé et interagir avec notre communauté.
     </p>
 
-    <h2 class="SubTitle">Assistance Technique</h2>
+    <h2 class="h2-tos">Assistance Technique</h2>
     <p class="text-justify">
       Rencontrez-vous un problème technique ?
       Notre équipe d'assistance est là pour vous aider : <a href="mailto:support@hutopy.com" style="color: #a30e79;">support@hutopy.com</a>
@@ -30,3 +34,10 @@
     </p>
   </div>
 </template>
+
+<style>
+@import '@/cssstyle/tosstyle.css';
+</style>
+
+<script setup lang="ts">
+</script>