From 86d80ec0cd5cf38d8bb297cb8c892fc32d4cda1f Mon Sep 17 00:00:00 2001
From: Stone-Red-Code <56473591+Stone-Red-Code@users.noreply.github.com>
Date: Tue, 11 May 2021 18:11:57 +0200
Subject: [PATCH] Added more effects because "YES"

---
 footer.html |  4 ++--
 style.css   | 32 ++++++++++++++++++++++----------
 2 files changed, 24 insertions(+), 12 deletions(-)

diff --git a/footer.html b/footer.html
index c57a53c..1519a6c 100644
--- a/footer.html
+++ b/footer.html
@@ -6,7 +6,7 @@
             <div>Get in contact:</div>
         </div>
         <div class="col d-flex justify-content-end">
-            <div>
+            <div id="contactItems">
                 <a href="http://github.com/Stone-Red-Code"><img
                         src="Icons/icons8-github-60.png" alt="Discord icon" height="30"/></a>
                 <a href="http://discord.com/users/374173830819872789"><img
@@ -19,7 +19,7 @@
             <h3>About me</h3>
             <p class="text-white-50">I'm just a random guy who likes programming and watching anime.</p>
         </div>
-        <div class="col-sm-4">
+        <div class="col-sm-4" id="Tools">
             <h3>Languages & Tools:</h3>
             <a href="https://docs.microsoft.com/en-us/dotnet/csharp"><img
                     src="https://img.icons8.com/color/50/000000/c-sharp-logo.png" alt="C Sharp icon" height="40" /></a>
diff --git a/style.css b/style.css
index 1a96280..eb685cf 100644
--- a/style.css
+++ b/style.css
@@ -52,11 +52,21 @@ footer {
 .jumbotron {
     animation-name: fadeGray;
     background: #dadde0;
-    transition: background-color 0.5s ease-out 100ms;
+    transition: background-color 0.5s ease-out 100ms, filter 0.5s ease-out 100ms;
+    filter: none;
 }
 
 .jumbotron:hover {
     background-color: #ffffff;
+    filter: drop-shadow(0px 0px 0.4rem #dadde0);
+}
+
+#Tools>a>img {
+    transition: all 0.2s;
+}
+
+#Tools>a>img:hover {
+    transform: scale(1.1)
 }
 
 #quotes {
@@ -70,6 +80,11 @@ footer {
     background-color: rgba(255, 255, 255, 0.12);
     border-radius: 0.3rem;
     visibility: hidden;
+    transition: filter 0.5s ease-out 100ms;
+}
+
+#quotes:hover {
+    filter: drop-shadow(0px 0px 1rem darkgray);
 }
 
 .fade-in {
@@ -97,9 +112,12 @@ h3 {
     word-wrap: break-word;
 }
 
-.contact>p {
-    color: white;
-    padding-left: 10px;
+#contactItems>a>img {
+    transition: transform 0.5s;
+}
+
+#contactItems>a>img:hover {
+    transform: scale(1.15);
 }
 
 .navbar-light .navbar-nav .nav-link {
@@ -112,20 +130,14 @@ a:link {
     text-decoration: underline;
 }
 
-/* visited link */
-
 a:visited {
     color: gray;
 }
 
-/* mouse over link */
-
 a:hover {
     color: black;
 }
 
-/* selected link */
-
 a:active {
     color: rgb(180, 180, 180);
 }