From 531211038c9da768bc696d8bc12fe18e83ae1665 Mon Sep 17 00:00:00 2001
From: thaaoblues <thaaoblues81@gmail.com>
Date: Fri, 28 Apr 2023 18:14:12 +0200
Subject: [PATCH] better text zone, menu tests

---
 assets/css/menu.css     | 64 +++++++++--------------------------------
 assets/css/template.css | 17 ++++++++---
 2 files changed, 26 insertions(+), 55 deletions(-)

diff --git a/assets/css/menu.css b/assets/css/menu.css
index d31ed9c..5747ba4 100644
--- a/assets/css/menu.css
+++ b/assets/css/menu.css
@@ -1,7 +1,7 @@
 .menu {
 	position: fixed;
 	left: 0;
-	bottom: -15%;
+	bottom: -12vh;
 	width: 100%;
 	height: 25vh;
 	z-index: 2;
@@ -9,11 +9,6 @@
 	transition: transform 0.3s;
 }
 
-.menu-svg{
-	width: 	30vw;
-	height: 40vh;
-
-}
 
 #menu ul {
 	flex-wrap: wrap;
@@ -22,15 +17,14 @@
 	list-style: none;
 	display: flex;
 	justify-content: center;
-	background-color: transparent;
 	color: #fff;
-	height: 50px;
+	height: auto;
 	align-items: center;
-	background-color: rgba(0, 0, 0, 0.7); /* Add a semi-transparent background color for readability */
-
+	background-color: rgba(64, 98, 63, 0.7); /* Add a semi-transparent background color for readability */
+	bottom: 5vh;
 }
 
-@media only screen and (max-width: 600px) {
+@media all and (max-width: 800px) {
 	/* Add styles for smartphones screens */
 	#menu ul {
 	  height: auto;
@@ -41,7 +35,8 @@
 	#menu li {
 	  margin: 5px 0;
 	}
-  }
+
+}
 
 #menu li {
 margin: 0 10px;
@@ -54,52 +49,19 @@ margin: 0 10px;
 	padding: 10px; /* Add some padding for better readability and clickable area */
 	color: #c25151;
 	text-decoration: none;
-	background-image: url('/assets/img/colonne.svg'); /* Add this line to set the link background image */
+	background-image: url('/assets/img/buisson.svg'); /* Add this line to set the link background image */
 	background-repeat: no-repeat;
 	background-position: center;
 	background-size: cover;
 }
+
+#menu a:hover{
+	color: #c22828;
+	transform: translateY(-2px);
+}
   
 
 
-
-
-
-
-.menu-link{
-	margin-left: 10px;
-	width: 100%;
-	position: absolute;
-}
-
-.menu-link use {
-	transition: transform 50ms;
-	transform-origin: center;
-}
-
-.menu-link.menu-bottom-line use {
-	transform-origin: bottom;
-}
-
-.menu-link text {
-	transition: transform 50ms;
-}
-
-.menu .menu-link:hover text {
-	fill: #FFDC00;
-	transform: translateY(-1px);
-}
-
-.menu-link:hover use {
-	transform: scaleY(1.1);
-
-}
-
-.menu svg {
-	overflow: visible;
-}
-
-
 .mobile-menu {
 	display: block;
 	position: fixed;
diff --git a/assets/css/template.css b/assets/css/template.css
index 8eaa843..a858768 100644
--- a/assets/css/template.css
+++ b/assets/css/template.css
@@ -11,11 +11,11 @@
 .zone_txt {
 	display: block;
 	background-color: rgba(88, 159, 218, 0.798);
-	width: 80vw;
+	width: 90vw;
 	margin-left: auto;
 	margin-right: auto;
-	padding: 50px;
-	font-size: 1.2rem;
+	padding: 5vw;
+	font-size: 2rem;
 	margin-top: 40px;
 	border-radius: 15px;
 	color: black;
@@ -39,10 +39,19 @@ body {
 	min-height: 100vh;
 
 	background-attachment: fixed;
-	background-color: #bdc7f3;
+	background-color: #ffffff;
 	background-image: url("/assets/img/background.svg");
 }
 
+/* papier peint pour petits écrans (smartphones) */
+@media all and (max-width: 800px) {
+
+	body {
+		background-image: url("/assets/img/asterix.svg");
+		background-repeat: space;
+	}
+}
+
 
 main {
 	text-align: center;