From b7b578eee5cce63d6c6c35adde0190eab42844a9 Mon Sep 17 00:00:00 2001
From: Stephen Abello <stephen.abello@combodo.com>
Date: Tue, 11 Apr 2023 15:34:49 +0200
Subject: [PATCH] =?UTF-8?q?N=C2=B05888=20-=20Avoid=20modals=20being=20larg?=
 =?UTF-8?q?er=20than=20window,=20when=20a=20modal=20is=20resized,=20recent?=
 =?UTF-8?q?er=20it?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 css/backoffice/components/_modal.scss | 9 +++++++++
 js/pages/backoffice/toolbox.js        | 8 +++++++-
 2 files changed, 16 insertions(+), 1 deletion(-)

diff --git a/css/backoffice/components/_modal.scss b/css/backoffice/components/_modal.scss
index 2e4be2a75..05839592c 100644
--- a/css/backoffice/components/_modal.scss
+++ b/css/backoffice/components/_modal.scss
@@ -4,6 +4,8 @@
  */
 
 /* SCSS variables */
+$ibo-modal--max-height: 90vh !default;
+$ibo-modal--max-width: 90vw !default;
 $ibo-modal-option--do-not-show-again--margin-top: $ibo-spacing-500 !default;
 
 $ibo-modal--is-informative--min-width: $ibo-size-700 !default;
@@ -13,6 +15,13 @@ $ibo-modal--is-informative--is-warning--highlight--background-color: $ibo-color-
 $ibo-modal--is-informative--is-information--highlight--background-color: $ibo-color-blue-600 !default;
 $ibo-modal--is-informative--is-success--highlight--background-color: $ibo-color-green-600 !default;
 
+/* Avoid modals bigger than window size 
+!important in order to overload jQueryUI max-height:none being put on dialog elements */
+.ibo-modal{
+  max-height: $ibo-modal--max-height !important;
+  max-width: $ibo-modal--max-width !important;
+}
+
 // Modal Option - Do not show again
 .ibo-modal-option--do-not-show-again{
   margin-top: $ibo-modal-option--do-not-show-again--margin-top;
diff --git a/js/pages/backoffice/toolbox.js b/js/pages/backoffice/toolbox.js
index ef3e148f1..f96c5aade 100644
--- a/js/pages/backoffice/toolbox.js
+++ b/js/pages/backoffice/toolbox.js
@@ -294,7 +294,13 @@ CombodoModal._InstantiateModal = function(oModalElem, oOptions) {
 
 	// Show modal
 	oModalElem.dialog(oJQueryOptions);
-
+	
+	// - When resizing a window, center it
+	// TODO 3.1 move this to a BindEvents function
+	oModalElem.on('resize', function(){
+		$(this).dialog("option", "position", {my: "center", at: "center", of: window});
+	});
+	
 	// TODO 3.1 : Cleanup
 	// {
 	// 	height: 'auto',