uikit 3.14.3 → 3.14.4-dev.6a00f7fe6

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 (84) hide show
  1. package/CHANGELOG.md +17 -0
  2. package/dist/css/uikit-core-rtl.css +84 -26
  3. package/dist/css/uikit-core-rtl.min.css +1 -1
  4. package/dist/css/uikit-core.css +84 -26
  5. package/dist/css/uikit-core.min.css +1 -1
  6. package/dist/css/uikit-rtl.css +90 -41
  7. package/dist/css/uikit-rtl.min.css +1 -1
  8. package/dist/css/uikit.css +90 -41
  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 +101 -22
  15. package/dist/js/components/lightbox-panel.min.js +1 -1
  16. package/dist/js/components/lightbox.js +101 -22
  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 +135 -34
  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 +206 -77
  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 +206 -77
  41. package/dist/js/uikit.min.js +1 -1
  42. package/package.json +1 -1
  43. package/src/js/core/accordion.js +3 -3
  44. package/src/js/core/alert.js +1 -1
  45. package/src/js/core/drop.js +40 -20
  46. package/src/js/core/height-viewport.js +14 -9
  47. package/src/js/core/navbar.js +11 -9
  48. package/src/js/core/switcher.js +1 -1
  49. package/src/js/mixin/position.js +44 -13
  50. package/src/js/mixin/togglable.js +105 -24
  51. package/src/js/util/animation.js +1 -0
  52. package/src/js/util/viewport.js +1 -1
  53. package/src/less/components/drop.less +19 -5
  54. package/src/less/components/dropdown.less +21 -5
  55. package/src/less/components/margin.less +13 -14
  56. package/src/less/components/modal.less +19 -4
  57. package/src/less/components/nav.less +1 -1
  58. package/src/less/components/navbar.less +54 -21
  59. package/src/less/components/offcanvas.less +21 -21
  60. package/src/less/components/position.less +1 -1
  61. package/src/less/components/utility.less +0 -1
  62. package/src/less/theme/dropdown.less +11 -0
  63. package/src/less/theme/navbar.less +10 -12
  64. package/src/scss/components/drop.scss +19 -5
  65. package/src/scss/components/dropdown.scss +21 -5
  66. package/src/scss/components/margin.scss +13 -14
  67. package/src/scss/components/modal.scss +19 -4
  68. package/src/scss/components/nav.scss +1 -1
  69. package/src/scss/components/navbar.scss +43 -10
  70. package/src/scss/components/offcanvas.scss +21 -21
  71. package/src/scss/components/position.scss +1 -1
  72. package/src/scss/components/utility.scss +0 -1
  73. package/src/scss/mixins-theme.scss +8 -12
  74. package/src/scss/mixins.scss +2 -0
  75. package/src/scss/theme/dropdown.scss +8 -0
  76. package/src/scss/theme/navbar.scss +7 -0
  77. package/src/scss/variables-theme.scss +26 -11
  78. package/src/scss/variables.scss +24 -11
  79. package/tests/drop.html +145 -2
  80. package/tests/dropdown.html +228 -13
  81. package/tests/height-viewport.html +62 -0
  82. package/tests/navbar.html +321 -14
  83. package/tests/offcanvas.html +8 -8
  84. package/tests/sticky-navbar.html +132 -0
@@ -1,4 +1,4 @@
1
- /*! UIkit 3.14.3 | https://www.getuikit.com | (c) 2014 - 2022 YOOtheme | MIT License */
1
+ /*! UIkit 3.14.4-dev.6a00f7fe6 | https://www.getuikit.com | (c) 2014 - 2022 YOOtheme | MIT License */
2
2
  /* ========================================================================
3
3
  Component: Base
4
4
  ========================================================================== */
@@ -3231,7 +3231,7 @@ select.uk-form-width-xsmall {
3231
3231
  position: absolute;
3232
3232
  z-index: 1020;
3233
3233
  --uk-position-offset: 20px;
3234
- --uk-position-viewport-offset: 10;
3234
+ --uk-position-viewport-offset: 15px;
3235
3235
  /* 3 */
3236
3236
  box-sizing: border-box;
3237
3237
  width: 300px;
@@ -3240,6 +3240,18 @@ select.uk-form-width-xsmall {
3240
3240
  .uk-drop.uk-open {
3241
3241
  display: block;
3242
3242
  }
3243
+ /* Stretch modifier
3244
+ ========================================================================== */
3245
+ /*
3246
+ * 1. Allow scrolling
3247
+ */
3248
+ .uk-drop-stretch {
3249
+ --uk-position-offset: 0;
3250
+ --uk-position-viewport-offset: 0;
3251
+ /* 1 */
3252
+ overflow-y: auto;
3253
+ -webkit-overflow-scrolling: touch;
3254
+ }
3243
3255
  /* Grid modifiers
3244
3256
  ========================================================================== */
3245
3257
  .uk-drop-stack .uk-drop-grid > * {
@@ -3261,7 +3273,7 @@ select.uk-form-width-xsmall {
3261
3273
  position: absolute;
3262
3274
  z-index: 1020;
3263
3275
  --uk-position-offset: 10px;
3264
- --uk-position-viewport-offset: 10;
3276
+ --uk-position-viewport-offset: 15px;
3265
3277
  /* 3 */
3266
3278
  box-sizing: border-box;
3267
3279
  min-width: 200px;
@@ -3275,6 +3287,18 @@ select.uk-form-width-xsmall {
3275
3287
  .uk-dropdown.uk-open {
3276
3288
  display: block;
3277
3289
  }
3290
+ /* Stretch modifier
3291
+ ========================================================================== */
3292
+ /*
3293
+ * 1. Allow scrolling
3294
+ */
3295
+ .uk-dropdown-stretch {
3296
+ --uk-position-offset: 0;
3297
+ --uk-position-viewport-offset: 0;
3298
+ /* 1 */
3299
+ overflow-y: auto;
3300
+ -webkit-overflow-scrolling: touch;
3301
+ }
3278
3302
  /* Nav
3279
3303
  * Adopts `uk-nav`
3280
3304
  ========================================================================== */
@@ -3444,18 +3468,30 @@ select.uk-form-width-xsmall {
3444
3468
  ========================================================================== */
3445
3469
  .uk-modal-body {
3446
3470
  display: flow-root;
3447
- padding: 30px 30px;
3471
+ padding: 20px 20px;
3448
3472
  }
3449
3473
  .uk-modal-header {
3450
3474
  display: flow-root;
3451
- padding: 15px 30px;
3475
+ padding: 10px 20px;
3452
3476
  background: #f8f8f8;
3453
3477
  }
3454
3478
  .uk-modal-footer {
3455
3479
  display: flow-root;
3456
- padding: 15px 30px;
3480
+ padding: 10px 20px;
3457
3481
  background: #f8f8f8;
3458
3482
  }
3483
+ /* Phone landscape and bigger */
3484
+ @media (min-width: 640px) {
3485
+ .uk-modal-body {
3486
+ padding: 30px 30px;
3487
+ }
3488
+ .uk-modal-header {
3489
+ padding: 15px 30px;
3490
+ }
3491
+ .uk-modal-footer {
3492
+ padding: 15px 30px;
3493
+ }
3494
+ }
3459
3495
  /*
3460
3496
  * Remove margin from the last-child
3461
3497
  */
@@ -3733,12 +3769,12 @@ select.uk-form-width-xsmall {
3733
3769
  overflow-y: auto;
3734
3770
  -webkit-overflow-scrolling: touch;
3735
3771
  }
3736
- /* Tablet landscape and bigger */
3737
- @media (min-width: 960px) {
3772
+ /* Phone landscape and bigger */
3773
+ @media (min-width: 640px) {
3738
3774
  .uk-offcanvas-bar {
3739
3775
  left: -350px;
3740
3776
  width: 350px;
3741
- padding: 40px 40px;
3777
+ padding: 30px 30px;
3742
3778
  }
3743
3779
  }
3744
3780
  /* Flip modifier */
@@ -3747,7 +3783,7 @@ select.uk-form-width-xsmall {
3747
3783
  right: -270px;
3748
3784
  }
3749
3785
  /* Tablet landscape and bigger */
3750
- @media (min-width: 960px) {
3786
+ @media (min-width: 640px) {
3751
3787
  .uk-offcanvas-flip .uk-offcanvas-bar {
3752
3788
  right: -350px;
3753
3789
  }
@@ -3803,7 +3839,7 @@ select.uk-form-width-xsmall {
3803
3839
  width: 270px;
3804
3840
  }
3805
3841
  /* Tablet landscape and bigger */
3806
- @media (min-width: 960px) {
3842
+ @media (min-width: 640px) {
3807
3843
  .uk-open > .uk-offcanvas-reveal {
3808
3844
  width: 350px;
3809
3845
  }
@@ -3826,10 +3862,10 @@ select.uk-form-width-xsmall {
3826
3862
  padding: 5px;
3827
3863
  }
3828
3864
  /* Tablet landscape and bigger */
3829
- @media (min-width: 960px) {
3865
+ @media (min-width: 640px) {
3830
3866
  .uk-offcanvas-close {
3831
- top: 20px;
3832
- right: 20px;
3867
+ top: 10px;
3868
+ right: 10px;
3833
3869
  }
3834
3870
  }
3835
3871
  /*
@@ -3907,7 +3943,7 @@ select.uk-form-width-xsmall {
3907
3943
  left: -270px;
3908
3944
  }
3909
3945
  /* Tablet landscape and bigger */
3910
- @media (min-width: 960px) {
3946
+ @media (min-width: 640px) {
3911
3947
  :not(.uk-offcanvas-flip).uk-offcanvas-container-animation {
3912
3948
  left: 350px;
3913
3949
  }
@@ -4779,6 +4815,7 @@ ul.uk-nav-sub {
4779
4815
  */
4780
4816
  .uk-navbar {
4781
4817
  display: flex;
4818
+ --uk-navbar-nav-item-gap: 0px;
4782
4819
  /* 1 */
4783
4820
  position: relative;
4784
4821
  }
@@ -4799,6 +4836,7 @@ ul.uk-nav-sub {
4799
4836
  .uk-navbar-center-left > *,
4800
4837
  .uk-navbar-center-right > * {
4801
4838
  display: flex;
4839
+ gap: var(--uk-navbar-nav-item-gap);
4802
4840
  /* 1 */
4803
4841
  align-items: center;
4804
4842
  }
@@ -4837,10 +4875,10 @@ ul.uk-nav-sub {
4837
4875
  top: 0;
4838
4876
  }
4839
4877
  .uk-navbar-center-left {
4840
- right: 100%;
4878
+ right: calc(100% + var(--uk-navbar-nav-item-gap));
4841
4879
  }
4842
4880
  .uk-navbar-center-right {
4843
- left: 100%;
4881
+ left: calc(100% + var(--uk-navbar-nav-item-gap));
4844
4882
  }
4845
4883
  [class*='uk-navbar-center-'] {
4846
4884
  width: max-content;
@@ -4853,6 +4891,7 @@ ul.uk-nav-sub {
4853
4891
  */
4854
4892
  .uk-navbar-nav {
4855
4893
  display: flex;
4894
+ gap: var(--uk-navbar-nav-item-gap);
4856
4895
  /* 1 */
4857
4896
  margin: 0;
4858
4897
  padding: 0;
@@ -4919,6 +4958,7 @@ ul.uk-nav-sub {
4919
4958
  /* Item
4920
4959
  ========================================================================== */
4921
4960
  .uk-navbar-item {
4961
+ padding: 0 15px;
4922
4962
  color: #666;
4923
4963
  }
4924
4964
  /*
@@ -4974,8 +5014,9 @@ ul.uk-nav-sub {
4974
5014
  /* 2 */
4975
5015
  position: absolute;
4976
5016
  z-index: 1020;
4977
- --uk-position-offset: 0px;
4978
- --uk-position-viewport-offset: 10;
5017
+ --uk-position-offset: 0;
5018
+ --uk-position-shift-offset: 0;
5019
+ --uk-position-viewport-offset: 15px;
4979
5020
  /* 3 */
4980
5021
  box-sizing: border-box;
4981
5022
  width: 200px;
@@ -5023,21 +5064,36 @@ ul.uk-nav-sub {
5023
5064
  .uk-navbar-dropdown-width-5:not(.uk-navbar-dropdown-stack) {
5024
5065
  width: 1000px;
5025
5066
  }
5067
+ /*
5068
+ * Stretch modifier
5069
+ * 1. Allow scrolling
5070
+ */
5071
+ .uk-navbar-dropdown-stretch {
5072
+ --uk-position-offset: 0;
5073
+ --uk-position-shift-offset: 0;
5074
+ --uk-position-viewport-offset: 0;
5075
+ /* 1 */
5076
+ overflow-y: auto;
5077
+ -webkit-overflow-scrolling: touch;
5078
+ }
5026
5079
  /*
5027
5080
  * Dropbar modifier
5028
- * 1. Set position
5029
- * 2. Bottom padding for dropbar
5030
- * 3. Horizontal padding
5081
+ * 1. Reset dropdown width to prevent to early shifting
5082
+ * 2. Set position
5083
+ * 3. Bottom padding for dropbar
5084
+ * 4. Horizontal padding
5031
5085
  */
5032
5086
  .uk-navbar-dropdown-dropbar {
5033
5087
  /* 1 */
5034
- --uk-position-offset: 0px;
5035
- --uk-position-viewport-offset: 0;
5088
+ width: auto;
5036
5089
  /* 2 */
5037
- margin-bottom: 0px;
5090
+ --uk-position-offset: 0px;
5038
5091
  /* 3 */
5092
+ margin-bottom: 0px;
5093
+ /* 4 */
5039
5094
  padding-left: 15px;
5040
5095
  padding-right: 15px;
5096
+ --uk-position-shift-offset: 0;
5041
5097
  }
5042
5098
  /* Dropdown Nav
5043
5099
  * Adopts `uk-nav`
@@ -7409,7 +7465,6 @@ iframe[data-uk-cover] {
7409
7465
  }
7410
7466
  /*
7411
7467
  * Enable scrollbars if content is clipped
7412
- * Note: Firefox ignores `padding-bottom` for the scrollable overflow https://bugzilla.mozilla.org/show_bug.cgi?id=748518
7413
7468
  */
7414
7469
  .uk-overflow-auto {
7415
7470
  overflow: auto;
@@ -8538,6 +8593,9 @@ iframe[data-uk-cover] {
8538
8593
  .uk-position-z-index {
8539
8594
  z-index: 1;
8540
8595
  }
8596
+ .uk-position-z-index-zero {
8597
+ z-index: 0;
8598
+ }
8541
8599
  .uk-position-z-index-negative {
8542
8600
  z-index: -1;
8543
8601
  }