feat: make visited name purple & link pink (#436)

* make visited name purple & link pink

* move styles into PersonDeets

Co-authored-by: Andrew Luca <thendrluca@gmail.com>

src/components/Person.js

@@ -15,8 +15,9 @@ export default function Person({ person, currentTag }) {
           <img width="50" height="50" src={img} alt={person.name} />
           <h3>
             <a href={person.url} target="_blank" rel="noopener noreferrer">
-              {person.name} 
-            </a> {person.emoji}
+              {person.name}
+            </a>{' '}
+            {person.emoji}
           </h3>
           <a
             target="_blank"
@@ -109,6 +110,9 @@ const PersonInner = styled.div`
   padding: 2rem;
   h3 {
     margin: 0;
+    a:visited {
+      color: var(--purple);
+    }
   }
   header {
     display: grid;
@@ -134,7 +138,8 @@ const PersonInner = styled.div`
       text-overflow: ellipsis;
       max-width: 100%;
       overflow: hidden;
-      :hover {
+      :hover,
+      :visited {
         color: var(--pink);
       }
     }

src/components/layout.js

@@ -73,7 +73,7 @@ export default Layout;
 // Global Styles
 const GlobalStyle = createGlobalStyle`
   html {
-    --purple: #1e1f5c;
+    --purple: #b066ff;
     --blue: #203447;
     --lightblue: #1f4662;
     --blue2: #1C2F40;
@@ -89,7 +89,6 @@ const GlobalStyle = createGlobalStyle`
   body {
     font-size: 2rem;
     overflow-y: scroll;
-    /* overflow-x: hidden; */
   }
   h1,h2,h3,h4,h5,h6 {
     font-weight: 500;