From f4272ae7fc6caaaa81dbd582c3b512c87ed0369c Mon Sep 17 00:00:00 2001
From: Pierre <pierre.BALLANDRAS@etu.uca.fr>
Date: Wed, 19 Oct 2022 16:34:24 +0200
Subject: [PATCH] Page Presentation

---
 WEB/assets/img/Renard.png              | Bin 0 -> 3645 bytes
 WEB/src/CSS/Presentation.css           |  64 +++++++++++++++++++++++++
 WEB/src/CSS/presenation.css            |   0
 WEB/src/pages/Enigme/Presentation.html |  45 ++++++++++++++++-
 4 files changed, 108 insertions(+), 1 deletion(-)
 create mode 100644 WEB/assets/img/Renard.png
 create mode 100644 WEB/src/CSS/Presentation.css
 delete mode 100644 WEB/src/CSS/presenation.css

diff --git a/WEB/assets/img/Renard.png b/WEB/assets/img/Renard.png
new file mode 100644
index 0000000000000000000000000000000000000000..e5655e31468f349b899060f479477b2824461b44
GIT binary patch
literal 3645
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

literal 0
HcmV?d00001

diff --git a/WEB/src/CSS/Presentation.css b/WEB/src/CSS/Presentation.css
new file mode 100644
index 00000000..6429bec9
--- /dev/null
+++ b/WEB/src/CSS/Presentation.css
@@ -0,0 +1,64 @@
+
+html{
+    scroll-behavior: smooth;
+    background-image: url(../../assets/img/Background5.png);
+    height: 100vh;
+    background-position: center;
+    background-repeat: no-repeat;
+    background-size: cover;
+  }
+  
+
+body{
+    font-family: "Orbitron", sans-serif;
+}
+
+.Presentation{
+    font-family: "Orbitron", sans-serif;
+    color:aliceblue;
+    font-size: 20px;
+}
+
+.Histoire{
+    margin-left: 5% ;
+    width: 80%;
+    display: flex;
+    justify-content: space-around;
+    align-items: center;
+}
+
+.ConsigneRun{
+    margin-left: 5% ;
+    width: 80%;
+    display: flex;
+    justify-content: space-around;
+    align-items: center;
+}
+
+.ConsigneSubmit{
+    margin-left: 5% ;
+    width: 80%;
+    display: flex;
+    justify-content: space-around;
+    align-items: center;
+}
+
+.Consigne{
+    width: 50%;
+}
+
+.Histoire,.ConsigneRun,.ConsigneSubmit{
+    margin-top: 0;
+    margin-left: 20px;
+    background: rgba(0,0,0,0.6);
+    box-sizing: border-box;
+    box-shadow: 0 15px 25px rgba(0,0,0,);
+    border-radius: 10px;
+    padding: 10px;
+    margin-left: 10%;
+    margin-right: 10%;
+}
+
+.sign{
+    margin-bottom: 30px;
+}
\ No newline at end of file
diff --git a/WEB/src/CSS/presenation.css b/WEB/src/CSS/presenation.css
deleted file mode 100644
index e69de29b..00000000
diff --git a/WEB/src/pages/Enigme/Presentation.html b/WEB/src/pages/Enigme/Presentation.html
index fb3d0504..af37169e 100644
--- a/WEB/src/pages/Enigme/Presentation.html
+++ b/WEB/src/pages/Enigme/Presentation.html
@@ -4,9 +4,52 @@
     <meta charset="UTF-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" href="../../CSS/enigme.css">
+    <link rel="stylesheet" href="../../CSS/Home.css">
+    <link rel="stylesheet" href="../../CSS/Presentation.css">
     <title>Presentation</title>
 </head>
 <body>
-    
+    <div class="presentation_titre" id="home">
+        <div class="sign">
+            <h1>
+                <span class="fast-flicker">P</span>
+                <span>resen</span>
+                <span class="flicker">t</span>
+                <span>ation</span>
+            </h1>
+        </div>
+        <div class="Presentation">
+            <div class="Histoire">
+                <img src="../../../assets/img/Renard.png">
+                <div class="Consigne">
+                    <p>Bonjour utilisateur ! Je suis Foxy, une IA créer par Howard Aiken, un chercheur en informatique. J'ai besoin de ton aide ... </p>
+                </div>
+            </div>
+            <br>
+            <div class="ConsigneRun">
+                <div class="Consigne">
+                    <p>Le Bouton Run te permet de tester ton code, n'oublie pas de faire print(nomFonction(x)) pour afficher sur la console !</p>
+                </div>
+                <div class="buttons">
+                    <a class="btn">
+                        <span class="noAnimation">Run</span>
+                    </a>
+                    
+                </div> 
+            </div>
+            <br>
+            <div class="ConsigneSubmit">
+                <div class="buttons">
+                    <a class="btn">
+                        <span class="noAnimation">Submit</span>
+                    </a>
+                </div>
+                <div class="Consigne">
+                    <p>Tu pense avoir réussi ? Tres bien ! Utilise le bouton submit pour faire valider ton code est passer à la prochaine enigme </p>
+                </div> 
+            </div>
+        </div> 
+    </div>
 </body>
 </html>
\ No newline at end of file