Added my own picture

The final piece to complete everything

src/components/footer.vue

@@ -34,7 +34,7 @@
 
       <div id="footer_right_div">
         <div id="footer_picture">
-          <img src="https://picsum.photos/50/50">
+          <img :src="meImg">
         </div>
         <div id="language_selection_div">
           <img :src="frFlagSvg" @click="changeLanguage('fr')"/>
@@ -58,6 +58,8 @@
   import social from './home/libs/social.vue';
   import music from './footer/music.vue';
 
+  import meImg from '@/assets/img/me/full.png'
+
   import mailSvg from '@/assets/img/mail.svg';
   import lineImg from '@/assets/img/line.png';
   import githubSvg from '@/assets/img/github.svg';
@@ -194,7 +196,7 @@
         min-height: 100px;
         margin-left: auto;
         display: flex;
-        flex-direction: column;
+        flex-direction: row; /* Change here to restore row of flags under the picture */
         justify-content: center;
         gap: 20px;
     }
@@ -202,19 +204,21 @@
       text-align: center;
     }
     #footer_picture > img{
+        /*height: 100px;*/
         width: 100px;
-        height: 100px;
     }
     #language_selection_div{
       display: flex;
       flex-direction: row;
       flex-wrap: wrap;
-      min-width: fit-content;
+      /*min-width: fit-content;*/
+      width: 120px;/* Change here to restore row of flags under the picture */
       gap: 7px;
+      max-height: 100px;/* Change here to restore row of flags under the picture */
+      align-items: center;
     }
     #language_selection_div img{
       width: 50px;
-      height: 50px;
       cursor: pointer;
     }
 

src/components/header.vue

@@ -3,7 +3,7 @@
     <div id="header_content">
         <RouterLink to="/">
             <div id="header_picture">
-                <img src="https://picsum.photos/50/50"/>
+                <img :src="meIcon"/>
             </div>
         </RouterLink>
     </div>
@@ -12,6 +12,7 @@
 
 <script setup>
     import { RouterLink } from 'vue-router';
+    import meIcon from '@/assets/img/me/icon.png';
 </script>
 
 <style scoped>

src/components/home/welcome.vue

@@ -3,7 +3,7 @@
       <!--<p id="random_citation">Random Sentence</p>-->
 
         <div class="" id="name_div">
-            <div id="profile_picture"><img src="https://picsum.photos/200" height="100%" width="100%"></div>
+            <div id="profile_picture"><img :src="meIcon" height="100%" width="100%"></div>
            
             <div id="name_div_right_container">
               <div class="" id="welcome_text_div">
@@ -31,6 +31,7 @@
   import lineImg from '@/assets/img/line.png';
   import githubSvg from '@/assets/img/github.svg';
   import arrowSvg from '@/assets/svg/arrow_down.svg';
+  import meIcon from '@/assets/img/me/icon.png';
 
   const i18n = useI18n();