navbar; logo & landing animation

src/components/styles/Global.styled.ts

@@ -8,7 +8,7 @@ export const GlobalStyles = createGlobalStyle`
 
       color-scheme: light dark;
       color: white;
-      background-color: #242424;
+      background-color: ${({ theme }) => theme.colors.bg};
 
       font-synthesis: none;
       text-rendering: optimizeLegibility;
@@ -27,5 +27,33 @@ export const GlobalStyles = createGlobalStyle`
    a {
       color: white;
       text-decoration: none;
+
+      transition: all 0.25s;
+
+      &:hover {
+         color: ${({ theme }) => theme.colors.primary};
+      }
+   }
+
+   img {
+      max-width: 100%;
+      vertical-align: middle;
+   }
+
+   .text {
+      &--accent {
+         color: ${({ theme }) => theme.colors.primary};
+      }
+   }
+
+   @keyframes typing {
+      to { left: 100% }
+   }
+
+   @keyframes blinking {
+      0% { opacity: 0 }
+      50% { opacity: 1 }
+      100% { opacity: 0 }
+
    }
 `;