From 1717ecc4d1dd1187cbdff3aad1f99e451ee11475 Mon Sep 17 00:00:00 2001
From: Misthaa <mathis.koro@gmail.com>
Date: Sat, 21 Sep 2024 22:41:10 +0200
Subject: [PATCH] Site :     - Add "Click on the screen to play" on home page

---
 .../server/server/templates/homePage.html     |  2 ++
 .../nginx/static/style/homePage/home.css      | 35 +++++++++++++++++--
 2 files changed, 35 insertions(+), 2 deletions(-)

diff --git a/docker-compose/requirements/djangoserver/file/server/server/templates/homePage.html b/docker-compose/requirements/djangoserver/file/server/server/templates/homePage.html
index 3e2f273..f798354 100644
--- a/docker-compose/requirements/djangoserver/file/server/server/templates/homePage.html
+++ b/docker-compose/requirements/djangoserver/file/server/server/templates/homePage.html
@@ -66,6 +66,8 @@
 		</div>
 		
 	</div>
+
+<div class="centered-text">Click on the screen to play</div>
 <div id="chatButton">
 	<span class="notification-badge"></span>
 	<img src="/static/img/homePage/bulle.png">
diff --git a/docker-compose/requirements/nginx/static/style/homePage/home.css b/docker-compose/requirements/nginx/static/style/homePage/home.css
index eaa2f7e..3c4ccfe 100644
--- a/docker-compose/requirements/nginx/static/style/homePage/home.css
+++ b/docker-compose/requirements/nginx/static/style/homePage/home.css
@@ -3,10 +3,10 @@
 /*                                                        :::      ::::::::   */
 /*   home.css                                           :+:      :+:    :+:   */
 /*                                                    +:+ +:+         +:+     */
-/*   By: edbernar <edbernar@student.42angouleme.    +#+  +:+       +#+        */
+/*   By: marvin <marvin@student.42.fr>              +#+  +:+       +#+        */
 /*                                                +#+#+#+#+#+   +#+           */
 /*   Created: 2024/08/07 12:00:55 by edbernar          #+#    #+#             */
-/*   Updated: 2024/09/20 00:07:01 by edbernar         ###   ########.fr       */
+/*   Updated: 2024/09/21 20:08:48 by marvin           ###   ########.fr       */
 /*                                                                            */
 /* ************************************************************************** */
 
@@ -28,6 +28,26 @@
 	}
 }
 
+@keyframes fadeInUp {
+	0% {
+	  opacity: 0;
+	  transform: translate(-50%, 100%);
+	}
+	100% {
+	  opacity: 1;
+	  transform: translate(-50%, 0);
+	}
+  }
+
+@keyframes blink {
+    0% {
+        opacity: 1;
+    }
+    100% {
+        opacity: 0.3;
+    }
+}
+  
 ::-webkit-scrollbar {
 	width: 10px;
 }
@@ -375,6 +395,17 @@ button {
     height: auto;
 }
 
+.centered-text {
+	position: absolute;
+	bottom: 65px;
+	left: 50%;
+	transform: translateX(-50%);
+	font-size: 24px;
+	color: white;
+	opacity: 0;
+	animation: fadeInUp 1.5s forwards 12s, blink 1.5s 13.5s infinite alternate;
+  }
+
 .info {
     position: absolute;
     bottom: 0;