Fix feedback WorkAdventure team

front/dist/resources/html/CustomCharacterScene.html

@@ -45,10 +45,9 @@
     }
     #customizeScene section.action {
         text-align: center;
-        position: absolute;
+        position: sticky;
         bottom: 0;
         top: 100%;
-        width: 100%;
     }
     #customizeScene section.action.action-move { 
         top: 55%;
@@ -95,21 +94,18 @@
     #customizeScene section input#customizeSceneLink{
         background-color: #a1a3a3;
     }
-    #customizeScene section img{
-        width: 160px;
-        margin: 20px 0;
-    }
     #customizeScene section button.customizeSceneButton{
         position: absolute;
         margin: 0;
-        width: 25px;
         top: -8vh;
+        font-size: 10px;
+        padding: 2px 4px;
     }
     #customizeScene section button.customizeSceneButton#customizeSceneButtonLeft{
-        left: 1vw;
+        left: 0vw;
     }
     #customizeScene section button.customizeSceneButton#customizeSceneButtonRight{
-        right: 1vw;
+        right: 0vw;
     }
     #customizeScene section button.customizeSceneButton#customizeSceneButtonUp{
         left: calc(2vw + 40px);
@@ -121,6 +117,16 @@
         transform: rotate(90deg);
         margin-top: 20px;
     }
+    #customizeScene section.action img{
+        width: 8px;
+        height: 8px;
+    }
+    #customizeScene section.action a#customizeSceneFormBack img{
+        margin-top: -2px;
+    }
+    #customizeScene section.action button#customizeSceneFormSubmit img{
+        transform: rotate(180deg);
+    }
     @media only screen and (max-width: 600px) {
         #customizeScene {
             max-width: 160px;
@@ -147,7 +153,7 @@
         <button class="customizeSceneButton" id="customizeSceneButtonDown"> > </button>-->
     </section>
     <section class="action">
-        <a type="submit" id="customizeSceneFormBack">Back</a>
+        <a type="submit" id="customizeSceneFormBack">Back <img src="resources/objects/arrow_up.png"/></a>
-        <button type="submit" id="customizeSceneFormSubmit">Next</button>
+        <button type="submit" id="customizeSceneFormSubmit">Next <img src="resources/objects/arrow_up.png"/></button>
     </section>
 </form>

front/dist/resources/style/cowebsite-mobile.scss

@@ -0,0 +1,49 @@
+@media (max-aspect-ratio: 1/1) {
+
+    #main-container {
+      display: flex;
+      flex-direction: column-reverse;
+    }
+  
+  
+    #cowebsite {
+      left: 0;
+      top: 0;
+      width: 100%;
+      height: 50%;
+      display: flex;
+      flex-direction: column-reverse;
+  
+      &.loading {
+        transform: translateY(-90%);
+      }
+      &.hidden {
+        transform: translateY(-100%);
+      }
+  
+      main {
+        height: 100%;
+      }
+  
+  
+      aside {
+        height: 30px;
+        cursor: ns-resize;
+        flex-direction: column;
+  
+        img {
+          cursor: ns-resize;
+        }
+      }
+  
+      .top-right-btn {
+        &#cowebsite-close {
+          right: 0;
+        }
+        &#cowebsite-fullscreen {
+          left: 0;
+        }
+      }
+    }
+  }
+  

front/dist/resources/style/index.scss

@@ -1,3 +1,4 @@
 @import "cowebsite.scss";
+@import "cowebsite-mobile.scss";
 @import "style.css";
 @import "mobile-style.scss";

front/dist/resources/style/mobile-style.scss

@@ -57,53 +57,3 @@
     }
   }
 }
-
-@media (max-aspect-ratio: 1/1) {
-
-  #main-container {
-    display: flex;
-    flex-direction: column-reverse;
-  }
-
-
-  #cowebsite {
-    left: 0;
-    top: 0;
-    width: 100%;
-    height: 50%;
-    display: flex;
-    flex-direction: column-reverse;
-
-    &.loading {
-      transform: translateY(-90%);
-    }
-    &.hidden {
-      transform: translateY(-100%);
-    }
-
-    main {
-      height: 100%;
-    }
-
-
-    aside {
-      height: 30px;
-      cursor: ns-resize;
-      flex-direction: column;
-
-      img {
-        cursor: ns-resize;
-      }
-    }
-
-    .top-right-btn {
-      &#cowebsite-close {
-        right: 0;
-      }
-      &#cowebsite-fullscreen {
-        left: 0;
-      }
-    }
-  }
-}
-

front/src/Phaser/Login/CustomizeScene.ts

@@ -129,7 +129,7 @@ export class CustomizeScene extends AbstractCharacterScene {
 
         if(index === -1 && this.activeRow === 5){
             const button = this.customizeSceneElement.getChildByID('customizeSceneFormSubmit') as HTMLButtonElement;
-            button.innerText = 'Next';
+            button.innerHTML = `Next <img src="resources/objects/arrow_up.png"/>`;
         }
 
         if(index === 1 && this.activeRow === 4){
@@ -137,6 +137,16 @@ export class CustomizeScene extends AbstractCharacterScene {
             button.innerText = 'Finish';
         }
 
+        if(index === -1 && this.activeRow === 1){
+            const button = this.customizeSceneElement.getChildByID('customizeSceneFormBack') as HTMLButtonElement;
+            button.innerText = `Back`;
+        }
+
+        if(index === 1 && this.activeRow === 0){
+            const button = this.customizeSceneElement.getChildByID('customizeSceneFormBack') as HTMLButtonElement;
+            button.innerHTML = `Back <img src="resources/objects/arrow_up.png"/>`;
+        }
+
         this.activeRow += index;
         if (this.activeRow < 0) {
             this.activeRow = 0
@@ -306,37 +316,4 @@ export class CustomizeScene extends AbstractCharacterScene {
         this.scene.sleep(CustomizeSceneName);
         this.scene.run(SelectCharacterSceneName);
     }
-
-    /**
-     * TODO fix me and mutualize code
-     */
-    defineSetupPosition() : {playerX: number, playerY: number, playerScale: number, playserOpactity: number, playerVisible: boolean}{
-        throw new Error('defineSetupPosition cannot be used');
-        return {playerX: 0, playerY: 0, playerScale: 0, playserOpactity: 0, playerVisible: false};
-    }
-
-    /**
-     * TODO fix me and mutualize code
-     */
-    nextSceneToCameraScene(): void {
-        throw new Error('nextSceneToCameraScene cannot be used in this scene');
-    }
-
-    /**
-     * TODO fix me and mutualize code
-     */
-    nextSceneToCustomizeScene(): void {
-        throw new Error('nextSceneToCustomizeScene cannot be used in this scene');
-    }
-
-    /**
-     * TODO fix me and mutualize code
-     * Returns pixel position by on column and row number
-     */
-    getCharacterPosition(): [number, number] {
-        return [
-            this.game.renderer.width / 2,
-            this.game.renderer.height / 2
-        ];
-    }
 }