This is an automated email from the ASF dual-hosted git repository.

jleroux pushed a commit to branch release24.09
in repository https://gitbox.apache.org/repos/asf/ofbiz-framework.git


The following commit(s) were added to refs/heads/release24.09 by this push:
     new ee650c86af Fixed: jsTree visual glitch on link hover (OFBIZ-13174 - 
#856)
ee650c86af is described below

commit ee650c86af60505b5942b1f65c5cd96c45ab6f0c
Author: Florian Motteau <florian.mott...@nereide.fr>
AuthorDate: Thu Nov 14 09:22:09 2024 +0100

    Fixed: jsTree visual glitch on link hover (OFBIZ-13174 - #856)
    
    Helveticus introduced a global CSS transition effect,
    which caused various problems across the app (all the
    elements that changed dimensions were animated).
    jsTree plugins is concerned, when hovering links in
    a tree.
    
    This PR removes the global transition effect, and put
    it on identified elements that need it (buttons and links).
---
 .../webapp/helveticus/helveticus-main-theme.less           | 14 +++++++++-----
 1 file changed, 9 insertions(+), 5 deletions(-)

diff --git a/themes/helveticus/webapp/helveticus/helveticus-main-theme.less 
b/themes/helveticus/webapp/helveticus/helveticus-main-theme.less
index 212202a5cf..f9e7c7401f 100644
--- a/themes/helveticus/webapp/helveticus/helveticus-main-theme.less
+++ b/themes/helveticus/webapp/helveticus/helveticus-main-theme.less
@@ -43,6 +43,8 @@
 @home-menu-tile-min-width: 100px;
 @home-menu-tile-max-width: 100px;
 
+@transition: all .2s;
+
 @import 
url('https://fonts.googleapis.com/css2?family=Quicksand:wght@300;400;500;600;700&display=swap');
 * {
     margin: 0;
@@ -110,7 +112,6 @@ span.label {
 /*** BUTTON /LINK / NAV STYLES ***/
 a, a:hover, input.buttontext, input[type="submit"] {
     text-decoration: none;
-    transition: .2s;
 }
 
 a {
@@ -131,6 +132,7 @@ input[type="submit"], .smallSubmit, button {
     padding: 0.5rem 0.8rem;
     font-size: 1.2rem;
     cursor: pointer;
+    transition: @transition;
 
     &:hover {
         color: @main-color-theme;
@@ -246,6 +248,7 @@ input[type="submit"], .smallSubmit, button {
                 color: @dark-color-theme;
                 font-weight: 600;
                 font-size: 1.2rem;
+                transition: @transition;
             }
 
             &.selected a, &:hover a {
@@ -308,8 +311,8 @@ a.buttontext {
     border-radius: 0.5rem;
     display: inline-block;
     font-weight: 600;
-    margin: 0.3rem;
-    margin-right: 0.5rem;
+    margin: 0.3rem 0.5rem 0.3rem 0.3rem;
+    transition: @transition;
 
     &:hover {
         color: @light-color-theme;
@@ -563,6 +566,7 @@ a.buttontext {
                     font-weight: 600;
                     font-size: 1.2rem;
                     display: block;
+                    transition: @transition;
                 }
             }
         }
@@ -1083,13 +1087,13 @@ label.has-checkbox, .has-radio {
     padding-left: 4px;
     padding-right: 5px;
     border-radius: 8px 8px 8px 8px;
-    transition: all .2s;
+    transition: @transition;
 }
 
 [type="checkbox"]:checked.nrd-chkbox + label:after {
     position: relative;
     left: -15px;
-    transition: all .2s;
+    transition: @transition;
 }
 
 /*** TABLE STYLE ***/

Reply via email to