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="$q.screen.lt.md && 'font-size: 15px;'" >{{comptence.name}}</span>
+      <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>
       <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/ContactView.vue

@@ -4,8 +4,8 @@
       <TitleComposant label="Contacts" class="q-mt-xl" />
     </a>
     <div class="q-ml-xl text-bold text-h6">
-      <p class="flex items-center" :class="$q.screen.lt.md ? 'q-mr-xl text-subtitle2': ''"><img class="q-mr-xs non-selectable" src="/clement.franckelemon.etu/portfolio-2025/spa/images/Contact/mail.png"/>Clement.Franckelemon@gmail.com</p>
-      <p class="flex items-center" ><img class="q-mr-xs non-selectable" src="/clement.franckelemon.etu/portfolio-2025/spa/images/Contact/telephone.png"/>07 66 55 76 78</p>
+      <p class="flex items-center cursor-pointer" @click="mail" :class="$q.screen.lt.md ? 'q-mr-xl text-subtitle2': ''"><img class="q-mr-xs non-selectable" src="/clement.franckelemon.etu/portfolio-2025/spa/images/Contact/mail.png"/>Clement.Franckelemon@gmail.com</p>
+      <p class="flex items-center cursor-pointer" @click="tel" ><img class="q-mr-xs non-selectable" src="/clement.franckelemon.etu/portfolio-2025/spa/images/Contact/telephone.png"/>07 66 55 76 78</p>
       <a class="text-secondary" href="https://www.linkedin.com/in/cl%C3%A9ment-franckelemon-88976b26b/"><p class="flex items-center"><img class="q-mr-xs non-selectable" src="/clement.franckelemon.etu/portfolio-2025/spa/images/Contact/linkedin.png"/>Linkedin</p></a>
     </div>
   </div>
@@ -14,6 +14,15 @@
 <script setup lang="ts">
 
 import TitleComposant from 'components/TitleComposant.vue'
+
+const mail = () => {
+  window.location.href = `mailto:clement.franckelemon@gmail.com`
+}
+
+const tel = () => {
+  window.location.href = `tel:+330766557678`
+}
+
 </script>
 
 <style scoped>

src/components/HomeView.vue

@@ -8,7 +8,7 @@
     <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>
       <span class="arial text-uppercase" >{{ second }}</span>
-      <span class="text-dark text-h6 text-center" >{{accent}}</span>
+      <span class="text-dark text-h6 text-center" style="line-height: 1.5rem" >{{accent}}</span>
     </div>
   </div>
 </template>