Merge pull request #2532 from adumesny/master

animation on init fix

Author: adumesny

doc/CHANGES.md

@@ -108,6 +108,7 @@ Change log
 * fix [#2525](https://github.com/gridstack/gridstack.js/commit/2525) Fixed unhandled exception happening in _mouseMove handler
 * fix potential crash in doContentResize() if grid gets deleted by the time the delay happens
 * fix [#2527](https://github.com/gridstack/gridstack.js/issues/2527) Incorrect layout on grid load in one column mode
+* fix [#2496](https://github.com/gridstack/gridstack.js/issues/2496) animation on init, introduced in 8.1.1
 
 ## 9.5.0 (2023-10-26)
 * feat [#1275](https://github.com/gridstack/gridstack.js/issues/1275) div scale support - Thank you [elmehdiamlou](https://github.com/elmehdiamlou) for implementing this teh right way (add scale to current code)

src/gridstack.scss

@@ -40,8 +40,6 @@ $animation_speed: .3s !default;
 // make those more unique as to not conflict with side panel items
 .grid-stack > .grid-stack-item {
   position: absolute;
-  top: 0px;
-  left: 0%;
   padding: 0;
 
   > .grid-stack-item-content {
@@ -138,6 +136,14 @@ $animation_speed: .3s !default;
   @include vendor(transition, left 0s, top 0s, height 0s, width 0s);
 }
 
+// make those more unique as to not conflict with side panel items, but apply to all column layouts (so not in loop below)
+.grid-stack > .grid-stack-item[gs-y="0"] {
+  top: 0px;
+}
+.grid-stack > .grid-stack-item[gs-x="0"] {
+  left: 0%;
+}
+
 .gs-#{$columns} > .grid-stack-item {
   width: fixed(calc(100% / $columns));
   @for $i from 1 through ($columns - 1) {