ajout du bouton "retour accueil" en jeu

code/game.css

@@ -5,12 +5,6 @@
 .all-container {
     display : flex; 
     justify-content: center;
-    /*
-    align-items: baseline;
-    width : min-content;
-    flex-direction: row;
-    flex-wrap: wrap;*/
-
 }
 
 .day   { background: #eee; color: black; }
@@ -18,57 +12,24 @@
 
 .lightButton {
   position: absolute;
-  right: 0px;
+  right: 5px;
 }
 
 .flex-container {
-    /* We first create a flex layout context */
     display : flex;
     align-items: baseline;
     width : min-content;
     
     margin: 20px;
-    /* Then we define the flow direction 
-       and if we allow the items to wrap 
-     * Remember this is the same as:
-     * flex-direction: row;
-     * flex-wrap: wrap;
-     */
-    
-    
-    /* Then we define how is distributed the remaining space */
 
     flex-direction: column;
   }
-  /*
-  
-  .flex-item {
-    padding: 5px;
-    width: 200px;
-    height: 150px;
-    margin-top: 10px;
-    line-height: 150px;
-    color: white;
-    font-weight: bold;
-    font-size: 3em;
-    text-align: center;
-  }*/
 
   .vitraux {
-    /* We first create a flex layout context */
     display : flex;
     align-items: baseline;
     width : min-content;
     margin: 20px;
-    /* Then we define the flow direction 
-       and if we allow the items to wrap 
-     * Remember this is the same as:
-     * flex-direction: row;
-     * flex-wrap: wrap;
-     */
-    
-    
-    /* Then we define how is distributed the remaining space */
 
     flex-direction: column;
   }
@@ -116,4 +77,9 @@
     font-size: large;
     font-weight: bold;
     font-family: 'Segoe print';
+  }
+
+  .back {
+    position: absolute;
+    bottom: 5px;
   }

code/game.html

@@ -47,6 +47,9 @@
         
     </ul>
     
+    <img id="btn_back" src="ress/button_back.png" class="back" onClick="index()"/>
+    
+
     <script src="selecteur.js"></script>
     <script src="bakery.js"></script>
     <script src="chrono.js"></script>

code/vitraux.js

@@ -1,4 +1,3 @@
-//version 28/07
 
 var canvasT = document.getElementById('canvasTotal');
 var ctxT = canvasT.getContext('2d');
@@ -65,6 +64,8 @@ canvasO.width=size;
 canvasT.height=size;
 canvasO.height=size;
 
+document.getElementById("btn_back").width=size;
+
 for(var a=1;a<5;a++)
 {
     eval("var canvas"+ a +"= document.getElementById('canvas"+a+"')");
@@ -675,13 +676,12 @@ function mlManager(e) {
     document.getElementById(e.currentTarget.id).classList.remove('vitrail-hover');
 }        
 
+function index()
+{
+    window.location.replace("./");
+}
+
 genVitraux();
-/*
-tab1.push(true,[-3,-3,colors[0]],[-3,2,colors[1]],[1,2,colors[2]],[3,-3,colors[3]]);
-tab2.push(true,[-3,-3,colors[0]],[-3,2,colors[1]],[1,2,colors[2]],[3,-3,colors[3]]);
-tab3.push(true,[-3,-3,colors[0]],[-3,2,colors[1]],[1,2,colors[2]],[3,-3,colors[3]]);
-tab4.push(true,[-3,-3,colors[0]],[-3,2,colors[1]],[1,2,colors[2]],[3,-3,colors[3]]);
-*/
 
 toutDessiner(tab1,canvas1,ctx1);
 toutDessiner(tab2,canvas2,ctx2);