From d7470836a5b04232adf1ff0e1945de8aceb226b1 Mon Sep 17 00:00:00 2001
From: Vincent Vandemeulebrouck <vincent.vandeme@gmail.com>
Date: Mon, 23 Jun 2025 01:35:55 +0200
Subject: [PATCH] =?UTF-8?q?Boutons=20de=20d=C3=A9placement=20dans=20les=20?=
 =?UTF-8?q?TMR?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 changelog.md                        |  3 ++-
 css/foundryvtt-reve-de-dragon.css   | 31 +++++++++++++++++++++++++++--
 less/foundryvtt-reve-de-dragon.less | 12 +++++++++--
 templates/dialog-tmr.hbs            | 22 ++++++++++----------
 4 files changed, 51 insertions(+), 17 deletions(-)

diff --git a/changelog.md b/changelog.md
index a6cb4a3a..d3ff9cb0 100644
--- a/changelog.md
+++ b/changelog.md
@@ -5,7 +5,8 @@
 - On peut de nouveau modifier les descriptions
 - ne pas proposer l'export csv par défaut
 - Corrections d'affichage
-  - correction des boutons de l'horloge
+  - boutons de l'horloge
+  - boutons de déplacement des TMR
 
 ## 13.0.3 - La dernière auberge d'Illysis
 
diff --git a/css/foundryvtt-reve-de-dragon.css b/css/foundryvtt-reve-de-dragon.css
index dd1391fb..5e3d96a4 100644
--- a/css/foundryvtt-reve-de-dragon.css
+++ b/css/foundryvtt-reve-de-dragon.css
@@ -874,13 +874,40 @@ select,
   padding: 0.2em;
   border-width: 0;
 }
-.system-foundryvtt-reve-de-dragon .small-button-direction {
+.system-foundryvtt-reve-de-dragon .grid-move-tmr {
+  display: grid;
+}
+.system-foundryvtt-reve-de-dragon .move-tmr-topleft {
+  grid-column: 2/2;
+  grid-row: 2/4;
+}
+.system-foundryvtt-reve-de-dragon .move-tmr-top {
+  grid-column: 3/3;
+  grid-row: 1/3;
+}
+.system-foundryvtt-reve-de-dragon .move-tmr-topright {
+  grid-column: 4/4;
+  grid-row: 2/4;
+}
+.system-foundryvtt-reve-de-dragon .move-tmr-bottomleft {
+  grid-column: 2/2;
+  grid-row: 4/6;
+}
+.system-foundryvtt-reve-de-dragon .move-tmr-bottom {
+  grid-column: 3/3;
+  grid-row: 5/7;
+}
+.system-foundryvtt-reve-de-dragon .move-tmr-bottomright {
+  grid-column: 4/4;
+  grid-row: 4/6;
+}
+.system-foundryvtt-reve-de-dragon .tmr-move {
   max-height: 32px;
   max-width: 32px;
   border: 0;
   vertical-align: bottom;
 }
-.system-foundryvtt-reve-de-dragon :is(.button-img,.button-effect-img,.small-button-direction):hover {
+.system-foundryvtt-reve-de-dragon :is(.button-img,.button-effect-img,.tmr-move):hover {
   color: var(--color-controls-hover);
   border: 1px solid var(--color-control-border-hover);
   text-shadow: 1px 0px 0px #ff6600;
diff --git a/less/foundryvtt-reve-de-dragon.less b/less/foundryvtt-reve-de-dragon.less
index 336efbdd..f8849c3f 100644
--- a/less/foundryvtt-reve-de-dragon.less
+++ b/less/foundryvtt-reve-de-dragon.less
@@ -515,13 +515,21 @@
     padding: 0.2em;
     border-width: 0;
   }
-  .small-button-direction {
+  .grid-move-tmr { display: grid; }
+  .move-tmr-topleft { grid-column: 2/2; grid-row: 2/4;}
+  .move-tmr-top { grid-column: 3/3; grid-row: 1/3; }
+  .move-tmr-topright { grid-column: 4/4; grid-row: 2/4; }
+  .move-tmr-bottomleft { grid-column: 2/2; grid-row: 4/6; }
+  .move-tmr-bottom { grid-column: 3/3; grid-row: 5/7; }
+  .move-tmr-bottomright{ grid-column: 4/4; grid-row: 4/6; }
+
+  .tmr-move {
     max-height: 32px;
     max-width: 32px;
     border: 0;
     vertical-align: bottom;
   }
-  :is(.button-img,.button-effect-img,.small-button-direction):hover {
+  :is(.button-img,.button-effect-img,.tmr-move):hover {
     color: var(--color-controls-hover);
     border: 1px solid var(--color-control-border-hover);
     text-shadow: 1px 0px 0px #ff6600;
diff --git a/templates/dialog-tmr.hbs b/templates/dialog-tmr.hbs
index 3da3c677..ee98bd5a 100644
--- a/templates/dialog-tmr.hbs
+++ b/templates/dialog-tmr.hbs
@@ -24,20 +24,18 @@
           <div class="flex-group-center flex-shrink">
             <h4>Le gardien gére les TMR du joueur, le joueur ne peut pas monter dans les TMR!</h4>
           </div>
+          <hr>
         {{/if}}
-        <div class="flex-group-center flex-shrink">
-          <img class="small-button-direction tmr-move" data-move="topleft" src="systems/foundryvtt-reve-de-dragon/assets/ui/dir-topleft.svg">
-          <img class="small-button-direction tmr-move" data-move="top" src="systems/foundryvtt-reve-de-dragon/assets/ui/dir-top.svg">
-          <img class="small-button-direction tmr-move" data-move="topright" src="systems/foundryvtt-reve-de-dragon/assets/ui/dir-topright.svg">
-        </div>
-        <div class="flex-group-center flex-shrink">
-          <label>Coordonnées : </label><span id="tmr-pos">0</span>
-        </div>
-        <div class="flex-group-center flex-shrink">
-          <img class="small-button-direction tmr-move" data-move="bottomleft" src="systems/foundryvtt-reve-de-dragon/assets/ui/dir-bottomleft.svg">        
-          <img class="small-button-direction tmr-move" data-move="bottom" src="systems/foundryvtt-reve-de-dragon/assets/ui/dir-bottom.svg">
-          <img class="small-button-direction tmr-move" data-move="bottomright" src="systems/foundryvtt-reve-de-dragon/assets/ui/dir-bottomright.svg">
+        <label class="flex-group-center" >Coordonnées : <span id="tmr-pos">0</span> </label>
+        <div class="grid-move-tmr">
+          <img class="move-tmr-topleft tmr-move" data-move="topleft" src="systems/foundryvtt-reve-de-dragon/assets/ui/dir-topleft.svg">
+          <img class="move-tmr-top tmr-move" data-move="top" src="systems/foundryvtt-reve-de-dragon/assets/ui/dir-top.svg">
+          <img class="move-tmr-topright tmr-move" data-move="topright" src="systems/foundryvtt-reve-de-dragon/assets/ui/dir-topright.svg">
+          <img class="move-tmr-bottomleft tmr-move" data-move="bottomleft" src="systems/foundryvtt-reve-de-dragon/assets/ui/dir-bottomleft.svg">        
+          <img class="move-tmr-bottom tmr-move" data-move="bottom" src="systems/foundryvtt-reve-de-dragon/assets/ui/dir-bottom.svg">
+          <img class="move-tmr-bottomright tmr-move" data-move="bottomright" src="systems/foundryvtt-reve-de-dragon/assets/ui/dir-bottomright.svg">
         </div>
+        <hr>
         <div class="flex-group-center flex-shrink lire-signe-draconique">
           <a>Lire un signe draconique</a>
         </div>