uikit 3.15.10 → 3.15.11-dev.6033fe67f
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 +10 -0
- package/dist/css/uikit-core-rtl.css +1 -1
- 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 +1 -1
- package/dist/css/uikit-rtl.min.css +1 -1
- package/dist/css/uikit.css +1 -1
- 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 +5 -4
- package/dist/js/uikit-core.min.js +2 -2
- package/dist/js/uikit-icons.js +2 -1
- package/dist/js/uikit-icons.min.js +1 -1
- package/dist/js/uikit.js +5 -4
- package/dist/js/uikit.min.js +2 -2
- package/package.json +1 -1
- package/src/images/icons/crosshairs.svg +7 -0
- package/src/js/core/scrollspy.js +3 -2
- package/tests/breadcrumb.html +25 -19
- package/tests/comment.html +9 -9
- package/tests/drop.html +2 -2
- package/tests/dropbar.html +1 -1
- package/tests/dropdown.html +1 -1
- package/tests/filter.html +1 -1
- package/tests/form.html +40 -40
- package/tests/icon.html +4 -0
- package/tests/index.html +22 -19
- package/tests/js/index.js +3 -3
- package/tests/lightbox.html +1 -1
- package/tests/list.html +1 -1
- package/tests/nav.html +1 -1
- package/tests/navbar.html +3 -3
- package/tests/search.html +21 -21
- package/tests/slider.html +3 -3
- package/tests/slideshow.html +2 -2
- package/tests/sticky.html +1 -1
- package/tests/table.html +9 -9
- package/tests/tooltip.html +2 -2
- package/tests/utility.html +4 -4
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.15.
|
|
5
|
+
"version": "3.15.11-dev.6033fe67f",
|
|
6
6
|
"main": "dist/js/uikit.js",
|
|
7
7
|
"style": "dist/css/uikit.css",
|
|
8
8
|
"sideEffects": [
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<circle fill="none" stroke="#000" cx="10" cy="10" r="7.5" />
|
|
3
|
+
<line fill="none" stroke="#000" x1="10" x2="10" y2="8" />
|
|
4
|
+
<line fill="none" stroke="#000" x1="10" y1="12" x2="10" y2="20" />
|
|
5
|
+
<line fill="none" stroke="#000" y1="10" x2="8" y2="10" />
|
|
6
|
+
<line fill="none" stroke="#000" x1="12" y1="10" x2="20" y2="10" />
|
|
7
|
+
</svg>
|
package/src/js/core/scrollspy.js
CHANGED
|
@@ -48,7 +48,8 @@ export default {
|
|
|
48
48
|
|
|
49
49
|
watch(elements, prev) {
|
|
50
50
|
if (this.hidden) {
|
|
51
|
-
|
|
51
|
+
// use `opacity:0` instead of `visibility:hidden` to make content focusable with keyboard
|
|
52
|
+
css(filter(elements, `:not(.${this.inViewClass})`), 'opacity', 0);
|
|
52
53
|
}
|
|
53
54
|
|
|
54
55
|
if (!isEqual(elements, prev)) {
|
|
@@ -134,7 +135,7 @@ export default {
|
|
|
134
135
|
|
|
135
136
|
state.off?.();
|
|
136
137
|
|
|
137
|
-
css(el, '
|
|
138
|
+
css(el, 'opacity', !inview && this.hidden ? 0 : '');
|
|
138
139
|
|
|
139
140
|
toggleClass(el, this.inViewClass, inview);
|
|
140
141
|
toggleClass(el, state.cls);
|
package/tests/breadcrumb.html
CHANGED
|
@@ -14,25 +14,31 @@
|
|
|
14
14
|
|
|
15
15
|
<h1>Breadcrumb</h1>
|
|
16
16
|
|
|
17
|
-
<
|
|
18
|
-
<
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
<
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
17
|
+
<nav aria-label="Breadcrumb">
|
|
18
|
+
<ul class="uk-breadcrumb uk-width-xlarge">
|
|
19
|
+
<li><a href="#">Home</a></li>
|
|
20
|
+
<li><a href="#">Linked Category</a></li>
|
|
21
|
+
<li class="uk-disabled"><a>Disabled Category</a></li>
|
|
22
|
+
<li><span>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</span></li>
|
|
23
|
+
</ul>
|
|
24
|
+
</nav>
|
|
25
|
+
|
|
26
|
+
<nav aria-label="Breadcrumb">
|
|
27
|
+
<ul class="uk-breadcrumb uk-width-xlarge">
|
|
28
|
+
<li><a href="#">Home</a></li>
|
|
29
|
+
<li><a href="#">Linked Category</a></li>
|
|
30
|
+
<li class="uk-disabled"><a>Disabled Category</a></li>
|
|
31
|
+
<li class="uk-disabled"><a>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</a></li>
|
|
32
|
+
</ul>
|
|
33
|
+
</nav>
|
|
34
|
+
|
|
35
|
+
<nav aria-label="Breadcrumb">
|
|
36
|
+
<ul class="uk-breadcrumb">
|
|
37
|
+
<li><a href="#">Home</a></li>
|
|
38
|
+
<li><a href="#">Linked Category</a></li>
|
|
39
|
+
<li><a href="#">Linked Category</a></li>
|
|
40
|
+
</ul>
|
|
41
|
+
</nav>
|
|
36
42
|
|
|
37
43
|
</div>
|
|
38
44
|
|
package/tests/comment.html
CHANGED
|
@@ -18,7 +18,7 @@
|
|
|
18
18
|
|
|
19
19
|
<ul class="uk-comment-list">
|
|
20
20
|
<li>
|
|
21
|
-
<article class="uk-comment">
|
|
21
|
+
<article class="uk-comment" role="comment">
|
|
22
22
|
<header class="uk-comment-header">
|
|
23
23
|
<div class="uk-grid-medium uk-flex-middle" uk-grid>
|
|
24
24
|
<div class="uk-width-auto">
|
|
@@ -39,7 +39,7 @@
|
|
|
39
39
|
</article>
|
|
40
40
|
</li>
|
|
41
41
|
<li>
|
|
42
|
-
<article class="uk-comment uk-visible-toggle" tabindex="-1">
|
|
42
|
+
<article class="uk-comment uk-visible-toggle" tabindex="-1" role="comment">
|
|
43
43
|
<header class="uk-comment-header uk-position-relative">
|
|
44
44
|
<div class="uk-grid-medium uk-flex-middle" uk-grid>
|
|
45
45
|
<div class="uk-width-auto">
|
|
@@ -58,7 +58,7 @@
|
|
|
58
58
|
</article>
|
|
59
59
|
<ul>
|
|
60
60
|
<li>
|
|
61
|
-
<article class="uk-comment uk-visible-toggle" tabindex="-1">
|
|
61
|
+
<article class="uk-comment uk-visible-toggle" tabindex="-1" role="comment">
|
|
62
62
|
<header class="uk-comment-header uk-position-relative">
|
|
63
63
|
<div class="uk-grid-medium uk-flex-middle" uk-grid>
|
|
64
64
|
<div class="uk-width-auto">
|
|
@@ -77,7 +77,7 @@
|
|
|
77
77
|
</article>
|
|
78
78
|
<ul>
|
|
79
79
|
<li>
|
|
80
|
-
<article class="uk-comment uk-comment-primary uk-visible-toggle" tabindex="-1">
|
|
80
|
+
<article class="uk-comment uk-comment-primary uk-visible-toggle" tabindex="-1" role="comment">
|
|
81
81
|
<header class="uk-comment-header uk-position-relative">
|
|
82
82
|
<div class="uk-grid-medium uk-flex-middle" uk-grid>
|
|
83
83
|
<div class="uk-width-auto">
|
|
@@ -96,7 +96,7 @@
|
|
|
96
96
|
</article>
|
|
97
97
|
<ul>
|
|
98
98
|
<li>
|
|
99
|
-
<article class="uk-comment uk-visible-toggle" tabindex="-1">
|
|
99
|
+
<article class="uk-comment uk-visible-toggle" tabindex="-1" role="comment">
|
|
100
100
|
<header class="uk-comment-header uk-position-relative">
|
|
101
101
|
<div class="uk-grid-medium uk-flex-middle" uk-grid>
|
|
102
102
|
<div class="uk-width-auto">
|
|
@@ -119,7 +119,7 @@
|
|
|
119
119
|
</ul>
|
|
120
120
|
</li>
|
|
121
121
|
<li>
|
|
122
|
-
<article class="uk-comment uk-visible-toggle" tabindex="-1">
|
|
122
|
+
<article class="uk-comment uk-visible-toggle" tabindex="-1" role="comment">
|
|
123
123
|
<header class="uk-comment-header uk-position-relative">
|
|
124
124
|
<div class="uk-grid-medium uk-flex-middle" uk-grid>
|
|
125
125
|
<div class="uk-width-auto">
|
|
@@ -141,7 +141,7 @@
|
|
|
141
141
|
</ul>
|
|
142
142
|
</li>
|
|
143
143
|
<li>
|
|
144
|
-
<article class="uk-comment uk-visible-toggle" tabindex="-1">
|
|
144
|
+
<article class="uk-comment uk-visible-toggle" tabindex="-1" role="comment">
|
|
145
145
|
<header class="uk-comment-header uk-position-relative">
|
|
146
146
|
<div class="uk-grid-medium uk-flex-middle" uk-grid>
|
|
147
147
|
<div class="uk-width-auto">
|
|
@@ -160,7 +160,7 @@
|
|
|
160
160
|
</article>
|
|
161
161
|
</li>
|
|
162
162
|
<li>
|
|
163
|
-
<article class="uk-comment uk-comment-primary uk-visible-toggle" tabindex="-1">
|
|
163
|
+
<article class="uk-comment uk-comment-primary uk-visible-toggle" tabindex="-1" role="comment">
|
|
164
164
|
<header class="uk-comment-header uk-position-relative">
|
|
165
165
|
<div class="uk-grid-medium uk-flex-middle" uk-grid>
|
|
166
166
|
<div class="uk-width-auto">
|
|
@@ -179,7 +179,7 @@
|
|
|
179
179
|
</article>
|
|
180
180
|
<ul>
|
|
181
181
|
<li>
|
|
182
|
-
<article class="uk-comment uk-visible-toggle" tabindex="-1">
|
|
182
|
+
<article class="uk-comment uk-visible-toggle" tabindex="-1" role="comment">
|
|
183
183
|
<header class="uk-comment-header uk-position-relative">
|
|
184
184
|
<div class="uk-grid-medium uk-flex-middle" uk-grid>
|
|
185
185
|
<div class="uk-width-auto">
|
package/tests/drop.html
CHANGED
|
@@ -27,7 +27,7 @@
|
|
|
27
27
|
<h1>Drop</h1>
|
|
28
28
|
|
|
29
29
|
<div class="uk-margin uk-form-stacked">
|
|
30
|
-
<select id="js-style-switcher" class="uk-select uk-form-width-small">
|
|
30
|
+
<select id="js-style-switcher" class="uk-select uk-form-width-small" aria-label="Style switcher">
|
|
31
31
|
<option value="uk-dropdown">Dropdown</option>
|
|
32
32
|
<option value="uk-dropbar">Dropbar</option>
|
|
33
33
|
<option value="uk-card uk-card-body uk-card-default">Card Default</option>
|
|
@@ -557,7 +557,7 @@
|
|
|
557
557
|
<h2>Shift and Flip</h2>
|
|
558
558
|
|
|
559
559
|
<div class="uk-margin">
|
|
560
|
-
<select id="js-boundary-overflow-switcher" class="uk-select uk-form-width-small">
|
|
560
|
+
<select id="js-boundary-overflow-switcher" class="uk-select uk-form-width-small" aria-label="Boundary overflow switcher">
|
|
561
561
|
<option value="">Resize</option>
|
|
562
562
|
<option value="test-boundary-overflow">Scroll</option>
|
|
563
563
|
</select>
|
package/tests/dropbar.html
CHANGED
|
@@ -30,7 +30,7 @@
|
|
|
30
30
|
<h1>Dropbar</h1>
|
|
31
31
|
|
|
32
32
|
<div class="uk-margin">
|
|
33
|
-
<select id="js-size-switcher" class="uk-select uk-form-width-small">
|
|
33
|
+
<select id="js-size-switcher" class="uk-select uk-form-width-small" aria-label="Size switcher">
|
|
34
34
|
<option value="">Default</option>
|
|
35
35
|
<option value="uk-dropbar-large">Large</option>
|
|
36
36
|
</select>
|
package/tests/dropdown.html
CHANGED
|
@@ -31,7 +31,7 @@
|
|
|
31
31
|
<h1>Dropdown</h1>
|
|
32
32
|
|
|
33
33
|
<div class="uk-margin">
|
|
34
|
-
<select id="js-size-switcher" class="uk-select uk-form-width-small">
|
|
34
|
+
<select id="js-size-switcher" class="uk-select uk-form-width-small" aria-label="Size switcher">
|
|
35
35
|
<option value="">Default</option>
|
|
36
36
|
<option value="uk-dropdown-large">Large</option>
|
|
37
37
|
</select>
|
package/tests/filter.html
CHANGED
|
@@ -42,7 +42,7 @@
|
|
|
42
42
|
<h1>Filter</h1>
|
|
43
43
|
|
|
44
44
|
<div class="uk-margin">
|
|
45
|
-
<select id="js-animation-switcher" class="uk-select uk-form-width-small">
|
|
45
|
+
<select id="js-animation-switcher" class="uk-select uk-form-width-small" aria-label="Animation switcher">
|
|
46
46
|
<option value="slide">Slide</option>
|
|
47
47
|
<option value="fade">Fade</option>
|
|
48
48
|
<option value="delayed-fade">Delayed Fade</option>
|
package/tests/form.html
CHANGED
|
@@ -112,9 +112,9 @@
|
|
|
112
112
|
<form>
|
|
113
113
|
|
|
114
114
|
<div class="uk-margin" uk-margin>
|
|
115
|
-
<textarea class="uk-textarea uk-form-width-small uk-form-large" rows="2" placeholder="Some text..."></textarea>
|
|
116
|
-
<input class="uk-input uk-form-width-small uk-form-large" type="text" placeholder="Some text...">
|
|
117
|
-
<select class="uk-select uk-form-width-small uk-form-large">
|
|
115
|
+
<textarea class="uk-textarea uk-form-width-small uk-form-large" rows="2" placeholder="Some text..." aria-label="Large"></textarea>
|
|
116
|
+
<input class="uk-input uk-form-width-small uk-form-large" type="text" placeholder="Some text..." aria-label="Large">
|
|
117
|
+
<select class="uk-select uk-form-width-small uk-form-large" aria-label="Large">
|
|
118
118
|
<option>Option 01</option>
|
|
119
119
|
<option>Option 02</option>
|
|
120
120
|
</select>
|
|
@@ -123,9 +123,9 @@
|
|
|
123
123
|
</div>
|
|
124
124
|
|
|
125
125
|
<div class="uk-margin" uk-margin>
|
|
126
|
-
<textarea class="uk-textarea uk-form-width-small" rows="2" placeholder="Some text..."></textarea>
|
|
127
|
-
<input class="uk-input uk-form-width-small" type="text" placeholder="Some text...">
|
|
128
|
-
<select class="uk-select uk-form-width-small">
|
|
126
|
+
<textarea class="uk-textarea uk-form-width-small" rows="2" placeholder="Some text..." aria-label="Default"></textarea>
|
|
127
|
+
<input class="uk-input uk-form-width-small" type="text" placeholder="Some text..." aria-label="Default">
|
|
128
|
+
<select class="uk-select uk-form-width-small" aria-label="Default">
|
|
129
129
|
<option>Option 01</option>
|
|
130
130
|
<option>Option 02</option>
|
|
131
131
|
</select>
|
|
@@ -134,9 +134,9 @@
|
|
|
134
134
|
</div>
|
|
135
135
|
|
|
136
136
|
<div class="uk-margin" uk-margin>
|
|
137
|
-
<textarea class="uk-textarea uk-form-width-small uk-form-small" rows="2" placeholder="Some text..."></textarea>
|
|
138
|
-
<input class="uk-input uk-form-width-small uk-form-small" type="text" placeholder="Some text...">
|
|
139
|
-
<select class="uk-select uk-form-width-small uk-form-small">
|
|
137
|
+
<textarea class="uk-textarea uk-form-width-small uk-form-small" rows="2" placeholder="Some text..." aria-label="Small"></textarea>
|
|
138
|
+
<input class="uk-input uk-form-width-small uk-form-small" type="text" placeholder="Some text..." aria-label="Small">
|
|
139
|
+
<select class="uk-select uk-form-width-small uk-form-small" aria-label="Small">
|
|
140
140
|
<option>Option 01</option>
|
|
141
141
|
<option>Option 02</option>
|
|
142
142
|
</select>
|
|
@@ -151,40 +151,40 @@
|
|
|
151
151
|
<form>
|
|
152
152
|
|
|
153
153
|
<div class="uk-margin" uk-margin>
|
|
154
|
-
<input class="uk-input uk-form-width-large" type="text" placeholder="form-width-large">
|
|
154
|
+
<input class="uk-input uk-form-width-large" type="text" placeholder="form-width-large" arial-label="Width large">
|
|
155
155
|
</div>
|
|
156
156
|
|
|
157
157
|
<div class="uk-margin" uk-margin>
|
|
158
|
-
<select class="uk-select uk-form-width-large">
|
|
158
|
+
<select class="uk-select uk-form-width-large" arial-label="Width large">
|
|
159
159
|
<option>form-width-large</option>
|
|
160
160
|
</select>
|
|
161
161
|
</div>
|
|
162
162
|
|
|
163
163
|
<div class="uk-margin" uk-margin>
|
|
164
|
-
<textarea class="uk-textarea uk-form-width-large" rows="1" placeholder="form-width-large"></textarea>
|
|
164
|
+
<textarea class="uk-textarea uk-form-width-large" rows="1" placeholder="form-width-large" arial-label="Width large"></textarea>
|
|
165
165
|
</div>
|
|
166
166
|
|
|
167
167
|
<div class="uk-margin" uk-margin>
|
|
168
|
-
<input class="uk-input uk-form-width-medium" type="text" placeholder="form-width-medium">
|
|
169
|
-
<input class="uk-input uk-form-width-small" type="text" placeholder="form-width-small">
|
|
170
|
-
<input class="uk-input uk-form-width-xsmall" type="text" placeholder="form-width-xsmall">
|
|
168
|
+
<input class="uk-input uk-form-width-medium" type="text" placeholder="form-width-medium" arial-label="Width medium">
|
|
169
|
+
<input class="uk-input uk-form-width-small" type="text" placeholder="form-width-small" arial-label="Width small">
|
|
170
|
+
<input class="uk-input uk-form-width-xsmall" type="text" placeholder="form-width-xsmall" arial-label="Width xsmall">
|
|
171
171
|
</div>
|
|
172
172
|
|
|
173
173
|
<div class="uk-margin" uk-margin>
|
|
174
|
-
<select class="uk-select uk-form-width-medium">
|
|
174
|
+
<select class="uk-select uk-form-width-medium" arial-label="Width medium">
|
|
175
175
|
<option>form-width-medium</option>
|
|
176
176
|
</select>
|
|
177
|
-
<select class="uk-select uk-form-width-small">
|
|
177
|
+
<select class="uk-select uk-form-width-small" arial-label="Width small">
|
|
178
178
|
<option>form-width-small</option>
|
|
179
179
|
</select>
|
|
180
|
-
<select class="uk-select uk-form-width-xsmall">
|
|
180
|
+
<select class="uk-select uk-form-width-xsmall" arial-label="Width xsmall">
|
|
181
181
|
<option>form-width-xsmall</option>
|
|
182
182
|
</select>
|
|
183
183
|
</div>
|
|
184
184
|
|
|
185
185
|
<div class="uk-margin" uk-margin>
|
|
186
|
-
<textarea class="uk-textarea uk-form-width-medium" rows="1" placeholder="form-width-medium"></textarea>
|
|
187
|
-
<textarea class="uk-textarea uk-form-width-small" rows="1" placeholder="form-width-small"></textarea>
|
|
186
|
+
<textarea class="uk-textarea uk-form-width-medium" rows="1" placeholder="form-width-medium" arial-label="Width medium"></textarea>
|
|
187
|
+
<textarea class="uk-textarea uk-form-width-small" rows="1" placeholder="form-width-small" arial-label="Width small"></textarea>
|
|
188
188
|
</div>
|
|
189
189
|
|
|
190
190
|
</form>
|
|
@@ -200,7 +200,7 @@
|
|
|
200
200
|
|
|
201
201
|
<div class="uk-inline">
|
|
202
202
|
<span class="uk-form-icon" uk-icon="icon: user"></span>
|
|
203
|
-
<input class="uk-input uk-form-width-medium" type="text">
|
|
203
|
+
<input class="uk-input uk-form-width-medium" type="text" arial-label="Not clickable icon">
|
|
204
204
|
</div>
|
|
205
205
|
|
|
206
206
|
</div>
|
|
@@ -209,7 +209,7 @@
|
|
|
209
209
|
|
|
210
210
|
<div class="uk-inline">
|
|
211
211
|
<span class="uk-form-icon uk-form-icon-flip" uk-icon="icon: lock"></span>
|
|
212
|
-
<input class="uk-input uk-form-width-medium" type="text">
|
|
212
|
+
<input class="uk-input uk-form-width-medium" type="text" arial-label="Not clickable icon">
|
|
213
213
|
</div>
|
|
214
214
|
|
|
215
215
|
</div>
|
|
@@ -223,7 +223,7 @@
|
|
|
223
223
|
|
|
224
224
|
<div class="uk-inline">
|
|
225
225
|
<a class="uk-form-icon" href="#" uk-icon="icon: pencil"></a>
|
|
226
|
-
<input class="uk-input" type="text">
|
|
226
|
+
<input class="uk-input" type="text" arial-label="Clickable icon">
|
|
227
227
|
</div>
|
|
228
228
|
|
|
229
229
|
</div>
|
|
@@ -232,7 +232,7 @@
|
|
|
232
232
|
|
|
233
233
|
<div class="uk-inline">
|
|
234
234
|
<a class="uk-form-icon uk-form-icon-flip" href="#" uk-icon="icon: link"></a>
|
|
235
|
-
<input class="uk-input" type="text">
|
|
235
|
+
<input class="uk-input" type="text" arial-label="Clickable icon">
|
|
236
236
|
</div>
|
|
237
237
|
|
|
238
238
|
</div>
|
|
@@ -242,20 +242,20 @@
|
|
|
242
242
|
|
|
243
243
|
<h2>Select</h2>
|
|
244
244
|
|
|
245
|
-
<select class="uk-select uk-form-width-large">
|
|
245
|
+
<select class="uk-select uk-form-width-large" arial-label="Select">
|
|
246
246
|
<option>Option 01</option>
|
|
247
247
|
<option>Option 02</option>
|
|
248
248
|
</select>
|
|
249
249
|
|
|
250
250
|
<p class="uk-margin-small">
|
|
251
|
-
<select class="uk-select uk-form-width-large" disabled>
|
|
251
|
+
<select class="uk-select uk-form-width-large" arial-label="Select disabled" disabled>
|
|
252
252
|
<option>Option 01</option>
|
|
253
253
|
<option>Option 02</option>
|
|
254
254
|
</select>
|
|
255
255
|
</p>
|
|
256
256
|
|
|
257
257
|
<p class="uk-margin-small">
|
|
258
|
-
<select class="uk-select uk-form-width-large" multiple="multiple">
|
|
258
|
+
<select class="uk-select uk-form-width-large" arial-label="Select multiple" multiple="multiple">
|
|
259
259
|
<option>Option 01</option>
|
|
260
260
|
<option>Option 02</option>
|
|
261
261
|
<option>Option 03</option>
|
|
@@ -329,7 +329,7 @@
|
|
|
329
329
|
<div class="uk-margin">
|
|
330
330
|
|
|
331
331
|
<div uk-form-custom>
|
|
332
|
-
<input type="file">
|
|
332
|
+
<input type="file" aria-label="Custom controls">
|
|
333
333
|
<button class="uk-button uk-button-default" type="button" tabindex="-1">Select</button>
|
|
334
334
|
</div>
|
|
335
335
|
|
|
@@ -338,7 +338,7 @@
|
|
|
338
338
|
<div class="uk-margin">
|
|
339
339
|
<span class="uk-text-middle">Here is a text</span>
|
|
340
340
|
<div uk-form-custom>
|
|
341
|
-
<input type="file">
|
|
341
|
+
<input type="file" aria-label="Custom controls">
|
|
342
342
|
<span class="uk-link">upload</span>
|
|
343
343
|
</div>
|
|
344
344
|
</div>
|
|
@@ -346,7 +346,7 @@
|
|
|
346
346
|
<div class="uk-margin" uk-margin>
|
|
347
347
|
|
|
348
348
|
<div uk-form-custom="target: true">
|
|
349
|
-
<input type="file">
|
|
349
|
+
<input type="file" aria-label="Custom controls">
|
|
350
350
|
<input class="uk-input uk-form-width-medium" type="text" placeholder="Select file" disabled>
|
|
351
351
|
</div>
|
|
352
352
|
|
|
@@ -362,7 +362,7 @@
|
|
|
362
362
|
<div class="uk-margin">
|
|
363
363
|
|
|
364
364
|
<div uk-form-custom="target: true">
|
|
365
|
-
<select>
|
|
365
|
+
<select aria-label="Custom controls">
|
|
366
366
|
<option value="1">Option 01</option>
|
|
367
367
|
<option value="2">Option 02</option>
|
|
368
368
|
<option value="3">Option 03</option>
|
|
@@ -376,7 +376,7 @@
|
|
|
376
376
|
<div class="uk-margin">
|
|
377
377
|
|
|
378
378
|
<div uk-form-custom="target: > * > span:last-child">
|
|
379
|
-
<select>
|
|
379
|
+
<select aria-label="Custom controls">
|
|
380
380
|
<option value="1">Option 01</option>
|
|
381
381
|
<option value="2">Option 02</option>
|
|
382
382
|
<option value="3">Option 03</option>
|
|
@@ -393,7 +393,7 @@
|
|
|
393
393
|
<div class="uk-margin">
|
|
394
394
|
|
|
395
395
|
<div uk-form-custom="target: > * > span:first-child">
|
|
396
|
-
<select>
|
|
396
|
+
<select aria-label="Custom controls">
|
|
397
397
|
<option value="">Please select...</option>
|
|
398
398
|
<option value="1">Option 01</option>
|
|
399
399
|
<option value="2">Option 02</option>
|
|
@@ -411,7 +411,7 @@
|
|
|
411
411
|
<div class="uk-margin">
|
|
412
412
|
|
|
413
413
|
<div uk-form-custom="target: true">
|
|
414
|
-
<select>
|
|
414
|
+
<select aria-label="Custom controls">
|
|
415
415
|
<option value="">Please select...</option>
|
|
416
416
|
<option value="1">Option 01</option>
|
|
417
417
|
<option value="2">Option 02</option>
|
|
@@ -437,28 +437,28 @@
|
|
|
437
437
|
<span class="uk-form-label">States and styles</span>
|
|
438
438
|
<div class="uk-margin-small uk-grid-small uk-child-width-1-2" uk-grid>
|
|
439
439
|
<div>
|
|
440
|
-
<input class="uk-input" type="text" placeholder=":disabled" disabled>
|
|
440
|
+
<input class="uk-input" type="text" placeholder=":disabled" aria-label="disabled" disabled>
|
|
441
441
|
</div>
|
|
442
442
|
<div>
|
|
443
|
-
<input class="uk-input" type="text" placeholder=":disabled" value="Some text..." disabled>
|
|
443
|
+
<input class="uk-input" type="text" placeholder=":disabled" aria-label="disabled" value="Some text..." disabled>
|
|
444
444
|
</div>
|
|
445
445
|
</div>
|
|
446
446
|
<div class="uk-margin-small uk-grid-small" uk-grid>
|
|
447
447
|
<div class="uk-width-expand">
|
|
448
|
-
<input class="uk-input" type="text" placeholder=":focus" autofocus required>
|
|
448
|
+
<input class="uk-input" type="text" placeholder=":focus" aria-label="focus" autofocus required>
|
|
449
449
|
</div>
|
|
450
450
|
<div class="uk-width-auto">
|
|
451
451
|
<button class="uk-button uk-button-default uk-width-1-1">Required</button>
|
|
452
452
|
</div>
|
|
453
453
|
</div>
|
|
454
454
|
<div class="uk-margin-small">
|
|
455
|
-
<input class="uk-input uk-form-danger" type="text" placeholder="form-danger" value="form-danger">
|
|
455
|
+
<input class="uk-input uk-form-danger" type="text" placeholder="form-danger" aria-label="form-danger" value="form-danger">
|
|
456
456
|
</div>
|
|
457
457
|
<div class="uk-margin-small">
|
|
458
|
-
<input class="uk-input uk-form-success" type="text" placeholder="form-success" value="form-success">
|
|
458
|
+
<input class="uk-input uk-form-success" type="text" placeholder="form-success" aria-label="form-success" value="form-success">
|
|
459
459
|
</div>
|
|
460
460
|
<div class="uk-margin-small">
|
|
461
|
-
<input class="uk-input uk-form-blank" type="text" placeholder="form-blank">
|
|
461
|
+
<input class="uk-input uk-form-blank" type="text" placeholder="form-blank" aria-label="form-blank">
|
|
462
462
|
</div>
|
|
463
463
|
</div>
|
|
464
464
|
|
package/tests/icon.html
CHANGED
|
@@ -82,6 +82,7 @@
|
|
|
82
82
|
<li><span class="uk-margin-small-right" uk-icon="icon: clock"></span> clock</li>
|
|
83
83
|
<li><span class="uk-margin-small-right" uk-icon="icon: history"></span> history</li>
|
|
84
84
|
<li><span class="uk-margin-small-right" uk-icon="icon: future"></span> future</li>
|
|
85
|
+
<li><span class="uk-margin-small-right" uk-icon="icon: crosshairs"></span> crosshairs</li>
|
|
85
86
|
<li><span class="uk-margin-small-right" uk-icon="icon: pencil"></span> pencil</li>
|
|
86
87
|
<li><span class="uk-margin-small-right" uk-icon="icon: trash"></span> trash</li>
|
|
87
88
|
<li><span class="uk-margin-small-right" uk-icon="icon: move"></span> move</li>
|
|
@@ -261,6 +262,7 @@
|
|
|
261
262
|
<li><a class="uk-icon-link" href="#" uk-icon="icon: clock"></a></li>
|
|
262
263
|
<li><a class="uk-icon-link" href="#" uk-icon="icon: history"></a></li>
|
|
263
264
|
<li><a class="uk-icon-link" href="#" uk-icon="icon: future"></a></li>
|
|
265
|
+
<li><a class="uk-icon-link" href="#" uk-icon="icon: crosshairs"></a></li>
|
|
264
266
|
<li><a class="uk-icon-link" href="#" uk-icon="icon: pencil"></a></li>
|
|
265
267
|
<li><a class="uk-icon-link" href="#" uk-icon="icon: link"></a></li>
|
|
266
268
|
<li><a class="uk-icon-link" href="#" uk-icon="icon: trash"></a></li>
|
|
@@ -424,6 +426,7 @@
|
|
|
424
426
|
<li><a class="uk-icon-button" href="#" uk-icon="icon: clock"></a></li>
|
|
425
427
|
<li><a class="uk-icon-button" href="#" uk-icon="icon: history"></a></li>
|
|
426
428
|
<li><a class="uk-icon-button" href="#" uk-icon="icon: future"></a></li>
|
|
429
|
+
<li><a class="uk-icon-button" href="#" uk-icon="icon: crosshairs"></a></li>
|
|
427
430
|
<li><a class="uk-icon-button" href="#" uk-icon="icon: pencil"></a></li>
|
|
428
431
|
<li><a class="uk-icon-button" href="#" uk-icon="icon: link"></a></li>
|
|
429
432
|
<li><a class="uk-icon-button" href="#" uk-icon="icon: trash"></a></li>
|
|
@@ -585,6 +588,7 @@
|
|
|
585
588
|
<li><span uk-icon="ratio: 2; icon: clock"></span></li>
|
|
586
589
|
<li><span uk-icon="ratio: 2; icon: history"></span></li>
|
|
587
590
|
<li><span uk-icon="ratio: 2; icon: future"></span></li>
|
|
591
|
+
<li><span uk-icon="ratio: 2; icon: crosshairs"></span></li>
|
|
588
592
|
<li><span uk-icon="ratio: 2; icon: pencil"></span></li>
|
|
589
593
|
<li><span uk-icon="ratio: 2; icon: link"></span></li>
|
|
590
594
|
<li><span uk-icon="ratio: 2; icon: trash"></span></li>
|
package/tests/index.html
CHANGED
|
@@ -79,12 +79,14 @@
|
|
|
79
79
|
<div uk-grid>
|
|
80
80
|
<div class="uk-width-2-3@m">
|
|
81
81
|
|
|
82
|
-
<
|
|
83
|
-
<
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
82
|
+
<nav aria-label="Breadcrumb">
|
|
83
|
+
<ul class="uk-breadcrumb">
|
|
84
|
+
<li><a href="#">Home</a></li>
|
|
85
|
+
<li><a href="#">Blog</a></li>
|
|
86
|
+
<li class="uk-disabled"><a>Category</a></li>
|
|
87
|
+
<li><span>Post</span></li>
|
|
88
|
+
</ul>
|
|
89
|
+
</nav>
|
|
88
90
|
|
|
89
91
|
<article class="uk-article">
|
|
90
92
|
|
|
@@ -211,7 +213,7 @@
|
|
|
211
213
|
|
|
212
214
|
<ul class="uk-comment-list uk-margin-medium">
|
|
213
215
|
<li>
|
|
214
|
-
<article class="uk-comment uk-visible-toggle" tabindex="-1">
|
|
216
|
+
<article class="uk-comment uk-visible-toggle" tabindex="-1" role="comment">
|
|
215
217
|
<header class="uk-comment-header uk-position-relative">
|
|
216
218
|
<div class="uk-grid-medium uk-flex-middle" uk-grid>
|
|
217
219
|
<div class="uk-width-auto">
|
|
@@ -253,7 +255,7 @@
|
|
|
253
255
|
<div class="uk-margin-medium-bottom">
|
|
254
256
|
<form class="uk-search uk-search-default uk-width-1-1">
|
|
255
257
|
<span uk-search-icon></span>
|
|
256
|
-
<input class="uk-search-input" type="search" placeholder="Search">
|
|
258
|
+
<input class="uk-search-input" type="search" placeholder="Search" aria-label="Search">
|
|
257
259
|
</form>
|
|
258
260
|
</div>
|
|
259
261
|
|
|
@@ -396,19 +398,19 @@
|
|
|
396
398
|
<form class="uk-form-stacked">
|
|
397
399
|
|
|
398
400
|
<div class="uk-margin-small">
|
|
399
|
-
<label class="uk-form-label">Text</label>
|
|
400
|
-
<input class="uk-input" type="text" placeholder="Some text...">
|
|
401
|
+
<label class="uk-form-label" for="form-input-text">Text</label>
|
|
402
|
+
<input id="form-input-text" class="uk-input" type="text" placeholder="Some text...">
|
|
401
403
|
</div>
|
|
402
404
|
|
|
403
405
|
<div class="uk-margin-small">
|
|
404
|
-
<select class="uk-select">
|
|
406
|
+
<select class="uk-select" aria-label="Select">
|
|
405
407
|
<option>Option 01</option>
|
|
406
408
|
<option>Option 02</option>
|
|
407
409
|
</select>
|
|
408
410
|
</div>
|
|
409
411
|
|
|
410
412
|
<div class="uk-margin-small">
|
|
411
|
-
|
|
413
|
+
<textarea class="uk-textarea" rows="2" placeholder="Some text..." aria-label="Textarea"></textarea>
|
|
412
414
|
</div>
|
|
413
415
|
|
|
414
416
|
<div class="uk-grid-small uk-child-width-auto" uk-grid>
|
|
@@ -421,22 +423,23 @@
|
|
|
421
423
|
</div>
|
|
422
424
|
|
|
423
425
|
<div class="uk-margin-small">
|
|
424
|
-
<input class="uk-range" type="range" value="2" min="0" max="10" step="0.1">
|
|
426
|
+
<input class="uk-range" type="range" value="2" min="0" max="10" step="0.1" aria-label="Range">
|
|
425
427
|
</div>
|
|
426
428
|
|
|
427
429
|
<div class="uk-margin-small">
|
|
428
|
-
<label class="uk-form-label">States</label>
|
|
429
|
-
<input class="uk-input" type="text" placeholder=":disabled" disabled>
|
|
430
|
+
<label class="uk-form-label" for="form-input-states">States</label>
|
|
431
|
+
<input id="form-input-states" class="uk-input" type="text" placeholder=":disabled" disabled>
|
|
432
|
+
|
|
430
433
|
</div>
|
|
431
434
|
|
|
432
435
|
<div class="uk-margin-small">
|
|
433
|
-
<input class="uk-input uk-form-danger" type="text" placeholder="form-danger" value="form-danger">
|
|
436
|
+
<input class="uk-input uk-form-danger" type="text" placeholder="form-danger" aria-label="form-danger" value="form-danger">
|
|
434
437
|
</div>
|
|
435
438
|
<div class="uk-margin-small">
|
|
436
|
-
<input class="uk-input uk-form-success" type="text" placeholder="form-success" value="form-success">
|
|
439
|
+
<input class="uk-input uk-form-success" type="text" placeholder="form-success" aria-label="form-success" value="form-success">
|
|
437
440
|
</div>
|
|
438
441
|
<div class="uk-margin-small">
|
|
439
|
-
<input class="uk-input uk-form-blank" type="text" placeholder="form-blank">
|
|
442
|
+
<input class="uk-input uk-form-blank" type="text" placeholder="form-blank" aria-label="form-blank">
|
|
440
443
|
</div>
|
|
441
444
|
|
|
442
445
|
</form>
|
|
@@ -799,7 +802,7 @@
|
|
|
799
802
|
|
|
800
803
|
<div class="uk-margin">
|
|
801
804
|
<form class="uk-search uk-search-large">
|
|
802
|
-
<input class="uk-search-input uk-text-center" type="search" placeholder="Search">
|
|
805
|
+
<input class="uk-search-input uk-text-center" type="search" placeholder="Search" aria-label="Search">
|
|
803
806
|
</form>
|
|
804
807
|
</div>
|
|
805
808
|
|