end of project

src/components/Name.vue

@@ -38,7 +38,7 @@ const burger = useBurgerStore()
 </template>
 
 <style lang="scss" scoped>
-@import "@/style/shared.scss";
+@import '@/style/colors.scss';
 
 .name{
   display:flex;
@@ -47,20 +47,21 @@ const burger = useBurgerStore()
   margin:0 2.4rem;
   
   // border : #f0f solid 1px;
-    & h1{font-family: 'acme', Arial, Helvetica, sans-serif;
-         letter-spacing: 0.2em;
-    font-size: 2.7rem;
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: center;
-    position :relative;
-    color: $page-title;
-    font-weight: bold;
-    margin-top: 0.5em;
-    padding: 0em ;
-    // border : #f0f solid 1px;
-    
-    animation: title-h1 1000ms cubic-bezier(0.2, 0.9, 0.44, 1);
+    & h1{
+      position :relative;
+      display: flex;
+      flex-wrap: wrap;
+      justify-content: center;
+      margin-top: 0.5em;
+      padding: 0em ;
+      font-family: 'acme', Arial, Helvetica, sans-serif;
+      font-size: 2.7rem;
+      font-weight: bold;
+      letter-spacing: 0.2em;
+      color: $title-normal;
+      // border : #f0f solid 1px;
+      animation: title-h1 1000ms cubic-bezier(0.2, 0.9, 0.44, 1);
+      
     & div {
       display:flex;
       margin:0;
@@ -88,7 +89,7 @@ h2{
   font-size:1.7rem;
   font-weight: bold;
   text-align: right;
-  color:$white;
+  color:$main-normal;
   animation: 600ms subtitle 300ms cubic-bezier(.55,.01,.44,1) forwards;
   font-family: 'acme', Arial, Helvetica, sans-serif;
   font-style: italic;
@@ -99,14 +100,15 @@ h2{
 
 @keyframes title-h1{
   0%{
-    margin-top: 1.6em
+    margin-top: 1.6em;
+    color:$renforced-normal
   }
   
 }
 @keyframes title-spans{
   0% {
       transform: rotateY(360deg);
-      // color: $red;
+      // color: $renforced-normal;
     }
     
     100% {