From 30aeaf67a707b1798bccf766836fb686233942df Mon Sep 17 00:00:00 2001
From: johan <johan@rezo-rm.fr>
Date: Thu, 15 Dec 2022 15:15:02 +0100
Subject: [PATCH] fixed hover effect

---
 static/css/main.css | 15 +++++++++------
 static/index.html   |  1 +
 static/js/anim.js   |  4 +++-
 3 files changed, 13 insertions(+), 7 deletions(-)

diff --git a/static/css/main.css b/static/css/main.css
index fe0f3e6..600c2a2 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -2,6 +2,7 @@
 
 * {
     box-sizing: border-box;
+    z-index: 0;
 }
 
 body {
@@ -117,19 +118,21 @@ img {
 
 .prank-button a {
     color: black;
+    position: relative;
 }
 
 .prank-button a:hover {
     text-decoration: none;
 }
 
-.prank-button a:hover:after {
-    content: url("../img/circle-hand.png");
+.hover-circle {
     position: absolute;
-    z-index: 5;
-    top: 660px;
-    left: 410px;
-    transform: scale(0.5);
+    z-index: 10;
+    top: -50px;
+    left: 0px;
+    max-height: 100%;
+    max-width: 100%;
+    display: none;
 }
 
 .banner {
diff --git a/static/index.html b/static/index.html
index 84c3d03..3de7555 100644
--- a/static/index.html
+++ b/static/index.html
@@ -38,6 +38,7 @@
                             <a id="prank-button">
                                 Demander une mission !
                                 <img src="img/underline-red.png" class="underline"/>
+                                <img src="img/circle-hand.png" class="hover-circle"/>
                             </a>
                         </div>
                         <p id="prank-desc">
diff --git a/static/js/anim.js b/static/js/anim.js
index 202c089..f7f7610 100644
--- a/static/js/anim.js
+++ b/static/js/anim.js
@@ -10,5 +10,7 @@ $(window).on("load", function() {
     $(document).on("click", function() {
         type.options({speed: 1});
     });*/
+    
+});
 
-});
\ No newline at end of file
+$("#prank-button").hover(function () { $('.hover-circle').fadeIn(100) }, function(){ $('.hover-circle').fadeOut(100) });
\ No newline at end of file