various style and text improvements

components/BackToTheTop.vue

@@ -29,14 +29,14 @@ const onTopIntersect = (intersect: boolean) => {
 
 .back-to-the-top {
   position: fixed;
-  right: 15%;
+  right: 5%;
   bottom: 58px;
   z-index: 100;
-  height: 48px;
+  height: 48px !important;
   width: 48px;
   border-radius: 32px;
-  background: rgb(var(--v-theme-primary));
-  color: rgb(var(--v-theme-on-primary));
+  background: rgb(var(--v-theme-primary-alt));
+  color: rgb(var(--v-theme-on-primary-alt));
 
   @media (max-width: 1350px) {
     right: 5%;

components/BadgeSection.vue

@@ -287,7 +287,7 @@ const cols = [
   justify-content: flex-start;
   margin: 12px 0;
   padding: 12px 6px;
-  border: solid 1px rgba(var(--v-theme-primary-alt), 0.3);
+  border: solid 1px rgba(var(--v-theme-on-primary), 0.8);
   border-radius: 16px;
   flex: 1;
 

components/Footer.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="spacer" />
   <v-footer no-gutters :height="36">
-    Olivier Massot, 2024 - Built with Nuxt.js
+    Olivier Massot, 2024-2025 - Built with Nuxt.js
   </v-footer>
 </template>
 
@@ -19,6 +19,6 @@ footer {
   bottom: 0;
   width: 100%;
   height: 50px;
-  background-color: rgba(var(--v-theme-primary-alt), 0.1);
+  background-color: rgb(var(--v-theme-primary-alt));
 }
 </style>

lang/en.json

@@ -6,8 +6,8 @@
   "intro_part_1": "Since 2011, my professional journey has allowed me to develop very varied skills from a technical point of view : development, system administration, QA and continuous integration, database management, search engines..., but also from a managerial point of view : supervision, tutoring, agile management, collective intelligence, meeting animation.",
   "intro_part_2": "I have been led to work with various services: water services, waste management, rural works, conservatories and music schools, telecom networks.",
   "intro_part_3": "I place great importance on the development of a team spirit, continuous improvement, and the realization of a thorough, tested, documented work.",
-  "intro_part_4": "I currently maintain the open source libraries <a href='https://github.com/olinox14/path-php' target='_blank'>Path-PHP</a> and <a href='https://github.com/olinox14/xdice' target='_blank'>xdice</a>.",
-  "intro_part_5": "Find me on :",
+  "intro_part_4": "I currently maintain the open source libraries <a href='https://github.com/olinox14/path-php' target='_blank'>Path-PHP</a> and <a href='https://github.com/olinox14/xdice' target='_blank'>xdice</a>, and I'm the author of the (unmaintained) <a href='https://github.com/olinox14/FullMd' target='_blank'>FullMD</a> library.",
+  "find_me_on": "Find me on",
   "show_more": "Show more",
   "show_less": "Show less",
   "Find me on Github": "Find me on Github",

lang/fr.json

@@ -6,8 +6,8 @@
   "intro_part_1": "Depuis 2011, mon parcours professionnel m'a permis de développer des compétences très variées, tant d'un point de vue technique : développement, administration système, QA et intégration continue, gestion de bases de données, moteurs de recherche..., que d'un point de vue managérial : encadrement, tutorat, management agile, intelligence collective, animation de réunion.",
   "intro_part_2": "J'ai été amené à travailler avec des services de natures diverses: services des eaux, gestion des déchets, travaux ruraux, conservatoires et écoles de musique, réseaux telecom.",
   "intro_part_3": "J'accorde beaucoup d'importance au développement d'un esprit d'équipe, à l'amélioration continue, et à la réalisation d'un travail abouti, testé, documenté.",
-  "intro_part_4": "Je maintiens actuellement les librairies opensource <a href='https://github.com/olinox14/path-php' target='_blank'>Path-PHP</a> et <a href='https://github.com/olinox14/xdice' target='_blank'>xdice</a>.",
-  "intro_part_5": "Retrouvez moi sur :",
+  "intro_part_4": "Je maintiens actuellement les librairies opensource <a href='https://github.com/olinox14/path-php' target='_blank'>Path-PHP</a> et <a href='https://github.com/olinox14/xdice' target='_blank'>xdice</a>, et suis l'auteur de la librairie (non-maintenue) <a href='https://github.com/olinox14/FullMd' target='_blank'>FullMD</a>.",
+  "find_me_on": "Retrouvez moi sur",
   "show_more": "Voir plus",
   "show_less": "Réduire",
   "Find me on Github": "Retrouvez moi sur Github",

pages/index.vue

@@ -41,11 +41,14 @@
       size="small"
       variant="text"
       :prepend-icon="showLongIntro ? 'fas fa-caret-up' : 'fas fa-caret-down'"
+      :height="36"
       @click="showLongIntro=!showLongIntro"
     >
       {{ showLongIntro ? $t('show_less') : $t('show_more') }}
     </v-btn>
 
+    <h5 class="find-me-on">{{ $t('find_me_on')}} </h5>
+
     <div class="logos mt-3">
       <BannerLogo
         href="https://github.com/olinox14"
@@ -133,9 +136,15 @@ const showLongIntro: Ref<boolean> = ref(false)
 .introduction {
   text-align: justify;
   padding: 36px 64px;
-  border-radius: 16px;
-  background: rgba(var(--v-theme-primary-alt), 0.1);
+  border-radius: 6px;
+  background: rgb(var(--v-theme-primary-alt));
   margin-bottom: 36px;
+  border: solid 1px rgb(var(--v-theme-on-primary-alt));
+  color: rgb(var(--v-theme-on-primary-alt));
+
+  :deep(a) {
+    color: rgb(var(--v-theme-on-primary-alt--clickable));
+  }
 
   div {
     margin-bottom: 16px;
@@ -143,20 +152,28 @@ const showLongIntro: Ref<boolean> = ref(false)
 
   .v-btn {
     width: 100%;
-    margin: 8px auto;
+    margin: 2px auto 16px auto;
   }
 
   :deep(a) {
-    color: rgb(var(--v-theme-on-neutral));
     font-weight: 900;
     text-decoration: none;
   }
 
+  .find-me-on {
+    margin: 16px auto 0 auto;
+    text-transform: uppercase;
+    text-align: center;
+    font-size: 11px;
+  }
+
   .logos {
     display: flex;
     flex-direction: row;
     max-width: 600px;
     margin: 0 auto;
+    justify-content: center;
+    align-items: center;
   }
 }
 

plugins/vuetify.ts

@@ -102,8 +102,9 @@ export const darkTheme: Theme = {
     'primary': '#adb2d2',
     'on-primary': '#404040',
 
-    'primary-alt': '#a9e0d6',
-    'on-primary-alt': '#777777',
+    'primary-alt': '#13263a',
+    'on-primary-alt': '#e6e6e6',
+    'on-primary-alt--clickable': '#ffffff',
 
     'secondary': '#324150',
     'on-secondary': '#f5f5f5',
@@ -113,7 +114,7 @@ export const darkTheme: Theme = {
 
     'neutral': '#131a20',
     'on-neutral': '#cccccc',
-    'on-neutral--clickable': '#cccccc',
+    'on-neutral--clickable': '#e6e6e6',
 
     'neutral-soft': '#090c11',
     'on-neutral-soft': '#cccccc',