uikit 3.15.10 → 3.15.11-dev.536b75ef2

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 +29 -12
  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 +2 -2
  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 +5 -2
  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 +52 -53
  37. package/dist/js/uikit-core.min.js +2 -2
  38. package/dist/js/uikit-icons.js +2 -1
  39. package/dist/js/uikit-icons.min.js +1 -1
  40. package/dist/js/uikit.js +57 -55
  41. package/dist/js/uikit.min.js +2 -2
  42. package/package.json +1 -1
  43. package/src/images/icons/crosshairs.svg +7 -0
  44. package/src/js/api/state.js +13 -6
  45. package/src/js/components/lightbox.js +1 -1
  46. package/src/js/components/tooltip.js +4 -1
  47. package/src/js/core/drop.js +5 -1
  48. package/src/js/core/icon.js +1 -3
  49. package/src/js/core/scrollspy.js +3 -2
  50. package/src/js/core/svg.js +2 -10
  51. package/src/js/core/switcher.js +16 -23
  52. package/src/js/core/toggle.js +1 -4
  53. package/src/js/util/position.js +11 -6
  54. package/tests/breadcrumb.html +25 -19
  55. package/tests/comment.html +9 -9
  56. package/tests/drop.html +2 -2
  57. package/tests/dropbar.html +1 -1
  58. package/tests/dropdown.html +1 -1
  59. package/tests/filter.html +1 -1
  60. package/tests/form.html +40 -40
  61. package/tests/icon.html +4 -0
  62. package/tests/index.html +22 -19
  63. package/tests/js/index.js +3 -3
  64. package/tests/lightbox.html +1 -1
  65. package/tests/list.html +1 -1
  66. package/tests/nav.html +1 -1
  67. package/tests/navbar.html +3 -3
  68. package/tests/search.html +21 -21
  69. package/tests/slider.html +3 -3
  70. package/tests/slideshow.html +2 -2
  71. package/tests/sticky.html +1 -1
  72. package/tests/table.html +9 -9
  73. package/tests/tooltip.html +2 -2
  74. package/tests/utility.html +4 -4
package/tests/search.html CHANGED
@@ -18,31 +18,31 @@
18
18
 
19
19
  <div class="uk-margin">
20
20
  <form class="uk-search uk-search-default">
21
- <input class="uk-search-input" type="search" placeholder="Search" autofocus>
21
+ <input class="uk-search-input" type="search" placeholder="Search" aria-label="Search" autofocus>
22
22
  </form>
23
23
  </div>
24
24
 
25
25
  <div class="uk-margin" uk-margin>
26
26
  <form class="uk-search uk-search-default">
27
27
  <span uk-search-icon></span>
28
- <input class="uk-search-input" type="search" placeholder="Icon...">
28
+ <input class="uk-search-input" type="search" placeholder="Icon..." aria-label="Search">
29
29
  </form>
30
30
 
31
31
  <form class="uk-search uk-search-default">
32
32
  <span class="uk-search-icon-flip" uk-search-icon></span>
33
- <input class="uk-search-input" type="search" placeholder="Flip...">
33
+ <input class="uk-search-input" type="search" placeholder="Flip..." aria-label="Search">
34
34
  </form>
35
35
  </div>
36
36
 
37
37
  <div class="uk-margin" uk-margin>
38
38
  <form class="uk-search uk-search-default">
39
39
  <a href="#" uk-search-icon></a>
40
- <input class="uk-search-input" type="search" placeholder="Link...">
40
+ <input class="uk-search-input" type="search" placeholder="Link..." aria-label="Search">
41
41
  </form>
42
42
 
43
43
  <form class="uk-search uk-search-default">
44
44
  <button class="uk-search-icon-flip" uk-search-icon></button>
45
- <input class="uk-search-input" type="search" placeholder="Button...">
45
+ <input class="uk-search-input" type="search" placeholder="Button..." aria-label="Search">
46
46
  </form>
47
47
  </div>
48
48
 
@@ -53,7 +53,7 @@
53
53
  <div class="uk-navbar-item">
54
54
 
55
55
  <form class="uk-search uk-search-navbar">
56
- <input class="uk-search-input" type="search" placeholder="Search">
56
+ <input class="uk-search-input" type="search" placeholder="Search" aria-label="Search">
57
57
  </form>
58
58
 
59
59
  </div>
@@ -66,7 +66,7 @@
66
66
 
67
67
  <form class="uk-search uk-search-navbar">
68
68
  <span uk-search-icon></span>
69
- <input class="uk-search-input" type="search" placeholder="Icon...">
69
+ <input class="uk-search-input" type="search" placeholder="Icon..." aria-label="Search">
70
70
  </form>
71
71
 
72
72
  </div>
@@ -76,7 +76,7 @@
76
76
 
77
77
  <form class="uk-search uk-search-navbar">
78
78
  <span class="uk-search-icon-flip" uk-search-icon></span>
79
- <input class="uk-search-input" type="search" placeholder="Flip...">
79
+ <input class="uk-search-input" type="search" placeholder="Flip..." aria-label="Search">
80
80
  </form>
81
81
 
82
82
  </div>
@@ -89,7 +89,7 @@
89
89
 
90
90
  <form class="uk-search uk-search-navbar">
91
91
  <a href="#" uk-search-icon></a>
92
- <input class="uk-search-input" type="search" placeholder="Link...">
92
+ <input class="uk-search-input" type="search" placeholder="Link..." aria-label="Search">
93
93
  </form>
94
94
 
95
95
  </div>
@@ -99,7 +99,7 @@
99
99
 
100
100
  <form class="uk-search uk-search-navbar">
101
101
  <button class="uk-search-icon-flip" uk-search-icon></button>
102
- <input class="uk-search-input" type="search" placeholder="Button...">
102
+ <input class="uk-search-input" type="search" placeholder="Button..." aria-label="Search">
103
103
  </form>
104
104
 
105
105
  </div>
@@ -110,31 +110,31 @@
110
110
 
111
111
  <div class="uk-margin">
112
112
  <form class="uk-search uk-search-large">
113
- <input class="uk-search-input" type="search" placeholder="Search">
113
+ <input class="uk-search-input" type="search" placeholder="Search" aria-label="Search">
114
114
  </form>
115
115
  </div>
116
116
 
117
117
  <div class="uk-margin" uk-margin>
118
118
  <form class="uk-search uk-search-large">
119
119
  <span uk-search-icon></span>
120
- <input class="uk-search-input" type="search" placeholder="Icon...">
120
+ <input class="uk-search-input" type="search" placeholder="Icon..." aria-label="Search">
121
121
  </form>
122
122
 
123
123
  <form class="uk-search uk-search-large">
124
124
  <span class="uk-search-icon-flip" uk-search-icon></span>
125
- <input class="uk-search-input" type="search" placeholder="Flip...">
125
+ <input class="uk-search-input" type="search" placeholder="Flip..." aria-label="Search">
126
126
  </form>
127
127
  </div>
128
128
 
129
129
  <div class="uk-margin" uk-margin>
130
130
  <form class="uk-search uk-search-large">
131
131
  <a href="#" uk-search-icon></a>
132
- <input class="uk-search-input" type="search" placeholder="Link...">
132
+ <input class="uk-search-input" type="search" placeholder="Link..." aria-label="Search">
133
133
  </form>
134
134
 
135
135
  <form class="uk-search uk-search-large">
136
136
  <button class="uk-search-icon-flip" uk-search-icon></button>
137
- <input class="uk-search-input" type="search" placeholder="Button...">
137
+ <input class="uk-search-input" type="search" placeholder="Button..." aria-label="Search">
138
138
  </form>
139
139
  </div>
140
140
 
@@ -173,7 +173,7 @@
173
173
 
174
174
  <div class="uk-navbar-item uk-width-expand">
175
175
  <form class="uk-search uk-search-navbar uk-width-1-1">
176
- <input class="uk-search-input" type="search" placeholder="Search" autofocus>
176
+ <input class="uk-search-input" type="search" placeholder="Search" aria-label="Search" autofocus>
177
177
  </form>
178
178
  </div>
179
179
 
@@ -206,7 +206,7 @@
206
206
  <a class="uk-navbar-toggle" uk-search-icon href="#"></a>
207
207
  <div uk-drop="mode: click; pos: left-center; offset: 0">
208
208
  <form class="uk-search uk-search-navbar uk-width-1-1">
209
- <input class="uk-search-input" type="search" placeholder="Search" autofocus>
209
+ <input class="uk-search-input" type="search" placeholder="Search" aria-label="Search" autofocus>
210
210
  </form>
211
211
  </div>
212
212
  </div>
@@ -240,7 +240,7 @@
240
240
  <div class="uk-grid-small uk-flex-middle" uk-grid>
241
241
  <div class="uk-width-expand">
242
242
  <form class="uk-search uk-search-navbar uk-width-1-1">
243
- <input class="uk-search-input" type="search" placeholder="Search" autofocus>
243
+ <input class="uk-search-input" type="search" placeholder="Search" aria-label="Search" autofocus>
244
244
  </form>
245
245
  </div>
246
246
  <div class="uk-width-auto">
@@ -280,7 +280,7 @@
280
280
  <div class="uk-grid-small uk-flex-middle" uk-grid>
281
281
  <div class="uk-width-expand">
282
282
  <form class="uk-search uk-search-navbar uk-width-1-1">
283
- <input class="uk-search-input" type="search" placeholder="Search" autofocus>
283
+ <input class="uk-search-input" type="search" placeholder="Search" aria-label="Search" autofocus>
284
284
  </form>
285
285
  </div>
286
286
  <div class="uk-width-auto">
@@ -320,7 +320,7 @@
320
320
  <div class="uk-grid-small uk-flex-middle" uk-grid>
321
321
  <div class="uk-width-expand">
322
322
  <form class="uk-search uk-search-navbar uk-width-1-1">
323
- <input class="uk-search-input" type="search" placeholder="Search" autofocus>
323
+ <input class="uk-search-input" type="search" placeholder="Search" aria-label="Search" autofocus>
324
324
  </form>
325
325
  </div>
326
326
  <div class="uk-width-auto">
@@ -364,7 +364,7 @@
364
364
  <div class="uk-modal-dialog uk-flex uk-flex-center uk-flex-middle" uk-height-viewport>
365
365
  <button class="uk-modal-close-full" type="button" uk-close></button>
366
366
  <form class="uk-search uk-search-large">
367
- <input class="uk-search-input uk-text-center" type="search" placeholder="Search" autofocus>
367
+ <input class="uk-search-input uk-text-center" type="search" placeholder="Search" aria-label="Search" autofocus>
368
368
  </form>
369
369
  </div>
370
370
  </div>
package/tests/slider.html CHANGED
@@ -29,15 +29,15 @@
29
29
  <h1>Slider</h1>
30
30
 
31
31
  <div class="uk-margin">
32
- <select id="js-center-switcher" class="uk-select uk-form-width-small">
32
+ <select id="js-center-switcher" class="uk-select uk-form-width-small" aria-label="Center switcher">
33
33
  <option value="0">Not centered</option>
34
34
  <option value="1">Center</option>
35
35
  </select>
36
- <select id="js-finite-switcher" class="uk-select uk-form-width-small">
36
+ <select id="js-finite-switcher" class="uk-select uk-form-width-small" aria-label="Finite switcher">
37
37
  <option value="0">Infinite</option>
38
38
  <option value="1">Finite</option>
39
39
  </select>
40
- <select id="js-sets-switcher" class="uk-select uk-form-width-small">
40
+ <select id="js-sets-switcher" class="uk-select uk-form-width-small" aria-label="Sets switcher">
41
41
  <option value="0">Single</option>
42
42
  <option value="1">Sets</option>
43
43
  </select>
package/tests/slideshow.html CHANGED
@@ -17,14 +17,14 @@
17
17
  <h2>Animations</h2>
18
18
 
19
19
  <div class="uk-margin">
20
- <select id="js-animation-switcher" class="uk-select uk-form-width-small">
20
+ <select id="js-animation-switcher" class="uk-select uk-form-width-small" aria-label="Animation switcher">
21
21
  <option value="slide">Slide</option>
22
22
  <option value="fade">Fade</option>
23
23
  <option value="scale">Scale</option>
24
24
  <option value="pull">Pull</option>
25
25
  <option value="push">Push</option>
26
26
  </select>
27
- <select id="js-finite-switcher" class="uk-select uk-form-width-small">
27
+ <select id="js-finite-switcher" class="uk-select uk-form-width-small" aria-label="Finite switcher">
28
28
  <option value="0">Infinite</option>
29
29
  <option value="1">Finite</option>
30
30
  </select>
package/tests/sticky.html CHANGED
@@ -296,7 +296,7 @@
296
296
  <h2>Overflow Flip</h2>
297
297
 
298
298
  <div class="uk-margin">
299
- <select id="js-height-switcher" class="uk-select uk-form-width-small">
299
+ <select id="js-height-switcher" class="uk-select uk-form-width-small" aria-label="Height switcher">
300
300
  <option value="uk-height-large">Smaller than Viewport</option>
301
301
  <option value="test-height">Lager than Viewport</option>
302
302
  </select>
package/tests/table.html CHANGED
@@ -15,7 +15,7 @@
15
15
  <h1>Table</h1>
16
16
 
17
17
  <div class="uk-margin">
18
- <select id="js-size-switcher" class="uk-select uk-form-width-small">
18
+ <select id="js-size-switcher" class="uk-select uk-form-width-small" aria-label="Size switcher">
19
19
  <option value="">Default</option>
20
20
  <option value="uk-table-small">Small</option>
21
21
  <option value="uk-table-large">Large</option>
@@ -207,7 +207,7 @@
207
207
  </thead>
208
208
  <tbody>
209
209
  <tr>
210
- <td><input class="uk-checkbox" type="checkbox"></td>
210
+ <td><input class="uk-checkbox" type="checkbox" aria-label="Checkbox"></td>
211
211
  <td><img class="uk-preserve-width uk-border-circle" src="images/avatar.jpg" width="40" height="40" alt=""></td>
212
212
  <td class="uk-table-link">
213
213
  <a class="uk-link-reset" href="">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</a>
@@ -217,7 +217,7 @@
217
217
  <td class="uk-text-nowrap">Lorem ipsum dolor</td>
218
218
  </tr>
219
219
  <tr>
220
- <td><input class="uk-checkbox" type="checkbox"></td>
220
+ <td><input class="uk-checkbox" type="checkbox" aria-label="Checkbox"></td>
221
221
  <td><img class="uk-preserve-width uk-border-circle" src="images/avatar.jpg" width="40" height="40" alt=""></td>
222
222
  <td class="uk-table-link">
223
223
  <a class="uk-link-reset" href="">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</a>
@@ -227,7 +227,7 @@
227
227
  <td class="uk-text-nowrap">Lorem ipsum dolor</td>
228
228
  </tr>
229
229
  <tr>
230
- <td><input class="uk-checkbox" type="checkbox"></td>
230
+ <td><input class="uk-checkbox" type="checkbox" aria-label="Checkbox"></td>
231
231
  <td><img class="uk-preserve-width uk-border-circle" src="images/avatar.jpg" width="40" height="40" alt=""></td>
232
232
  <td class="uk-table-link">
233
233
  <a class="uk-link-reset" href="">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</a>
@@ -237,7 +237,7 @@
237
237
  <td class="uk-text-nowrap">Lorem ipsum dolor</td>
238
238
  </tr>
239
239
  <tr>
240
- <td><input class="uk-checkbox" type="checkbox"></td>
240
+ <td><input class="uk-checkbox" type="checkbox" aria-label="Checkbox"></td>
241
241
  <td><img class="uk-preserve-width uk-border-circle" src="images/avatar.jpg" width="40" height="40" alt=""></td>
242
242
  <td class="uk-table-link">
243
243
  <a class="uk-link-reset" href="">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</a>
@@ -266,7 +266,7 @@
266
266
  </thead>
267
267
  <tbody>
268
268
  <tr>
269
- <td><input class="uk-checkbox" type="checkbox"></td>
269
+ <td><input class="uk-checkbox" type="checkbox" aria-label="Checkbox"></td>
270
270
  <td><img class="uk-preserve-width uk-border-circle" src="images/avatar.jpg" width="40" height="40" alt=""></td>
271
271
  <td class="uk-table-link">
272
272
  <a class="uk-link-reset" href="">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</a>
@@ -276,7 +276,7 @@
276
276
  <td class="uk-text-nowrap">Lorem ipsum dolor</td>
277
277
  </tr>
278
278
  <tr>
279
- <td><input class="uk-checkbox" type="checkbox"></td>
279
+ <td><input class="uk-checkbox" type="checkbox" aria-label="Checkbox"></td>
280
280
  <td><img class="uk-preserve-width uk-border-circle" src="images/avatar.jpg" width="40" height="40" alt=""></td>
281
281
  <td class="uk-table-link">
282
282
  <a class="uk-link-reset" href="">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</a>
@@ -286,7 +286,7 @@
286
286
  <td class="uk-text-nowrap">Lorem ipsum dolor</td>
287
287
  </tr>
288
288
  <tr>
289
- <td><input class="uk-checkbox" type="checkbox"></td>
289
+ <td><input class="uk-checkbox" type="checkbox" aria-label="Checkbox"></td>
290
290
  <td><img class="uk-preserve-width uk-border-circle" src="images/avatar.jpg" width="40" height="40" alt=""></td>
291
291
  <td class="uk-table-link">
292
292
  <a class="uk-link-reset" href="">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</a>
@@ -296,7 +296,7 @@
296
296
  <td class="uk-text-nowrap">Lorem ipsum dolor</td>
297
297
  </tr>
298
298
  <tr>
299
- <td><input class="uk-checkbox" type="checkbox"></td>
299
+ <td><input class="uk-checkbox" type="checkbox" aria-label="Checkbox"></td>
300
300
  <td><img class="uk-preserve-width uk-border-circle" src="images/avatar.jpg" width="40" height="40" alt=""></td>
301
301
  <td class="uk-table-link">
302
302
  <a class="uk-link-reset" href="">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</a>
package/tests/tooltip.html CHANGED
@@ -44,10 +44,10 @@
44
44
  <h2>Focused Form <span uk-icon="info" uk-tooltip="Hello World"></span></h2>
45
45
 
46
46
  <p>
47
- <input class="uk-input uk-form-width-medium" type="text" placeholder="Input" uk-tooltip="title: Hello World; pos: left">
47
+ <input class="uk-input uk-form-width-medium" type="text" placeholder="Input" aria-label="Focused form" uk-tooltip="title: Hello World; pos: left">
48
48
  </p>
49
49
  <p>
50
- <input class="uk-input uk-form-width-medium" type="text" placeholder="Input" uk-tooltip="title: Hello World; pos: right">
50
+ <input class="uk-input uk-form-width-medium" type="text" placeholder="Input" aria-label="Focused form" uk-tooltip="title: Hello World; pos: right">
51
51
  </p>
52
52
 
53
53
  <button type="button" class="uk-button uk-button-default" uk-tooltip="title: Hello World; delay: 500">Delay 500</button>
package/tests/utility.html CHANGED
@@ -423,20 +423,20 @@
423
423
  <div class="uk-flex-inline uk-margin uk-grid-small" uk-grid>
424
424
  <div>
425
425
  <p>Image</p>
426
- <a class="uk-logo" href="#">
426
+ <a class="uk-logo" href="#" aria-label="Back to Home">
427
427
  <img src="images/photo.jpg" width="200" height="133" alt="">
428
428
  </a>
429
429
  </div>
430
430
  <div>
431
431
  <p>+ Inverse Image</p>
432
- <a class="uk-logo" href="#">
432
+ <a class="uk-logo" href="#" aria-label="Back to Home">
433
433
  <img src="images/photo.jpg" width="200" height="133" alt="">
434
434
  <img class="uk-logo-inverse" src="images/dark.jpg" width="200" height="133" alt="">
435
435
  </a>
436
436
  </div>
437
437
  <div>
438
438
  <p>Picture</p>
439
- <a class="uk-logo" href="#">
439
+ <a class="uk-logo" href="#" aria-label="Back to Home">
440
440
  <picture>
441
441
  <img src="images/photo.jpg" width="200" height="133" alt="">
442
442
  </picture>
@@ -444,7 +444,7 @@
444
444
  </div>
445
445
  <div>
446
446
  <p>+ Inverse Picture</p>
447
- <a class="uk-logo" href="#">
447
+ <a class="uk-logo" href="#" aria-label="Back to Home">
448
448
  <picture>
449
449
  <img src="images/photo.jpg" width="200" height="133" alt="">
450
450
  </picture>