From 06251825cc231d6225bbb324b1bcbf1071abae89 Mon Sep 17 00:00:00 2001
From: fredtempez <ftempez@gmail.com>
Date: Mon, 7 Mar 2022 14:09:09 +0100
Subject: [PATCH] =?UTF-8?q?banni=C3=A8re=20info=20dimensions=20de=20l'imag?=
 =?UTF-8?q?e?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 CHANGES.md                                  |  7 ++--
 core/module/theme/view/header/header.js.php | 13 +++++---
 core/module/theme/view/header/header.php    | 36 +++++----------------
 3 files changed, 21 insertions(+), 35 deletions(-)

diff --git a/CHANGES.md b/CHANGES.md
index f72b5c41..f1675b4a 100755
--- a/CHANGES.md
+++ b/CHANGES.md
@@ -2,8 +2,11 @@
 
 
 ## Version 11.4.00
-### Amélioration :
-    - prise en charge des fontes Web Safe : Georgia, Times, Arial, Trebuchet, Lucida, Tahoma, Verdana, Courier et Monaco.
+### Améliorations :
+    - Prise en charge des fontes Web Safe. Les fontes initiales sont transférées dans les fontes optionnelles, donc effaçables.
+    - Configuration de la bannière, modalité d'affichage de la taille d'image recommandée et affichage des dimensions de l'image.
+## Correction :
+    - Module blog : taille recommandée de l'image erronée lorsque la largeur de l'écran est réglée sur fluide (100%).
 
 ## Version 11.3.04
 ### Correction :
diff --git a/core/module/theme/view/header/header.js.php b/core/module/theme/view/header/header.js.php
index 7cc85e53..85f736b6 100644
--- a/core/module/theme/view/header/header.js.php
+++ b/core/module/theme/view/header/header.js.php
@@ -47,9 +47,9 @@ $("input, select").on("change", function() {
 		var tmpImg = new Image();
 		tmpImg.onload = function() {
 			// Informations affichées
-			$("#themeHeaderImageHeight").val(tmpImg.height + " px");
-			$("#themeHeaderImageWidth").val(tmpImg.width + " px");
-			$("#themeHeaderImageRatio").val(tmpImg.width / tmpImg.height);
+			$("#themeHeaderImageHeight").html(tmpImg.height + "px");
+			$("#themeHeaderImageWidth").html(tmpImg.width + "px");
+			$("#themeHeaderImageRatio").html(tmpImg.width / tmpImg.height);
 
 			// Limiter la hauteur à 600 px
 			if (tmpImg.height > 600) {
@@ -69,6 +69,9 @@ $("input, select").on("change", function() {
 				$("#themeHeaderHeight option:eq(0)").val(tmpImgHeight + "px");
 				// Modifier l'option
 				$("#themeHeaderHeight option:eq(0)").html("Hauteur de l\'image sélectionnée (" + tmpImgHeight + "px)");
+				$("#themeHeaderImageInfo").show();
+			} else {
+				$("#themeHeaderImageInfo").hide();
 			}
 		};
 
@@ -207,10 +210,10 @@ $("input, select").on("change", function() {
 // Affiche / Cache les options de l'image du fond
 $("#themeHeaderImage").on("change", function() {
 	if($(this).val()) {
-		$("#themeHeaderImageOptions").slideDown();
+		$(".themeHeaderImageOptions").slideDown();
 	}
 	else {
-		$("#themeHeaderImageOptions").slideUp(function() {
+		$(".themeHeaderImageOptions").slideUp(function() {
 			$("#themeHeaderTextHide").prop("checked", false).trigger("change");
 		});
 	}
diff --git a/core/module/theme/view/header/header.php b/core/module/theme/view/header/header.php
index a9956412..232953db 100644
--- a/core/module/theme/view/header/header.php
+++ b/core/module/theme/view/header/header.php
@@ -154,40 +154,20 @@
                         $imageFile = file_exists(self::FILE_DIR.'source/'.$this->getData(['theme', 'header', 'image'])) ?
                                 $this->getData(['theme', 'header', 'image']) : "";
                         echo template::file('themeHeaderImage', [
-                            'help' => 'Sélectionner une image aux dimensions recommandées ci-dessous :',
                             'label' => 'Image',
                             'type' => 1,
                             'value' => $imageFile
                     ]); ?>
+                    <span  class="themeHeaderImageOptions displayNone" id="themeHeaderImageInfo">
+                        Largeur de l'image : <span id="themeHeaderImageWidth"></span> (largeur de site :  <?php echo $this->getData(['theme', 'site', 'width']); ?>)
+                        -
+                        Hauteur de l'image : <span id="themeHeaderImageHeight"></span>
+                        -
+                        Ratio : <span id="themeHeaderImageRatio"></span>
+                    </span>
                 </div>
             </div>
-            <div class="row">
-                <div class="col3 textAlignRight">
-                    Informations sur l'image : 
-                </div>
-                <div class="col2">                    
-                    <?php echo template::text('themeHeaderImageWidth', [
-                            'label' => 'Largeur',
-                            'class' => 'textAlignCenter',
-                            'disable' => true
-                    ]); ?>
-                </div>
-                <div class="col2">                    
-                    <?php echo template::text('themeHeaderImageHeight', [
-                            'label' => 'Hauteur',
-                            'class' => 'textAlignCenter',
-                            'disable' => true
-                    ]); ?>
-                </div>
-                <div class="col2">                    
-                    <?php echo template::text('themeHeaderImageRatio', [
-                            'label' => 'Ratio (L/H)',
-                            'class' => 'textAlignCenter',
-                            'disable' => true
-                    ]); ?>
-                </div>
-            </div>
-            <div id="themeHeaderImageOptions" class="displayNone">
+            <div class="themeHeaderImageOptions" class="displayNone">
                 <div class="row">
                     <div class="col3">
                         <?php echo template::select('themeHeaderImageRepeat', $module::$repeats, [