src/components/ComptenceView.vue

@@ -7,7 +7,7 @@
   'col-3': !$q.screen.lt.md
 }" unelevated rounded>
       <img style="max-width: 100%; border-radius: 20px;border: 3px solid #FFFFFF" :style="isActive === comptence.name && 'border-color: #eeea14 !important;'" :src="'/clement.franckelemon.etu/portfolio-2025/spa/'+comptence.src">
-      <span class="q-ma-xs text-h6 text-bold sub-title" style="line-height: 1rem" :style="$q.screen.lt.md && 'font-size: 15px;'" >{{comptence.name}}</span>
+      <span class="q-ma-xs text-h6 text-bold sub-title" style="line-height: 1.2rem" :style="$q.screen.lt.md && 'font-size: 15px;'" >{{comptence.name}}</span>
       <q-popup-proxy v-close-popup @hide="isActive === comptence.name ? isActive = '' : '' " :offset="[10, 10]">
         <div class="q-ma-sm text-secondary text-bold">
           <q-icon name="info" size="md" class="q-mr-xs" />

src/components/HeaderView.vue

@@ -10,7 +10,8 @@
       bordered
       class="bg-secondary"
       >
-        <div class="full-height row justify-evenly q-ml-sm">
+        <q-btn icon="close" class="q-mr-sm q-mt-sm" unelevated @click="openNav = false" style="max-height: 8%" />
+        <div class="full-height row justify-evenly" style="max-height: 90%">
           <HeaderButton class="col-6 row justify-center" icon="home" to="/#accueil" label="Accueil" />
           <HeaderButton class="col-6 row justify-center" icon="person" to="/#presentation" label="Présentation" />
           <HeaderButton class="col-6 row justify-center" icon="school" to="/#formations" label="Formations" />
@@ -19,6 +20,7 @@
           <HeaderButton class="col-6 row justify-center" icon="construction" to="/#projets" label="Projets" />
           <HeaderButton class="col-6 row justify-center" icon="mail" to="/#contacts" label="Contacts" />
         </div>
+        <q-linear-progress v-if="openNav" size="6px" color="accent" class="bg-dark" style="transform-origin: top left; transform: rotate(90deg) translateY(-100%); position: absolute; left: 296px; top: 0; width: 100vh" indeterminate :value="pageAdvanced" />
       </q-drawer>
       <q-btn flat round dense icon="menu" class="q-mr-sm" @click="openNav = !openNav" v-if="$q.screen.lt.md" />
       <div/>

src/components/HomeView.vue

@@ -3,7 +3,7 @@
     <div class="col-3" style="max-width: 450px; width: 75%">
       <img :src="src"
            style="border-radius: 50%; width: 100%; height: 100%; object-fit: cover;"
-           class="full-height full-width">
+           class="full-height full-width shadow-6">
     </div>
     <div class="col-6 column items-center text-h2 text-bold text-secondary" :class="$q.screen.lt.md ? 'text-h4' : 'text-h2' ">
       <span class="arial text-uppercase">{{first}}</span>

src/components/experiences.ts

@@ -5,8 +5,9 @@ export default [
     periode: 'Du 15 avril au 15 juin (≈ 2 mois)',
     position: '15 Bd du Général Leclerc, 59100 Roubaix',
     content: [
-      'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.',
-      'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.'
+      'Dans le cadre d’un stage, j’ai travaillé sur le démarrage d’un projet de logiciel de suivi de stagiaires.',
+      'J’ai eu l’occasion de réaliser l’initialisation de ce nouveau projet au travers de la mise en place de la stack technique des différentes parties du projet (FRONT/BACK/BDD) et d’une organisation au sein d’une équipe de 3 personnes qui évoluera jusqu’à 7.  J’ai eu l’occasion au travers de ce projet de réaliser un POC sur Nuxt et de mettre en place tout le côté FRONT de l’application avec notamment beaucoup de configuration, de la mise en place d’une page non fonctionnelle avec un système de navigation bouchonné le tout devant être responsive, et enfin la mise en place et la configuration Cypress.',
+      'À tout cela j’ai eu l’occasion de contribuer au choix de conception des autres parties tel que le côté BACK pour le choix d’architecture à utiliser, et la BDD pour sa modélisation au travers d’un MVC.'
     ],
     comptences: [
       '/images/Competences/Vue.png',
@@ -21,8 +22,8 @@ export default [
     periode: 'Du 2 septembre au 27 juin',
     position: '15 Bd du Général Leclerc, 59100 Roubaix | 64 Bd de Cambrai, 59100 Roubaix',
     content: [
-      'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.',
-      'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.',
+      'Dans le cadre d’une alternance, j’ai eu l’opportunité de travailler pour Mobilis sur un réseau social dédié à la famille Mulliez, projet ayant débuté bien avant mon arrivée pour lequel j’ai ainsi intégré le projet en route. Ce projet n\'était constitué plus que d’un développeur ainsi qu’un Product Owner et un Tech Lead, à mon entrée.',
+      'J’ai eu l’occasion de réaliser de nombreuses tâches très variées allant du simple ajustement Front-End à l’ajout de nouvelles fonctionnalités mais aussi de correctifs de bugs. Le tout sans oublier les tests autant dans le Back-End que dans le Front-End. Un projet plutôt Front-End mais tout en ayant sa complexité au niveau  Back-End notamment comme par exemple avec les nombreux services reliés à l’application mais aussi au fait que celle-ci possède deux bases de données pouvant parfois avoir des données communes (SQL et NoSQL).'
     ],
     comptences: [
       '/images/Competences/Vue.png',