uikit 3.14.1 → 3.14.2-dev.57e3417c4

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 (74) hide show
  1. package/CHANGELOG.md +25 -3
  2. package/build/util.js +8 -2
  3. package/dist/css/uikit-core-rtl.css +47 -20
  4. package/dist/css/uikit-core-rtl.min.css +1 -1
  5. package/dist/css/uikit-core.css +47 -20
  6. package/dist/css/uikit-core.min.css +1 -1
  7. package/dist/css/uikit-rtl.css +49 -32
  8. package/dist/css/uikit-rtl.min.css +1 -1
  9. package/dist/css/uikit.css +49 -32
  10. package/dist/css/uikit.min.css +1 -1
  11. package/dist/js/components/countdown.js +1 -1
  12. package/dist/js/components/countdown.min.js +1 -1
  13. package/dist/js/components/filter.js +1 -1
  14. package/dist/js/components/filter.min.js +1 -1
  15. package/dist/js/components/lightbox-panel.js +6 -1
  16. package/dist/js/components/lightbox-panel.min.js +1 -1
  17. package/dist/js/components/lightbox.js +6 -1
  18. package/dist/js/components/lightbox.min.js +1 -1
  19. package/dist/js/components/notification.js +1 -1
  20. package/dist/js/components/notification.min.js +1 -1
  21. package/dist/js/components/parallax.js +2 -2
  22. package/dist/js/components/parallax.min.js +1 -1
  23. package/dist/js/components/slider-parallax.js +1 -1
  24. package/dist/js/components/slider-parallax.min.js +1 -1
  25. package/dist/js/components/slider.js +1 -1
  26. package/dist/js/components/slider.min.js +1 -1
  27. package/dist/js/components/slideshow-parallax.js +1 -1
  28. package/dist/js/components/slideshow-parallax.min.js +1 -1
  29. package/dist/js/components/slideshow.js +1 -1
  30. package/dist/js/components/slideshow.min.js +1 -1
  31. package/dist/js/components/sortable.js +1 -1
  32. package/dist/js/components/sortable.min.js +1 -1
  33. package/dist/js/components/tooltip.js +25 -15
  34. package/dist/js/components/tooltip.min.js +1 -1
  35. package/dist/js/components/upload.js +1 -1
  36. package/dist/js/components/upload.min.js +1 -1
  37. package/dist/js/uikit-core.js +73 -56
  38. package/dist/js/uikit-core.min.js +1 -1
  39. package/dist/js/uikit-icons.js +1 -1
  40. package/dist/js/uikit-icons.min.js +1 -1
  41. package/dist/js/uikit.js +74 -57
  42. package/dist/js/uikit.min.js +1 -1
  43. package/package.json +11 -11
  44. package/src/js/components/parallax.js +1 -1
  45. package/src/js/core/drop.js +16 -7
  46. package/src/js/core/height-viewport.js +1 -2
  47. package/src/js/core/toggle.js +4 -0
  48. package/src/js/mixin/position.js +18 -23
  49. package/src/js/mixin/togglable.js +5 -0
  50. package/src/js/util/position.js +24 -22
  51. package/src/js/util/viewport.js +6 -13
  52. package/src/less/components/drop.less +2 -0
  53. package/src/less/components/dropdown.less +2 -0
  54. package/src/less/components/modal.less +19 -4
  55. package/src/less/components/navbar.less +28 -8
  56. package/src/less/components/offcanvas.less +21 -21
  57. package/src/less/components/tooltip.less +1 -0
  58. package/src/less/components/utility.less +1 -1
  59. package/src/less/theme/navbar.less +3 -10
  60. package/src/scss/components/drop.scss +2 -0
  61. package/src/scss/components/dropdown.scss +2 -0
  62. package/src/scss/components/modal.scss +19 -4
  63. package/src/scss/components/navbar.scss +28 -8
  64. package/src/scss/components/offcanvas.scss +21 -21
  65. package/src/scss/components/tooltip.scss +1 -0
  66. package/src/scss/components/utility.scss +1 -1
  67. package/src/scss/mixins-theme.scss +0 -10
  68. package/src/scss/theme/navbar.scss +3 -0
  69. package/src/scss/variables-theme.scss +23 -11
  70. package/src/scss/variables.scss +23 -11
  71. package/tests/drop.html +20 -2
  72. package/tests/dropdown.html +6 -0
  73. package/tests/navbar.html +21 -59
  74. package/tests/offcanvas.html +8 -8
@@ -1,4 +1,4 @@
1
- /*! UIkit 3.14.1 | https://www.getuikit.com | (c) 2014 - 2022 YOOtheme | MIT License */
1
+ /*! UIkit 3.14.2-dev.57e3417c4 | https://www.getuikit.com | (c) 2014 - 2022 YOOtheme | MIT License */
2
2
  /* ========================================================================
3
3
  Component: Base
4
4
  ========================================================================== */
@@ -3492,6 +3492,7 @@ select.uk-form-width-xsmall {
3492
3492
  position: absolute;
3493
3493
  z-index: 1020;
3494
3494
  --uk-position-offset: 20px;
3495
+ --uk-position-viewport-offset: 15px;
3495
3496
  /* 3 */
3496
3497
  box-sizing: border-box;
3497
3498
  width: 300px;
@@ -3521,6 +3522,7 @@ select.uk-form-width-xsmall {
3521
3522
  position: absolute;
3522
3523
  z-index: 1020;
3523
3524
  --uk-position-offset: 10px;
3525
+ --uk-position-viewport-offset: 15px;
3524
3526
  /* 3 */
3525
3527
  box-sizing: border-box;
3526
3528
  min-width: 200px;
@@ -3707,20 +3709,32 @@ select.uk-form-width-xsmall {
3707
3709
  ========================================================================== */
3708
3710
  .uk-modal-body {
3709
3711
  display: flow-root;
3710
- padding: 30px 30px;
3712
+ padding: 20px 20px;
3711
3713
  }
3712
3714
  .uk-modal-header {
3713
3715
  display: flow-root;
3714
- padding: 15px 30px;
3716
+ padding: 10px 20px;
3715
3717
  background: #fff;
3716
3718
  border-bottom: 1px solid #e5e5e5;
3717
3719
  }
3718
3720
  .uk-modal-footer {
3719
3721
  display: flow-root;
3720
- padding: 15px 30px;
3722
+ padding: 10px 20px;
3721
3723
  background: #fff;
3722
3724
  border-top: 1px solid #e5e5e5;
3723
3725
  }
3726
+ /* Phone landscape and bigger */
3727
+ @media (min-width: 640px) {
3728
+ .uk-modal-body {
3729
+ padding: 30px 30px;
3730
+ }
3731
+ .uk-modal-header {
3732
+ padding: 15px 30px;
3733
+ }
3734
+ .uk-modal-footer {
3735
+ padding: 15px 30px;
3736
+ }
3737
+ }
3724
3738
  /*
3725
3739
  * Remove margin from the last-child
3726
3740
  */
@@ -3997,12 +4011,12 @@ select.uk-form-width-xsmall {
3997
4011
  overflow-y: auto;
3998
4012
  -webkit-overflow-scrolling: touch;
3999
4013
  }
4000
- /* Tablet landscape and bigger */
4001
- @media (min-width: 960px) {
4014
+ /* Phone landscape and bigger */
4015
+ @media (min-width: 640px) {
4002
4016
  .uk-offcanvas-bar {
4003
4017
  right: -350px;
4004
4018
  width: 350px;
4005
- padding: 40px 40px;
4019
+ padding: 30px 30px;
4006
4020
  }
4007
4021
  }
4008
4022
  /* Flip modifier */
@@ -4011,7 +4025,7 @@ select.uk-form-width-xsmall {
4011
4025
  left: -270px;
4012
4026
  }
4013
4027
  /* Tablet landscape and bigger */
4014
- @media (min-width: 960px) {
4028
+ @media (min-width: 640px) {
4015
4029
  .uk-offcanvas-flip .uk-offcanvas-bar {
4016
4030
  left: -350px;
4017
4031
  }
@@ -4067,7 +4081,7 @@ select.uk-form-width-xsmall {
4067
4081
  width: 270px;
4068
4082
  }
4069
4083
  /* Tablet landscape and bigger */
4070
- @media (min-width: 960px) {
4084
+ @media (min-width: 640px) {
4071
4085
  .uk-open > .uk-offcanvas-reveal {
4072
4086
  width: 350px;
4073
4087
  }
@@ -4090,10 +4104,10 @@ select.uk-form-width-xsmall {
4090
4104
  padding: 5px;
4091
4105
  }
4092
4106
  /* Tablet landscape and bigger */
4093
- @media (min-width: 960px) {
4107
+ @media (min-width: 640px) {
4094
4108
  .uk-offcanvas-close {
4095
- top: 20px;
4096
- left: 20px;
4109
+ top: 10px;
4110
+ left: 10px;
4097
4111
  }
4098
4112
  }
4099
4113
  /*
@@ -4171,7 +4185,7 @@ select.uk-form-width-xsmall {
4171
4185
  right: -270px;
4172
4186
  }
4173
4187
  /* Tablet landscape and bigger */
4174
- @media (min-width: 960px) {
4188
+ @media (min-width: 640px) {
4175
4189
  :not(.uk-offcanvas-flip).uk-offcanvas-container-animation {
4176
4190
  right: 350px;
4177
4191
  }
@@ -4354,6 +4368,7 @@ select.uk-form-width-xsmall {
4354
4368
  position: absolute;
4355
4369
  z-index: 1030;
4356
4370
  --uk-position-offset: 10px;
4371
+ --uk-position-viewport-offset: 10;
4357
4372
  /* 3 */
4358
4373
  top: 0;
4359
4374
  /* 4 */
@@ -5045,6 +5060,7 @@ ul.uk-nav-sub {
5045
5060
  */
5046
5061
  .uk-navbar {
5047
5062
  display: flex;
5063
+ --uk-navbar-nav-item-gap: 30px;
5048
5064
  /* 1 */
5049
5065
  position: relative;
5050
5066
  }
@@ -5065,6 +5081,7 @@ ul.uk-nav-sub {
5065
5081
  .uk-navbar-center-right > *,
5066
5082
  .uk-navbar-center-left > * {
5067
5083
  display: flex;
5084
+ gap: var(--uk-navbar-nav-item-gap);
5068
5085
  /* 1 */
5069
5086
  align-items: center;
5070
5087
  }
@@ -5104,9 +5121,11 @@ ul.uk-nav-sub {
5104
5121
  }
5105
5122
  .uk-navbar-center-right {
5106
5123
  left: 100%;
5124
+ left: calc(100% + var(--uk-navbar-nav-item-gap));
5107
5125
  }
5108
5126
  .uk-navbar-center-left {
5109
5127
  right: 100%;
5128
+ right: calc(100% + var(--uk-navbar-nav-item-gap));
5110
5129
  }
5111
5130
  [class*='uk-navbar-center-'] {
5112
5131
  width: max-content;
@@ -5119,6 +5138,7 @@ ul.uk-nav-sub {
5119
5138
  */
5120
5139
  .uk-navbar-nav {
5121
5140
  display: flex;
5141
+ gap: var(--uk-navbar-nav-item-gap);
5122
5142
  /* 1 */
5123
5143
  margin: 0;
5124
5144
  padding: 0;
@@ -5153,7 +5173,7 @@ ul.uk-nav-sub {
5153
5173
  /* 3 */
5154
5174
  box-sizing: border-box;
5155
5175
  min-height: 80px;
5156
- padding: 0 15px;
5176
+ padding: 0 0;
5157
5177
  /* 4 */
5158
5178
  font-size: 0.875rem;
5159
5179
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
@@ -5188,6 +5208,7 @@ ul.uk-nav-sub {
5188
5208
  /* Item
5189
5209
  ========================================================================== */
5190
5210
  .uk-navbar-item {
5211
+ padding: 0 0;
5191
5212
  color: #666;
5192
5213
  }
5193
5214
  /*
@@ -5244,6 +5265,8 @@ ul.uk-nav-sub {
5244
5265
  position: absolute;
5245
5266
  z-index: 1020;
5246
5267
  --uk-position-offset: 15px;
5268
+ --uk-position-shift-offset: 0;
5269
+ --uk-position-viewport-offset: 15px;
5247
5270
  /* 3 */
5248
5271
  box-sizing: border-box;
5249
5272
  width: 200px;
@@ -5294,18 +5317,22 @@ ul.uk-nav-sub {
5294
5317
  }
5295
5318
  /*
5296
5319
  * Dropbar modifier
5297
- * 1. Set position
5298
- * 2. Bottom padding for dropbar
5299
- * 3. Horizontal padding
5320
+ * 1. Reset dropdown width to prevent to early shifting
5321
+ * 2. Set position
5322
+ * 3. Bottom padding for dropbar
5323
+ * 4. Horizontal padding
5300
5324
  */
5301
5325
  .uk-navbar-dropdown-dropbar {
5302
5326
  /* 1 */
5303
- --uk-position-offset: 0px;
5327
+ width: auto;
5304
5328
  /* 2 */
5305
- margin-bottom: 0px;
5329
+ --uk-position-offset: 0px;
5306
5330
  /* 3 */
5307
- padding-right: 15px;
5308
- padding-left: 15px;
5331
+ margin-bottom: 0px;
5332
+ /* 4 */
5333
+ padding-right: 0;
5334
+ padding-left: 0;
5335
+ --uk-position-shift-offset: 0;
5309
5336
  box-shadow: none;
5310
5337
  }
5311
5338
  /* Dropdown Nav
@@ -5368,16 +5395,6 @@ ul.uk-nav-sub {
5368
5395
  background: #fff;
5369
5396
  box-shadow: 0 5px 7px rgba(0, 0, 0, 0.05);
5370
5397
  }
5371
- /*
5372
- * Navbar
5373
- */
5374
- .uk-navbar-container > .uk-container .uk-navbar-right {
5375
- margin-right: -15px;
5376
- margin-left: -15px;
5377
- }
5378
- .uk-navbar-container > .uk-container .uk-navbar-left {
5379
- margin-left: -15px;
5380
- }
5381
5398
  /*
5382
5399
  * Grid Divider
5383
5400
  */
@@ -8079,7 +8096,7 @@ iframe[data-uk-cover] {
8079
8096
  text-decoration: none;
8080
8097
  }
8081
8098
  .uk-logo > :where(img, svg, video) {
8082
- display: block;
8099
+ display: inline-block;
8083
8100
  }
8084
8101
  .uk-logo-inverse {
8085
8102
  display: none;