big css changes

added some nice effects :)

index.html

@@ -2,6 +2,7 @@
 
 <header>
     <link rel = "stylesheet" href = "pages\mainpage.css">
+    <link rel = "stylesheet" href = "pages\effects.css">
     <link rel = "icon" href = "images\Icon.ico">
 
     <meta charset="UTF-8">
@@ -101,18 +102,18 @@
 
 
     <div class = "textBox" id= "outroText">
-        I hope you like my work! If you ever want to contact me, my Twitter, email and Github can be found below.
+        I hope you like my work! If you ever want to contact me, my Email, Github and Social Medias can be found below.
     </div>  
 
     <div id = "socialBar">
-        <!-- please dont follow me if you see this, i want this to be a work only twitter account,
-        <a href = "https://twitter.com/Wi__Ro" target="_blank" style = "color:#ffd256;">Twitter</a>
-        -->
         <a href = "https://twitter.com/Wi__Ro" target="_blank">Twitter</a>
         &NonBreakingSpace;
         <a href="mailto:WillowRo@outlook.com" target="_blank">Email</a>
         &NonBreakingSpace;
         <a href="https://github.com/Wil-Ro" target="_blank">Github</a>
+        &NonBreakingSpace;
+        <a href = "https://dev.to/willowro" target="_blank">Dev.to</a>
+
         &NonBreakingSpace;
         <a href = "./pages/CVPage.html">CV</a>
     </div>

pages/effects.css

@@ -0,0 +1,44 @@
+a:hover:not(.galleryLink){
+    background-color: #ffd256;
+    color: #181818;
+    border-radius: 2px;
+    text-decoration: none;
+}
+
+span{
+    background-color: #ffd256;
+    color: #181818;
+    border-radius: 2px;
+}
+
+span:hover{
+    background-color: #181818;
+    color: #ffd256;
+    border-radius: 2px;
+    outline: solid 1px #ffd256;
+}
+
+::selection {
+    background-color: #ffd256;
+    color: #181818;
+}
+
+::-moz-selection {
+    background-color: #ffd256;
+    color: #181818;
+}
+
+::-o-selection {
+    background-color: #ffd256;
+    color: #181818;
+}
+
+::-ms-selection {
+    background-color: #ffd256;
+    color: #181818;
+}
+
+::-webkit-selection {
+    background-color: #ffd256;
+    color: #181818;
+}

pages/mainpage.css

@@ -13,6 +13,7 @@ body{
     color: #ffd256;
     background-color: #181818;
     font-family: "roboto";
+    line-height: 1.3;
 }
 
 button{
@@ -21,6 +22,7 @@ button{
     color: #ffd256;
 }
 
+
 button:focus {
     border: none;
     outline: none;
@@ -329,7 +331,7 @@ h1{
 
     #socialBar{
         justify-content: center;
-        font-size: 4vw;
+        font-size: 5vw;
         margin-bottom: 0.8vh;
     }
 }