uikit 3.22.0 → 3.22.2

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 (48) hide show
  1. package/CHANGELOG.md +12 -0
  2. package/dist/css/uikit-core-rtl.css +66 -92
  3. package/dist/css/uikit-core-rtl.min.css +1 -1
  4. package/dist/css/uikit-core.css +66 -92
  5. package/dist/css/uikit-core.min.css +1 -1
  6. package/dist/css/uikit-rtl.css +66 -92
  7. package/dist/css/uikit-rtl.min.css +1 -1
  8. package/dist/css/uikit.css +66 -92
  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 +2 -2
  13. package/dist/js/components/filter.min.js +1 -1
  14. package/dist/js/components/lightbox-panel.js +10 -10
  15. package/dist/js/components/lightbox-panel.min.js +1 -1
  16. package/dist/js/components/lightbox.js +11 -11
  17. package/dist/js/components/lightbox.min.js +1 -1
  18. package/dist/js/components/notification.js +2 -2
  19. package/dist/js/components/notification.min.js +1 -1
  20. package/dist/js/components/parallax.js +10 -10
  21. package/dist/js/components/parallax.min.js +1 -1
  22. package/dist/js/components/slider-parallax.js +10 -10
  23. package/dist/js/components/slider-parallax.min.js +1 -1
  24. package/dist/js/components/slider.js +13 -13
  25. package/dist/js/components/slider.min.js +1 -1
  26. package/dist/js/components/slideshow-parallax.js +10 -10
  27. package/dist/js/components/slideshow-parallax.min.js +1 -1
  28. package/dist/js/components/slideshow.js +17 -17
  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 +5 -5
  33. package/dist/js/components/tooltip.min.js +1 -1
  34. package/dist/js/components/upload.js +3 -3
  35. package/dist/js/components/upload.min.js +1 -1
  36. package/dist/js/uikit-core.js +50 -50
  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 +65 -65
  41. package/dist/js/uikit.min.js +1 -1
  42. package/package.json +1 -1
  43. package/src/less/components/accordion.less +4 -3
  44. package/src/less/components/list.less +26 -49
  45. package/src/scss/components/accordion.scss +3 -2
  46. package/src/scss/components/list.scss +22 -45
  47. package/src/scss/mixins-theme.scss +4 -4
  48. package/src/scss/mixins.scss +5 -5
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.22.0",
5
+ "version": "3.22.2",
6
6
  "main": "dist/js/uikit.js",
7
7
  "style": "dist/css/uikit.css",
8
8
  "sideEffects": [
package/src/less/components/accordion.less CHANGED
@@ -38,11 +38,12 @@
38
38
  /* Item
39
39
  ========================================================================== */
40
40
 
41
- .uk-accordion > :nth-child(n+2) {
42
- margin-top: @accordion-item-margin-top;
41
+ .uk-accordion > * {
43
42
  .hook-accordion-item();
44
43
  }
45
44
 
45
+ .uk-accordion > :nth-child(n+2) { margin-top: @accordion-item-margin-top; }
46
+
46
47
 
47
48
  /* Title
48
49
  ========================================================================== */
@@ -100,7 +101,7 @@
100
101
 
101
102
  .hook-inverse() {
102
103
 
103
- .uk-accordion > :nth-child(n+2) {
104
+ .uk-accordion > * {
104
105
  .hook-inverse-accordion-item();
105
106
  }
106
107
 
package/src/less/components/list.less CHANGED
@@ -83,68 +83,45 @@
83
83
 
84
84
 
85
85
  /* Marker modifiers
86
- * Moving `::marker` inside `::before` to style it differently
87
- * To style the `::marker` is currently only supported in Firefox and Safari
88
86
  ========================================================================== */
89
87
 
90
- .uk-list-disc > *,
91
- .uk-list-circle > *,
92
- .uk-list-square > *,
93
- .uk-list-decimal > *,
94
- .uk-list-hyphen > * { padding-left: @list-padding-left; }
88
+ .uk-list-disc,
89
+ .uk-list-circle,
90
+ .uk-list-square,
91
+ .uk-list-decimal,
92
+ .uk-list-hyphen { padding-left: @list-padding-left; }
95
93
 
96
- /*
97
- * Type modifiers
98
- */
99
-
100
- .uk-list-decimal { counter-reset: decimal; }
101
- .uk-list-decimal > * { counter-increment: decimal; }
102
-
103
- .uk-list-disc > ::before,
104
- .uk-list-circle > ::before,
105
- .uk-list-square > ::before,
106
- .uk-list-decimal > ::before,
107
- .uk-list-hyphen > ::before {
108
- content: "";
109
- position: relative;
110
- left: -@list-padding-left;
111
- width: @list-padding-left;
112
- height: @list-marker-height;
113
- margin-bottom: -@list-marker-height;
114
- display: list-item;
115
- list-style-position: inside;
116
- text-align: right;
117
- }
118
-
119
- .uk-list-disc > ::before { list-style-type: disc; }
120
- .uk-list-circle > ::before { list-style-type: circle; }
121
- .uk-list-square > ::before { list-style-type: square; }
122
- .uk-list-decimal > ::before { content: counter(decimal, decimal) '\200A.\00A0'; }
123
- .uk-list-hyphen > ::before { content: '–\00A0\00A0'; }
94
+ .uk-list-disc { list-style-type: disc; }
95
+ .uk-list-circle { list-style-type: circle; }
96
+ .uk-list-square { list-style-type: square; }
97
+ .uk-list-decimal { list-style-type: decimal; }
98
+ .uk-list-hyphen { list-style-type: '– '; }
124
99
 
125
100
  /*
126
101
  * Color modifiers
127
102
  */
128
103
 
129
- .uk-list-muted > ::before { color: @list-muted-color !important; }
130
- .uk-list-emphasis > ::before { color: @list-emphasis-color !important; }
131
- .uk-list-primary > ::before { color: @list-primary-color !important; }
132
- .uk-list-secondary > ::before { color: @list-secondary-color !important; }
104
+ .uk-list-muted > ::marker { color: @list-muted-color !important; }
105
+ .uk-list-emphasis > ::marker { color: @list-emphasis-color !important; }
106
+ .uk-list-primary > ::marker { color: @list-primary-color !important; }
107
+ .uk-list-secondary > ::marker { color: @list-secondary-color !important; }
133
108
 
134
109
 
135
110
  /* Image bullet modifier
136
111
  ========================================================================== */
137
112
 
138
- .uk-list-bullet > * { padding-left: @list-padding-left; }
113
+ .uk-list-bullet > * {
114
+ position: relative;
115
+ padding-left: @list-padding-left;
116
+ }
139
117
 
140
118
  .uk-list-bullet > ::before {
141
119
  content: "";
142
- display: list-item;
143
- position: relative;
144
- left: -@list-padding-left;
120
+ position: absolute;
121
+ top: 0;
122
+ left: 0;
145
123
  width: @list-padding-left;
146
- height: @list-marker-height;
147
- margin-bottom: -@list-marker-height;
124
+ height: @global-line-height * 1em;
148
125
  .svg-fill(@internal-list-bullet-image, "#000", @list-bullet-icon-color);
149
126
  background-repeat: no-repeat;
150
127
  background-position: 50% 50%;
@@ -242,10 +219,10 @@
242
219
 
243
220
  .hook-inverse() {
244
221
 
245
- .uk-list-muted > ::before { color: @inverse-list-muted-color !important; }
246
- .uk-list-emphasis > ::before { color: @inverse-list-emphasis-color !important; }
247
- .uk-list-primary > ::before { color: @inverse-list-primary-color !important; }
248
- .uk-list-secondary > ::before { color: @inverse-list-secondary-color !important; }
222
+ .uk-list-muted > ::marker { color: @inverse-list-muted-color !important; }
223
+ .uk-list-emphasis > ::marker { color: @inverse-list-emphasis-color !important; }
224
+ .uk-list-primary > ::marker { color: @inverse-list-primary-color !important; }
225
+ .uk-list-secondary > ::marker { color: @inverse-list-secondary-color !important; }
249
226
 
250
227
  .uk-list-bullet > ::before {
251
228
  .svg-fill(@internal-list-bullet-image, "#000", @inverse-list-bullet-icon-color);
package/src/scss/components/accordion.scss CHANGED
@@ -32,11 +32,12 @@
32
32
  /* Item
33
33
  ========================================================================== */
34
34
 
35
- .uk-accordion > :nth-child(n+2) {
36
- margin-top: $accordion-item-margin-top;
35
+ .uk-accordion > * {
37
36
  @if(mixin-exists(hook-accordion-item)) {@include hook-accordion-item();}
38
37
  }
39
38
 
39
+ .uk-accordion > :nth-child(n+2) { margin-top: $accordion-item-margin-top; }
40
+
40
41
 
41
42
  /* Title
42
43
  ========================================================================== */
package/src/scss/components/list.scss CHANGED
@@ -64,68 +64,45 @@
64
64
 
65
65
 
66
66
  /* Marker modifiers
67
- * Moving `::marker` inside `::before` to style it differently
68
- * To style the `::marker` is currently only supported in Firefox and Safari
69
67
  ========================================================================== */
70
68
 
71
- .uk-list-disc > *,
72
- .uk-list-circle > *,
73
- .uk-list-square > *,
74
- .uk-list-decimal > *,
75
- .uk-list-hyphen > * { padding-left: $list-padding-left; }
69
+ .uk-list-disc,
70
+ .uk-list-circle,
71
+ .uk-list-square,
72
+ .uk-list-decimal,
73
+ .uk-list-hyphen { padding-left: $list-padding-left; }
76
74
 
77
- /*
78
- * Type modifiers
79
- */
80
-
81
- .uk-list-decimal { counter-reset: decimal; }
82
- .uk-list-decimal > * { counter-increment: decimal; }
83
-
84
- .uk-list-disc > ::before,
85
- .uk-list-circle > ::before,
86
- .uk-list-square > ::before,
87
- .uk-list-decimal > ::before,
88
- .uk-list-hyphen > ::before {
89
- content: "";
90
- position: relative;
91
- left: (-$list-padding-left);
92
- width: $list-padding-left;
93
- height: $list-marker-height;
94
- margin-bottom: (-$list-marker-height);
95
- display: list-item;
96
- list-style-position: inside;
97
- text-align: right;
98
- }
99
-
100
- .uk-list-disc > ::before { list-style-type: disc; }
101
- .uk-list-circle > ::before { list-style-type: circle; }
102
- .uk-list-square > ::before { list-style-type: square; }
103
- .uk-list-decimal > ::before { content: counter(decimal, decimal) '\200A.\00A0'; }
104
- .uk-list-hyphen > ::before { content: '–\00A0\00A0'; }
75
+ .uk-list-disc { list-style-type: disc; }
76
+ .uk-list-circle { list-style-type: circle; }
77
+ .uk-list-square { list-style-type: square; }
78
+ .uk-list-decimal { list-style-type: decimal; }
79
+ .uk-list-hyphen { list-style-type: '– '; }
105
80
 
106
81
  /*
107
82
  * Color modifiers
108
83
  */
109
84
 
110
- .uk-list-muted > ::before { color: $list-muted-color !important; }
111
- .uk-list-emphasis > ::before { color: $list-emphasis-color !important; }
112
- .uk-list-primary > ::before { color: $list-primary-color !important; }
113
- .uk-list-secondary > ::before { color: $list-secondary-color !important; }
85
+ .uk-list-muted > ::marker { color: $list-muted-color !important; }
86
+ .uk-list-emphasis > ::marker { color: $list-emphasis-color !important; }
87
+ .uk-list-primary > ::marker { color: $list-primary-color !important; }
88
+ .uk-list-secondary > ::marker { color: $list-secondary-color !important; }
114
89
 
115
90
 
116
91
  /* Image bullet modifier
117
92
  ========================================================================== */
118
93
 
119
- .uk-list-bullet > * { padding-left: $list-padding-left; }
94
+ .uk-list-bullet > * {
95
+ position: relative;
96
+ padding-left: $list-padding-left;
97
+ }
120
98
 
121
99
  .uk-list-bullet > ::before {
122
100
  content: "";
123
- display: list-item;
124
- position: relative;
125
- left: (-$list-padding-left);
101
+ position: absolute;
102
+ top: 0;
103
+ left: 0;
126
104
  width: $list-padding-left;
127
- height: $list-marker-height;
128
- margin-bottom: (-$list-marker-height);
105
+ height: $global-line-height * 1em;
129
106
  @include svg-fill($internal-list-bullet-image, "#000", $list-bullet-icon-color);
130
107
  background-repeat: no-repeat;
131
108
  background-position: 50% 50%;
package/src/scss/mixins-theme.scss CHANGED
@@ -1266,10 +1266,10 @@
1266
1266
  }
1267
1267
  @mixin hook-inverse-component-list(){
1268
1268
 
1269
- .uk-list-muted > ::before { color: $inverse-list-muted-color !important; }
1270
- .uk-list-emphasis > ::before { color: $inverse-list-emphasis-color !important; }
1271
- .uk-list-primary > ::before { color: $inverse-list-primary-color !important; }
1272
- .uk-list-secondary > ::before { color: $inverse-list-secondary-color !important; }
1269
+ .uk-list-muted > ::marker { color: $inverse-list-muted-color !important; }
1270
+ .uk-list-emphasis > ::marker { color: $inverse-list-emphasis-color !important; }
1271
+ .uk-list-primary > ::marker { color: $inverse-list-primary-color !important; }
1272
+ .uk-list-secondary > ::marker { color: $inverse-list-secondary-color !important; }
1273
1273
 
1274
1274
  .uk-list-bullet > ::before {
1275
1275
  @include svg-fill($internal-list-bullet-image, "#000", $inverse-list-bullet-icon-color);
package/src/scss/mixins.scss CHANGED
@@ -9,7 +9,7 @@
9
9
  @mixin hook-inverse-accordion-title-hover(){}
10
10
  @mixin hook-inverse-component-accordion(){
11
11
 
12
- .uk-accordion > :nth-child(n+2) {
12
+ .uk-accordion > * {
13
13
  @if(mixin-exists(hook-inverse-accordion-item)) {@include hook-inverse-accordion-item();}
14
14
  }
15
15
 
@@ -1002,10 +1002,10 @@
1002
1002
  @mixin hook-inverse-list-striped(){}
1003
1003
  @mixin hook-inverse-component-list(){
1004
1004
 
1005
- .uk-list-muted > ::before { color: $inverse-list-muted-color !important; }
1006
- .uk-list-emphasis > ::before { color: $inverse-list-emphasis-color !important; }
1007
- .uk-list-primary > ::before { color: $inverse-list-primary-color !important; }
1008
- .uk-list-secondary > ::before { color: $inverse-list-secondary-color !important; }
1005
+ .uk-list-muted > ::marker { color: $inverse-list-muted-color !important; }
1006
+ .uk-list-emphasis > ::marker { color: $inverse-list-emphasis-color !important; }
1007
+ .uk-list-primary > ::marker { color: $inverse-list-primary-color !important; }
1008
+ .uk-list-secondary > ::marker { color: $inverse-list-secondary-color !important; }
1009
1009
 
1010
1010
  .uk-list-bullet > ::before {
1011
1011
  @include svg-fill($internal-list-bullet-image, "#000", $inverse-list-bullet-icon-color);