uikit 3.11.2-dev.ada192797 → 3.11.2-dev.fb043abc2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (44) hide show
  1. package/CHANGELOG.md +1 -0
  2. package/dist/css/uikit-core-rtl.css +1 -1
  3. package/dist/css/uikit-core-rtl.min.css +1 -1
  4. package/dist/css/uikit-core.css +1 -1
  5. package/dist/css/uikit-core.min.css +1 -1
  6. package/dist/css/uikit-rtl.css +1 -1
  7. package/dist/css/uikit-rtl.min.css +1 -1
  8. package/dist/css/uikit.css +1 -1
  9. package/dist/css/uikit.min.css +1 -1
  10. package/dist/js/components/countdown.js +1 -1
  11. package/dist/js/components/countdown.min.js +1 -1
  12. package/dist/js/components/filter.js +1 -1
  13. package/dist/js/components/filter.min.js +1 -1
  14. package/dist/js/components/lightbox-panel.js +1 -1
  15. package/dist/js/components/lightbox-panel.min.js +1 -1
  16. package/dist/js/components/lightbox.js +1 -1
  17. package/dist/js/components/lightbox.min.js +1 -1
  18. package/dist/js/components/notification.js +1 -1
  19. package/dist/js/components/notification.min.js +1 -1
  20. package/dist/js/components/parallax.js +1 -1
  21. package/dist/js/components/parallax.min.js +1 -1
  22. package/dist/js/components/slider-parallax.js +1 -1
  23. package/dist/js/components/slider-parallax.min.js +1 -1
  24. package/dist/js/components/slider.js +1 -1
  25. package/dist/js/components/slider.min.js +1 -1
  26. package/dist/js/components/slideshow-parallax.js +1 -1
  27. package/dist/js/components/slideshow-parallax.min.js +1 -1
  28. package/dist/js/components/slideshow.js +1 -1
  29. package/dist/js/components/slideshow.min.js +1 -1
  30. package/dist/js/components/sortable.js +1 -1
  31. package/dist/js/components/sortable.min.js +1 -1
  32. package/dist/js/components/tooltip.js +1 -1
  33. package/dist/js/components/tooltip.min.js +1 -1
  34. package/dist/js/components/upload.js +1 -1
  35. package/dist/js/components/upload.min.js +1 -1
  36. package/dist/js/uikit-core.js +18 -11
  37. package/dist/js/uikit-core.min.js +1 -1
  38. package/dist/js/uikit-icons.js +1 -1
  39. package/dist/js/uikit-icons.min.js +1 -1
  40. package/dist/js/uikit.js +18 -11
  41. package/dist/js/uikit.min.js +1 -1
  42. package/package.json +1 -1
  43. package/src/js/core/sticky.js +17 -11
  44. package/tests/sticky-parallax.html +3 -3
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "uikit",
3
3
  "title": "UIkit",
4
4
  "description": "UIkit is a lightweight and modular front-end framework for developing fast and powerful web interfaces.",
5
- "version": "3.11.2-dev.ada192797",
5
+ "version": "3.11.2-dev.fb043abc2",
6
6
  "main": "dist/js/uikit.js",
7
7
  "style": "dist/css/uikit.css",
8
8
  "sideEffects": [
package/src/js/core/sticky.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import Class from '../mixin/class';
2
2
  import Media from '../mixin/media';
3
- import {$, addClass, after, Animation, assign, clamp, css, dimensions, fastdom, height as getHeight, getScrollingElement, hasClass, isNumeric, isString, isVisible, noop, offset, offsetPosition, parent, query, remove, removeClass, replaceClass, scrollTop, toggleClass, toPx, trigger, within} from 'uikit-util';
3
+ import {$, addClass, after, Animation, clamp, css, dimensions, fastdom, height as getHeight, getScrollingElement, hasClass, isNumeric, isString, isVisible, noop, offset, offsetPosition, parent, query, remove, removeClass, replaceClass, scrollTop, toggleClass, toPx, trigger, within} from 'uikit-util';
4
4
 
5
5
  export default {
6
6
 
@@ -42,7 +42,7 @@ export default {
42
42
 
43
43
  position({position}, $el) {
44
44
  return position === 'auto'
45
- ? offset(this.isFixed ? this.placeholder : $el) > getHeight(window)
45
+ ? (this.isFixed ? this.placeholder : $el).offsetHeight > getHeight(window)
46
46
  ? 'bottom'
47
47
  : 'top'
48
48
  : position;
@@ -143,7 +143,7 @@ export default {
143
143
 
144
144
  {
145
145
 
146
- read({height}, types) {
146
+ read({height, margin}, types) {
147
147
 
148
148
  this.inactive = !this.matchMedia || !isVisible(this.$el);
149
149
 
@@ -151,13 +151,19 @@ export default {
151
151
  return false;
152
152
  }
153
153
 
154
- if (this.isActive && types.has('resize')) {
154
+ const hide = this.isActive && types.has('resize');
155
+ if (hide) {
155
156
  this.hide();
157
+ }
158
+
159
+ if (!this.isActive) {
156
160
  height = this.$el.offsetHeight;
157
- this.show();
161
+ margin = css(this.$el, 'margin');
158
162
  }
159
163
 
160
- height = this.isActive ? height : this.$el.offsetHeight;
164
+ if (hide) {
165
+ this.show();
166
+ }
161
167
 
162
168
  const overflow = Math.max(0, height + this.offset - getHeight(window));
163
169
 
@@ -180,17 +186,17 @@ export default {
180
186
  topOffset,
181
187
  offsetParentTop,
182
188
  height,
189
+ margin,
183
190
  width: dimensions(isVisible(this.widthElement) ? this.widthElement : this.$el).width,
184
- top: offsetPosition(this.placeholder)[0],
185
- margins: css(this.$el, ['marginTop', 'marginBottom', 'marginLeft', 'marginRight'])
191
+ top: offsetPosition(this.placeholder)[0]
186
192
  };
187
193
  },
188
194
 
189
- write({height, margins}) {
195
+ write({height, margin}) {
190
196
 
191
197
  const {placeholder} = this;
192
198
 
193
- css(placeholder, assign({height}, margins));
199
+ css(placeholder, {height, margin});
194
200
 
195
201
  if (!within(placeholder, document)) {
196
202
  after(this.$el, placeholder);
@@ -315,7 +321,7 @@ export default {
315
321
 
316
322
  const {width, scroll = 0, overflow, overflowScroll = 0, start, end, topOffset, height, offsetParentTop} = this._data;
317
323
  const active = start !== 0 || scroll > start;
318
- let top = Math.max(0, this.offset);
324
+ let top = this.offset;
319
325
  let position = 'fixed';
320
326
 
321
327
  if (scroll > end) {
package/tests/sticky-parallax.html CHANGED
@@ -8,7 +8,7 @@
8
8
  <script src="js/test.js"></script>
9
9
  </head>
10
10
 
11
- <body style="padding-bottom: 1100px;">
11
+ <body style="padding-bottom: 100vh;">
12
12
 
13
13
  <div class="uk-section uk-section-primary uk-position-z-index-negative uk-flex uk-flex-center uk-flex-middle uk-text-center" uk-sticky="bottom: +* +*" uk-height-viewport>
14
14
  <div class="uk-container">
@@ -130,9 +130,9 @@
130
130
  </div>
131
131
  <div>
132
132
 
133
- <div class="uk-tile uk-tile-large uk-tile-muted uk-text-center" style="height: 100vh" uk-sticky="bottom: #js-sticky-parallax-viewport">
133
+ <div class="uk-background-muted uk-text-center" style="height: 100vh" uk-sticky="bottom: #js-sticky-parallax-viewport">
134
134
 
135
- <div uk-parallax="target: #js-sticky-parallax-viewport; start: 100vh; end: 100vh; y: 0, 35vh; easing: 0">
135
+ <div uk-parallax="target: #js-sticky-parallax-viewport; start: 100vh; end: 100vh; y: 10vh, 80vh; easing: 0">
136
136
 
137
137
  <h1 class="uk-margin-remove">Sticky Parallax Viewport</h1>
138
138