uikit 3.14.2 → 3.14.3-dev.5325d42a0
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.
- package/CHANGELOG.md +24 -3
- package/dist/css/uikit-core-rtl.css +84 -24
- package/dist/css/uikit-core-rtl.min.css +1 -1
- package/dist/css/uikit-core.css +1 -1
- package/dist/css/uikit-core.min.css +1 -1
- package/dist/css/uikit-rtl.css +90 -39
- package/dist/css/uikit-rtl.min.css +1 -1
- package/dist/css/uikit.css +90 -39
- package/dist/css/uikit.min.css +1 -1
- package/dist/js/components/countdown.js +1 -1
- package/dist/js/components/countdown.min.js +1 -1
- package/dist/js/components/filter.js +1 -1
- package/dist/js/components/filter.min.js +1 -1
- package/dist/js/components/lightbox-panel.js +1 -1
- package/dist/js/components/lightbox-panel.min.js +1 -1
- package/dist/js/components/lightbox.js +1 -1
- package/dist/js/components/lightbox.min.js +1 -1
- package/dist/js/components/notification.js +1 -1
- package/dist/js/components/notification.min.js +1 -1
- package/dist/js/components/parallax.js +1 -1
- package/dist/js/components/parallax.min.js +1 -1
- package/dist/js/components/slider-parallax.js +1 -1
- package/dist/js/components/slider-parallax.min.js +1 -1
- package/dist/js/components/slider.js +1 -1
- package/dist/js/components/slider.min.js +1 -1
- package/dist/js/components/slideshow-parallax.js +1 -1
- package/dist/js/components/slideshow-parallax.min.js +1 -1
- package/dist/js/components/slideshow.js +1 -1
- package/dist/js/components/slideshow.min.js +1 -1
- package/dist/js/components/sortable.js +1 -1
- package/dist/js/components/sortable.min.js +1 -1
- package/dist/js/components/tooltip.js +1 -1
- package/dist/js/components/tooltip.min.js +1 -1
- package/dist/js/components/upload.js +1 -1
- package/dist/js/components/upload.min.js +1 -1
- package/dist/js/uikit-core.js +6 -6
- package/dist/js/uikit-core.min.js +1 -1
- package/dist/js/uikit-icons.js +1 -1
- package/dist/js/uikit-icons.min.js +1 -1
- package/dist/js/uikit.js +209 -75
- package/dist/js/uikit.min.js +1 -1
- package/package.json +1 -1
- package/src/js/core/accordion.js +3 -3
- package/src/js/core/alert.js +1 -1
- package/src/js/core/drop.js +40 -20
- package/src/js/core/height-viewport.js +14 -9
- package/src/js/core/navbar.js +11 -9
- package/src/js/mixin/position.js +44 -13
- package/src/js/mixin/togglable.js +105 -19
- package/src/js/util/animation.js +1 -0
- package/src/js/util/dom.js +4 -3
- package/src/js/util/viewport.js +1 -1
- package/src/less/components/drop.less +19 -5
- package/src/less/components/dropdown.less +21 -5
- package/src/less/components/margin.less +13 -14
- package/src/less/components/modal.less +19 -4
- package/src/less/components/nav.less +1 -1
- package/src/less/components/navbar.less +60 -21
- package/src/less/components/offcanvas.less +21 -21
- package/src/less/components/position.less +1 -1
- package/src/less/components/utility.less +0 -1
- package/src/less/theme/dropdown.less +11 -0
- package/src/less/theme/navbar.less +10 -12
- package/src/scss/components/drop.scss +19 -5
- package/src/scss/components/dropdown.scss +21 -5
- package/src/scss/components/margin.scss +13 -14
- package/src/scss/components/modal.scss +19 -4
- package/src/scss/components/nav.scss +1 -1
- package/src/scss/components/navbar.scss +49 -10
- package/src/scss/components/offcanvas.scss +21 -21
- package/src/scss/components/position.scss +1 -1
- package/src/scss/components/utility.scss +0 -1
- package/src/scss/mixins-theme.scss +8 -12
- package/src/scss/mixins.scss +2 -0
- package/src/scss/theme/dropdown.scss +8 -0
- package/src/scss/theme/navbar.scss +7 -0
- package/src/scss/variables-theme.scss +26 -11
- package/src/scss/variables.scss +24 -11
- package/tests/drop.html +145 -2
- package/tests/dropdown.html +228 -13
- package/tests/height-viewport.html +62 -0
- package/tests/navbar.html +321 -14
- package/tests/offcanvas.html +8 -8
- package/tests/sticky-navbar.html +132 -0
package/dist/css/uikit.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/*! UIkit 3.14.
|
|
1
|
+
/*! UIkit 3.14.3-dev.5325d42a0 | https://www.getuikit.com | (c) 2014 - 2022 YOOtheme | MIT License */
|
|
2
2
|
/* ========================================================================
|
|
3
3
|
Component: Base
|
|
4
4
|
========================================================================== */
|
|
@@ -3492,7 +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:
|
|
3495
|
+
--uk-position-viewport-offset: 15px;
|
|
3496
3496
|
/* 3 */
|
|
3497
3497
|
box-sizing: border-box;
|
|
3498
3498
|
width: 300px;
|
|
@@ -3501,6 +3501,18 @@ select.uk-form-width-xsmall {
|
|
|
3501
3501
|
.uk-drop.uk-open {
|
|
3502
3502
|
display: block;
|
|
3503
3503
|
}
|
|
3504
|
+
/* Stretch modifier
|
|
3505
|
+
========================================================================== */
|
|
3506
|
+
/*
|
|
3507
|
+
* 1. Allow scrolling
|
|
3508
|
+
*/
|
|
3509
|
+
.uk-drop-stretch {
|
|
3510
|
+
--uk-position-offset: 0;
|
|
3511
|
+
--uk-position-viewport-offset: 0;
|
|
3512
|
+
/* 1 */
|
|
3513
|
+
overflow-y: auto;
|
|
3514
|
+
-webkit-overflow-scrolling: touch;
|
|
3515
|
+
}
|
|
3504
3516
|
/* Grid modifiers
|
|
3505
3517
|
========================================================================== */
|
|
3506
3518
|
.uk-drop-stack .uk-drop-grid > * {
|
|
@@ -3522,7 +3534,7 @@ select.uk-form-width-xsmall {
|
|
|
3522
3534
|
position: absolute;
|
|
3523
3535
|
z-index: 1020;
|
|
3524
3536
|
--uk-position-offset: 10px;
|
|
3525
|
-
--uk-position-viewport-offset:
|
|
3537
|
+
--uk-position-viewport-offset: 15px;
|
|
3526
3538
|
/* 3 */
|
|
3527
3539
|
box-sizing: border-box;
|
|
3528
3540
|
min-width: 200px;
|
|
@@ -3537,6 +3549,20 @@ select.uk-form-width-xsmall {
|
|
|
3537
3549
|
.uk-dropdown.uk-open {
|
|
3538
3550
|
display: block;
|
|
3539
3551
|
}
|
|
3552
|
+
/* Stretch modifier
|
|
3553
|
+
========================================================================== */
|
|
3554
|
+
/*
|
|
3555
|
+
* 1. Allow scrolling
|
|
3556
|
+
*/
|
|
3557
|
+
.uk-dropdown-stretch {
|
|
3558
|
+
--uk-position-offset: 0;
|
|
3559
|
+
--uk-position-viewport-offset: 0;
|
|
3560
|
+
/* 1 */
|
|
3561
|
+
overflow-y: auto;
|
|
3562
|
+
-webkit-overflow-scrolling: touch;
|
|
3563
|
+
box-shadow: none;
|
|
3564
|
+
background: #f8f8f8;
|
|
3565
|
+
}
|
|
3540
3566
|
/* Nav
|
|
3541
3567
|
* Adopts `uk-nav`
|
|
3542
3568
|
========================================================================== */
|
|
@@ -3709,20 +3735,32 @@ select.uk-form-width-xsmall {
|
|
|
3709
3735
|
========================================================================== */
|
|
3710
3736
|
.uk-modal-body {
|
|
3711
3737
|
display: flow-root;
|
|
3712
|
-
padding:
|
|
3738
|
+
padding: 20px 20px;
|
|
3713
3739
|
}
|
|
3714
3740
|
.uk-modal-header {
|
|
3715
3741
|
display: flow-root;
|
|
3716
|
-
padding:
|
|
3742
|
+
padding: 10px 20px;
|
|
3717
3743
|
background: #fff;
|
|
3718
3744
|
border-bottom: 1px solid #e5e5e5;
|
|
3719
3745
|
}
|
|
3720
3746
|
.uk-modal-footer {
|
|
3721
3747
|
display: flow-root;
|
|
3722
|
-
padding:
|
|
3748
|
+
padding: 10px 20px;
|
|
3723
3749
|
background: #fff;
|
|
3724
3750
|
border-top: 1px solid #e5e5e5;
|
|
3725
3751
|
}
|
|
3752
|
+
/* Phone landscape and bigger */
|
|
3753
|
+
@media (min-width: 640px) {
|
|
3754
|
+
.uk-modal-body {
|
|
3755
|
+
padding: 30px 30px;
|
|
3756
|
+
}
|
|
3757
|
+
.uk-modal-header {
|
|
3758
|
+
padding: 15px 30px;
|
|
3759
|
+
}
|
|
3760
|
+
.uk-modal-footer {
|
|
3761
|
+
padding: 15px 30px;
|
|
3762
|
+
}
|
|
3763
|
+
}
|
|
3726
3764
|
/*
|
|
3727
3765
|
* Remove margin from the last-child
|
|
3728
3766
|
*/
|
|
@@ -4006,12 +4044,12 @@ select.uk-form-width-xsmall {
|
|
|
4006
4044
|
overflow-y: auto;
|
|
4007
4045
|
-webkit-overflow-scrolling: touch;
|
|
4008
4046
|
}
|
|
4009
|
-
/*
|
|
4010
|
-
@media (min-width:
|
|
4047
|
+
/* Phone landscape and bigger */
|
|
4048
|
+
@media (min-width: 640px) {
|
|
4011
4049
|
.uk-offcanvas-bar {
|
|
4012
4050
|
left: -350px;
|
|
4013
4051
|
width: 350px;
|
|
4014
|
-
padding:
|
|
4052
|
+
padding: 30px 30px;
|
|
4015
4053
|
}
|
|
4016
4054
|
}
|
|
4017
4055
|
/* Flip modifier */
|
|
@@ -4020,7 +4058,7 @@ select.uk-form-width-xsmall {
|
|
|
4020
4058
|
right: -270px;
|
|
4021
4059
|
}
|
|
4022
4060
|
/* Tablet landscape and bigger */
|
|
4023
|
-
@media (min-width:
|
|
4061
|
+
@media (min-width: 640px) {
|
|
4024
4062
|
.uk-offcanvas-flip .uk-offcanvas-bar {
|
|
4025
4063
|
right: -350px;
|
|
4026
4064
|
}
|
|
@@ -4076,7 +4114,7 @@ select.uk-form-width-xsmall {
|
|
|
4076
4114
|
width: 270px;
|
|
4077
4115
|
}
|
|
4078
4116
|
/* Tablet landscape and bigger */
|
|
4079
|
-
@media (min-width:
|
|
4117
|
+
@media (min-width: 640px) {
|
|
4080
4118
|
.uk-open > .uk-offcanvas-reveal {
|
|
4081
4119
|
width: 350px;
|
|
4082
4120
|
}
|
|
@@ -4099,10 +4137,10 @@ select.uk-form-width-xsmall {
|
|
|
4099
4137
|
padding: 5px;
|
|
4100
4138
|
}
|
|
4101
4139
|
/* Tablet landscape and bigger */
|
|
4102
|
-
@media (min-width:
|
|
4140
|
+
@media (min-width: 640px) {
|
|
4103
4141
|
.uk-offcanvas-close {
|
|
4104
|
-
top:
|
|
4105
|
-
right:
|
|
4142
|
+
top: 10px;
|
|
4143
|
+
right: 10px;
|
|
4106
4144
|
}
|
|
4107
4145
|
}
|
|
4108
4146
|
/*
|
|
@@ -4180,7 +4218,7 @@ select.uk-form-width-xsmall {
|
|
|
4180
4218
|
left: -270px;
|
|
4181
4219
|
}
|
|
4182
4220
|
/* Tablet landscape and bigger */
|
|
4183
|
-
@media (min-width:
|
|
4221
|
+
@media (min-width: 640px) {
|
|
4184
4222
|
:not(.uk-offcanvas-flip).uk-offcanvas-container-animation {
|
|
4185
4223
|
left: 350px;
|
|
4186
4224
|
}
|
|
@@ -5055,6 +5093,7 @@ ul.uk-nav-sub {
|
|
|
5055
5093
|
*/
|
|
5056
5094
|
.uk-navbar {
|
|
5057
5095
|
display: flex;
|
|
5096
|
+
--uk-navbar-nav-item-gap: 30px;
|
|
5058
5097
|
/* 1 */
|
|
5059
5098
|
position: relative;
|
|
5060
5099
|
}
|
|
@@ -5075,6 +5114,7 @@ ul.uk-nav-sub {
|
|
|
5075
5114
|
.uk-navbar-center-left > *,
|
|
5076
5115
|
.uk-navbar-center-right > * {
|
|
5077
5116
|
display: flex;
|
|
5117
|
+
gap: var(--uk-navbar-nav-item-gap);
|
|
5078
5118
|
/* 1 */
|
|
5079
5119
|
align-items: center;
|
|
5080
5120
|
}
|
|
@@ -5114,9 +5154,11 @@ ul.uk-nav-sub {
|
|
|
5114
5154
|
}
|
|
5115
5155
|
.uk-navbar-center-left {
|
|
5116
5156
|
right: 100%;
|
|
5157
|
+
right: calc(100% + var(--uk-navbar-nav-item-gap));
|
|
5117
5158
|
}
|
|
5118
5159
|
.uk-navbar-center-right {
|
|
5119
5160
|
left: 100%;
|
|
5161
|
+
left: calc(100% + var(--uk-navbar-nav-item-gap));
|
|
5120
5162
|
}
|
|
5121
5163
|
[class*='uk-navbar-center-'] {
|
|
5122
5164
|
width: max-content;
|
|
@@ -5129,6 +5171,7 @@ ul.uk-nav-sub {
|
|
|
5129
5171
|
*/
|
|
5130
5172
|
.uk-navbar-nav {
|
|
5131
5173
|
display: flex;
|
|
5174
|
+
gap: var(--uk-navbar-nav-item-gap);
|
|
5132
5175
|
/* 1 */
|
|
5133
5176
|
margin: 0;
|
|
5134
5177
|
padding: 0;
|
|
@@ -5163,7 +5206,7 @@ ul.uk-nav-sub {
|
|
|
5163
5206
|
/* 3 */
|
|
5164
5207
|
box-sizing: border-box;
|
|
5165
5208
|
min-height: 80px;
|
|
5166
|
-
padding: 0
|
|
5209
|
+
padding: 0 0;
|
|
5167
5210
|
/* 4 */
|
|
5168
5211
|
font-size: 0.875rem;
|
|
5169
5212
|
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";
|
|
@@ -5198,6 +5241,7 @@ ul.uk-nav-sub {
|
|
|
5198
5241
|
/* Item
|
|
5199
5242
|
========================================================================== */
|
|
5200
5243
|
.uk-navbar-item {
|
|
5244
|
+
padding: 0 0;
|
|
5201
5245
|
color: #666;
|
|
5202
5246
|
}
|
|
5203
5247
|
/*
|
|
@@ -5254,7 +5298,8 @@ ul.uk-nav-sub {
|
|
|
5254
5298
|
position: absolute;
|
|
5255
5299
|
z-index: 1020;
|
|
5256
5300
|
--uk-position-offset: 15px;
|
|
5257
|
-
--uk-position-
|
|
5301
|
+
--uk-position-shift-offset: 0;
|
|
5302
|
+
--uk-position-viewport-offset: 15px;
|
|
5258
5303
|
/* 3 */
|
|
5259
5304
|
box-sizing: border-box;
|
|
5260
5305
|
width: 200px;
|
|
@@ -5303,21 +5348,38 @@ ul.uk-nav-sub {
|
|
|
5303
5348
|
.uk-navbar-dropdown-width-5:not(.uk-navbar-dropdown-stack) {
|
|
5304
5349
|
width: 1000px;
|
|
5305
5350
|
}
|
|
5351
|
+
/*
|
|
5352
|
+
* Stretch modifier
|
|
5353
|
+
* 1. Allow scrolling
|
|
5354
|
+
*/
|
|
5355
|
+
.uk-navbar-dropdown-stretch {
|
|
5356
|
+
--uk-position-offset: 0;
|
|
5357
|
+
--uk-position-shift-offset: 0;
|
|
5358
|
+
--uk-position-viewport-offset: 0;
|
|
5359
|
+
/* 1 */
|
|
5360
|
+
overflow-y: auto;
|
|
5361
|
+
-webkit-overflow-scrolling: touch;
|
|
5362
|
+
box-shadow: none;
|
|
5363
|
+
background: #f8f8f8;
|
|
5364
|
+
}
|
|
5306
5365
|
/*
|
|
5307
5366
|
* Dropbar modifier
|
|
5308
|
-
* 1.
|
|
5309
|
-
* 2.
|
|
5310
|
-
* 3.
|
|
5367
|
+
* 1. Reset dropdown width to prevent to early shifting
|
|
5368
|
+
* 2. Set position
|
|
5369
|
+
* 3. Bottom padding for dropbar
|
|
5370
|
+
* 4. Horizontal padding
|
|
5311
5371
|
*/
|
|
5312
5372
|
.uk-navbar-dropdown-dropbar {
|
|
5313
5373
|
/* 1 */
|
|
5314
|
-
|
|
5315
|
-
--uk-position-viewport-offset: 0;
|
|
5374
|
+
width: auto;
|
|
5316
5375
|
/* 2 */
|
|
5317
|
-
|
|
5376
|
+
--uk-position-offset: 0px;
|
|
5318
5377
|
/* 3 */
|
|
5319
|
-
|
|
5320
|
-
|
|
5378
|
+
margin-bottom: 0px;
|
|
5379
|
+
/* 4 */
|
|
5380
|
+
padding-left: 0;
|
|
5381
|
+
padding-right: 0;
|
|
5382
|
+
--uk-position-shift-offset: 0;
|
|
5321
5383
|
box-shadow: none;
|
|
5322
5384
|
}
|
|
5323
5385
|
/* Dropdown Nav
|
|
@@ -5380,19 +5442,6 @@ ul.uk-nav-sub {
|
|
|
5380
5442
|
background: #fff;
|
|
5381
5443
|
box-shadow: 0 5px 7px rgba(0, 0, 0, 0.05);
|
|
5382
5444
|
}
|
|
5383
|
-
/*
|
|
5384
|
-
* Navbar
|
|
5385
|
-
*/
|
|
5386
|
-
.uk-container > :not(.uk-navbar-justified) > .uk-navbar-left .uk-navbar-nav:first-child,
|
|
5387
|
-
.uk-container > :not(.uk-navbar-justified) > .uk-navbar-left .uk-navbar-item:first-child,
|
|
5388
|
-
.uk-container > :not(.uk-navbar-justified) > .uk-navbar-left .uk-navbar-toggle:first-child {
|
|
5389
|
-
margin-left: -15px;
|
|
5390
|
-
}
|
|
5391
|
-
.uk-container > :not(.uk-navbar-justified) > .uk-navbar-right .uk-navbar-nav:last-child,
|
|
5392
|
-
.uk-container > :not(.uk-navbar-justified) > .uk-navbar-right .uk-navbar-item:last-child,
|
|
5393
|
-
.uk-container > :not(.uk-navbar-justified) > .uk-navbar-right .uk-navbar-toggle:last-child {
|
|
5394
|
-
margin-right: -15px;
|
|
5395
|
-
}
|
|
5396
5445
|
/*
|
|
5397
5446
|
* Grid Divider
|
|
5398
5447
|
*/
|
|
@@ -7814,7 +7863,6 @@ iframe[data-uk-cover] {
|
|
|
7814
7863
|
}
|
|
7815
7864
|
/*
|
|
7816
7865
|
* Enable scrollbars if content is clipped
|
|
7817
|
-
* Note: Firefox ignores `padding-bottom` for the scrollable overflow https://bugzilla.mozilla.org/show_bug.cgi?id=748518
|
|
7818
7866
|
*/
|
|
7819
7867
|
.uk-overflow-auto {
|
|
7820
7868
|
overflow: auto;
|
|
@@ -8944,6 +8992,9 @@ iframe[data-uk-cover] {
|
|
|
8944
8992
|
.uk-position-z-index {
|
|
8945
8993
|
z-index: 1;
|
|
8946
8994
|
}
|
|
8995
|
+
.uk-position-z-index-zero {
|
|
8996
|
+
z-index: 0;
|
|
8997
|
+
}
|
|
8947
8998
|
.uk-position-z-index-negative {
|
|
8948
8999
|
z-index: -1;
|
|
8949
9000
|
}
|