Fixed: Broken draggable/resizable modals in Helveticus (OFBIZ-12992)
CSS rules were preventing jQuery UI Dialogs to be draggable
(!important in CSS overriding top/left inline styles).
Removes "transition: .5s" on dialog elements : it causes
slowdowns on drag/resize (a CSS animation is triggered each
time the user moves/resizes the dialog)
Thanks: Gavinju for reporting and Florian Motteau for providing the PR.
diff --git a/themes/helveticus/webapp/helveticus/helveticus-main-theme.less b/themes/helveticus/webapp/helveticus/helveticus-main-theme.less
index 0ff04c6..460f680 100644
--- a/themes/helveticus/webapp/helveticus/helveticus-main-theme.less
+++ b/themes/helveticus/webapp/helveticus/helveticus-main-theme.less
@@ -97,7 +97,10 @@
}
/*** BUTTON /LINK / NAV STYLES ***/
-a, a:hover, * {
+// * { transition: .5s } is very (too) broad, it causes slowdowns on draggable/resizable elements like modals
+// (leads to animations for each new size/position, eventually each pixel...)
+// We should invert the logic here : transitions on chosen elements instead of everywhere except some elements.
+a, a:hover, *:not(.ui-dialog, .ui-dialog-content) {
text-decoration:none;
-o-transition:.5s;
-ms-transition:.5s;
@@ -1391,8 +1394,6 @@
}
}
.ui-dialog{
- left: ~"calc(50% - 320px)" !important;
- top: 2rem !important;
box-shadow: 0 0 15px 15px @shadow-color !important;
}
@@ -1496,11 +1497,6 @@
}
}
}
-.ui-dialog{
- left: ~"calc(50% - 320px)" !important;
- top: 2rem !important;
- box-shadow: 0 0 15px 15px @shadow-color !important;
-}
.hidden{
display: none;
