uikit 3.15.18-dev.9b1dbaa5d → 3.15.18-dev.9cbbb510d

package/package.json

@@ -2,7 +2,7 @@
     "name": "uikit",
     "title": "UIkit",
     "description": "UIkit is a lightweight and modular front-end framework for developing fast and powerful web interfaces.",
-    "version": "3.15.18-dev.9b1dbaa5d",
+    "version": "3.15.18-dev.9cbbb510d",
     "main": "dist/js/uikit.js",
     "style": "dist/css/uikit.css",
     "sideEffects": [

package/src/js/core/sticky.js

@@ -98,7 +98,7 @@ export default {
             this.hide();
             removeClass(this.selTarget, this.clsInactive);
         }
-        css(this.$el, { position: '', top: '' });
+        reset(this.$el);
 
         remove(this.placeholder);
         this.placeholder = null;
@@ -156,10 +156,10 @@ export default {
                 this.inactive = !this.matchMedia || !isVisible(this.$el);
 
                 if (this.inactive) {
-                    return false;
+                    return;
                 }
 
-                const hide = this.isFixed && types.has('resize');
+                const hide = this.isFixed && types.has('resize') && !sticky;
                 if (hide) {
                     css(this.selTarget, 'transition', '0s');
                     this.hide();
@@ -226,6 +226,7 @@ export default {
                     overflow,
                     topOffset,
                     height,
+                    elHeight,
                     width,
                     margin,
                     top: offsetPosition(referenceElement)[0],
@@ -234,11 +235,16 @@ export default {
             },
 
             write({ height, width, margin, offset, sticky }) {
+                if (this.inactive) {
+                    reset(this.$el);
+                    return;
+                }
+
                 if (sticky) {
                     height = width = margin = 0;
                     css(this.$el, { position: 'sticky', top: offset });
                 } else if (!this.isFixed) {
-                    css(this.$el, { position: '', top: '' });
+                    reset(this.$el);
                 }
                 const { placeholder } = this;
 
@@ -352,7 +358,7 @@ export default {
                 }
             },
 
-            events: ['resize', 'scroll'],
+            events: ['resize', 'resizeViewport', 'scroll'],
         },
     ],
 
@@ -392,6 +398,7 @@ export default {
                 offset,
                 topOffset,
                 height,
+                elHeight,
                 offsetParentTop,
                 sticky,
             } = this._data;
@@ -419,7 +426,11 @@ export default {
             css(this.$el, 'top', offset);
 
             this.setActive(active);
-            toggleClass(this.$el, this.clsBelow, scroll > topOffset + height);
+            toggleClass(
+                this.$el,
+                this.clsBelow,
+                scroll > topOffset + (sticky ? Math.min(height, elHeight) : height)
+            );
             addClass(this.$el, this.clsFixed);
         },
 
@@ -463,3 +474,7 @@ function coerce(value) {
     }
     return value;
 }
+
+function reset(el) {
+    css(el, { position: '', top: '', marginTop: '', width: '' });
+}