end of project

src/components/Menu.vue

@@ -100,8 +100,8 @@ const toggleMenu = () => {
         v-bind:class="{show : liShow, closing : menuIsClosing}"
         @click="closeMenu()">
         <router-link 
-        :to="{name:'whoAmI'}">
-          Who Am I
+        :to="{name:'profile'}">
+        Profile
         </router-link>
       </li>
       <li
@@ -145,7 +145,7 @@ const toggleMenu = () => {
 </template>
 
 <style lang="scss" scoped>
-@import '../style/shared.scss';
+@import '../style/colors.scss';
 
 .burger{
   display: none;
@@ -154,7 +154,7 @@ const toggleMenu = () => {
   & .button{
     width: 3.5em;
     // height: 4.5em;
-    background-color:$red-light;
+    background-color:$action-normal;
     border: none;
     transition:1s ;
     &:hover{
@@ -166,7 +166,7 @@ const toggleMenu = () => {
       transition:1s ;
       -moz-transition:1s ;
       -webkit-transition:1s ;
-      stroke:$white;
+      stroke:black;
       }
       & .cross{
         stroke-dashoffset: 0 ;
@@ -215,11 +215,11 @@ a{
   //font-style: italic;
   font-weight: 400;
   text-align: center;
-  color : $white;
+  color : $main-normal;
   text-decoration: none;
   &::after{
     content: "";
-    background-color: $red-light;
+    background-color: $action-normal;
     width: 0%;
     margin-left:0;
     height: 4px;
@@ -227,12 +227,12 @@ a{
   }
  
   &:hover, &.router-link-exact-active{
-    color:$red-light;
+    color:$action-normal;
     transition: color 0.25s;
     cursor: pointer;
   }
   &.router-link-exact-active{
-    filter: drop-shadow(0 0 3px $red-light);
+    filter: drop-shadow(0 0 3px $action-normal);
     transition: filter 0.3s;
   }
   &:hover::after, &.router-link-exact-active::after{
@@ -265,7 +265,7 @@ a{
 
 @media (width < 750px ){
   nav.menu-container{
-    //border: $white solid 3px;
+    //border: $main-normal solid 3px;
     display: flex;
     justify-content: flex-end;
     & .burger{