uikit 3.14.4-dev.e3664d0d2 → 3.14.4-dev.fea9fd466
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 +13 -0
- package/dist/css/uikit-core-rtl.css +108 -61
- package/dist/css/uikit-core-rtl.min.css +1 -1
- package/dist/css/uikit-core.css +108 -61
- package/dist/css/uikit-core.min.css +1 -1
- package/dist/css/uikit-rtl.css +108 -62
- package/dist/css/uikit-rtl.min.css +1 -1
- package/dist/css/uikit.css +108 -62
- 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 +7 -5
- package/dist/js/components/filter.min.js +1 -1
- package/dist/js/components/lightbox-panel.js +6 -14
- package/dist/js/components/lightbox-panel.min.js +1 -1
- package/dist/js/components/lightbox.js +6 -14
- 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 +4 -5
- package/dist/js/components/parallax.min.js +1 -1
- package/dist/js/components/slider-parallax.js +4 -5
- 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 +4 -5
- 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 +19 -19
- 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 +100 -61
- 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 +106 -65
- package/dist/js/uikit.min.js +1 -1
- package/package.json +1 -1
- package/src/images/{backgrounds/nav-parent-open.svg → components/nav-parent-icon-large.svg} +0 -0
- package/src/images/components/nav-parent-icon.svg +3 -0
- package/src/images/components/navbar-parent-icon.svg +3 -0
- package/src/js/components/filter.js +5 -3
- package/src/js/core/height-viewport.js +6 -2
- package/src/js/core/icon.js +16 -0
- package/src/js/core/index.js +2 -0
- package/src/js/core/leader.js +2 -2
- package/src/js/core/navbar.js +44 -15
- package/src/js/mixin/media.js +4 -5
- package/src/js/mixin/position.js +19 -11
- package/src/js/mixin/togglable.js +8 -17
- package/src/js/util/style.js +4 -13
- package/src/js/util/viewport.js +2 -4
- package/src/less/components/dropdown.less +14 -0
- package/src/less/components/leader.less +1 -1
- package/src/less/components/nav.less +7 -37
- package/src/less/components/navbar.less +101 -13
- package/src/less/components/utility.less +10 -2
- package/src/less/theme/nav.less +0 -8
- package/src/less/theme/navbar.less +4 -6
- package/src/scss/components/dropdown.scss +14 -0
- package/src/scss/components/leader.scss +1 -1
- package/src/scss/components/nav.scss +7 -26
- package/src/scss/components/navbar.scss +89 -13
- package/src/scss/components/utility.scss +8 -1
- package/src/scss/mixins-theme.scss +15 -18
- package/src/scss/mixins.scss +14 -14
- package/src/scss/theme/nav.scss +0 -8
- package/src/scss/theme/navbar.scss +3 -2
- package/src/scss/variables-theme.scss +17 -11
- package/src/scss/variables.scss +17 -10
- package/tests/drop.html +66 -16
- package/tests/dropdown.html +103 -16
- package/tests/index.html +3 -3
- package/tests/nav.html +20 -87
- package/tests/navbar.html +283 -62
- package/tests/offcanvas.html +8 -8
- package/tests/utility.html +19 -0
- package/src/images/backgrounds/nav-parent-close.svg +0 -3
package/tests/dropdown.html
CHANGED
|
@@ -14,6 +14,13 @@
|
|
|
14
14
|
width: 100%;
|
|
15
15
|
}
|
|
16
16
|
|
|
17
|
+
.scroll-container {
|
|
18
|
+
padding: 15px;
|
|
19
|
+
border: 1px dashed rgba(0,0,0,0.2);
|
|
20
|
+
overflow: auto;
|
|
21
|
+
-webkit-overflow-scrolling: touch;
|
|
22
|
+
}
|
|
23
|
+
|
|
17
24
|
</style>
|
|
18
25
|
</head>
|
|
19
26
|
|
|
@@ -23,6 +30,13 @@
|
|
|
23
30
|
|
|
24
31
|
<h1>Dropdown</h1>
|
|
25
32
|
|
|
33
|
+
<div class="uk-margin">
|
|
34
|
+
<select id="js-size-switcher" class="uk-select uk-form-width-small">
|
|
35
|
+
<option value="">Default</option>
|
|
36
|
+
<option value="uk-dropdown-large">Large</option>
|
|
37
|
+
</select>
|
|
38
|
+
</div>
|
|
39
|
+
|
|
26
40
|
<div uk-grid>
|
|
27
41
|
<div class="uk-width-1-4@m">
|
|
28
42
|
|
|
@@ -378,7 +392,7 @@
|
|
|
378
392
|
<div class="uk-margin" uk-margin>
|
|
379
393
|
|
|
380
394
|
<div class="uk-inline">
|
|
381
|
-
<button class="uk-button uk-button-default" type="button">Bottom
|
|
395
|
+
<button class="uk-button uk-button-default" type="button">Bottom Fade</button>
|
|
382
396
|
<div uk-dropdown="pos: bottom-stretch; animate-out: true">
|
|
383
397
|
<ul class="uk-nav uk-dropdown-nav">
|
|
384
398
|
<li class="uk-active"><a href="#">Active</a></li>
|
|
@@ -389,7 +403,7 @@
|
|
|
389
403
|
</div>
|
|
390
404
|
|
|
391
405
|
<div class="uk-inline">
|
|
392
|
-
<button class="uk-button uk-button-default" type="button">Bottom
|
|
406
|
+
<button class="uk-button uk-button-default" type="button">Bottom Slide</button>
|
|
393
407
|
<div uk-dropdown="pos: bottom-stretch; animate-out: true; animation: slide">
|
|
394
408
|
<ul class="uk-nav uk-dropdown-nav">
|
|
395
409
|
<li class="uk-active"><a href="#">Active</a></li>
|
|
@@ -400,7 +414,7 @@
|
|
|
400
414
|
</div>
|
|
401
415
|
|
|
402
416
|
<div class="uk-inline">
|
|
403
|
-
<button class="uk-button uk-button-default" type="button">Bottom
|
|
417
|
+
<button class="uk-button uk-button-default" type="button">Bottom Slide Left</button>
|
|
404
418
|
<div uk-dropdown="pos: bottom-stretch; animate-out: true; animation: slide-left">
|
|
405
419
|
<ul class="uk-nav uk-dropdown-nav">
|
|
406
420
|
<li class="uk-active"><a href="#">Active</a></li>
|
|
@@ -411,7 +425,7 @@
|
|
|
411
425
|
</div>
|
|
412
426
|
|
|
413
427
|
<div class="uk-inline">
|
|
414
|
-
<button class="uk-button uk-button-default" type="button">Bottom
|
|
428
|
+
<button class="uk-button uk-button-default" type="button">Bottom Slide Right</button>
|
|
415
429
|
<div uk-dropdown="pos: bottom-stretch; animate-out: true; animation: slide-right">
|
|
416
430
|
<ul class="uk-nav uk-dropdown-nav">
|
|
417
431
|
<li class="uk-active"><a href="#">Active</a></li>
|
|
@@ -426,7 +440,7 @@
|
|
|
426
440
|
<div class="uk-margin" uk-margin>
|
|
427
441
|
|
|
428
442
|
<div class="uk-inline">
|
|
429
|
-
<button class="uk-button uk-button-default" type="button">Top
|
|
443
|
+
<button class="uk-button uk-button-default" type="button">Top Fade</button>
|
|
430
444
|
<div uk-dropdown="pos: top-stretch; animate-out: true">
|
|
431
445
|
<ul class="uk-nav uk-dropdown-nav">
|
|
432
446
|
<li class="uk-active"><a href="#">Active</a></li>
|
|
@@ -437,7 +451,7 @@
|
|
|
437
451
|
</div>
|
|
438
452
|
|
|
439
453
|
<div class="uk-inline">
|
|
440
|
-
<button class="uk-button uk-button-default" type="button">Top
|
|
454
|
+
<button class="uk-button uk-button-default" type="button">Top Slide</button>
|
|
441
455
|
<div uk-dropdown="pos: top-stretch; animate-out: true; animation: slide">
|
|
442
456
|
<ul class="uk-nav uk-dropdown-nav">
|
|
443
457
|
<li class="uk-active"><a href="#">Active</a></li>
|
|
@@ -448,7 +462,7 @@
|
|
|
448
462
|
</div>
|
|
449
463
|
|
|
450
464
|
<div class="uk-inline">
|
|
451
|
-
<button class="uk-button uk-button-default" type="button">Top
|
|
465
|
+
<button class="uk-button uk-button-default" type="button">Top Slide Left</button>
|
|
452
466
|
<div uk-dropdown="pos: top-stretch; animate-out: true; animation: slide-left">
|
|
453
467
|
<ul class="uk-nav uk-dropdown-nav">
|
|
454
468
|
<li class="uk-active"><a href="#">Active</a></li>
|
|
@@ -459,7 +473,7 @@
|
|
|
459
473
|
</div>
|
|
460
474
|
|
|
461
475
|
<div class="uk-inline">
|
|
462
|
-
<button class="uk-button uk-button-default" type="button">Top
|
|
476
|
+
<button class="uk-button uk-button-default" type="button">Top Slide Right</button>
|
|
463
477
|
<div uk-dropdown="pos: top-stretch; animate-out: true; animation: slide-right">
|
|
464
478
|
<ul class="uk-nav uk-dropdown-nav">
|
|
465
479
|
<li class="uk-active"><a href="#">Active</a></li>
|
|
@@ -474,7 +488,7 @@
|
|
|
474
488
|
<div class="uk-margin" uk-margin>
|
|
475
489
|
|
|
476
490
|
<div class="uk-inline">
|
|
477
|
-
<button class="uk-button uk-button-default" type="button">Left
|
|
491
|
+
<button class="uk-button uk-button-default" type="button">Left Fade</button>
|
|
478
492
|
<div uk-dropdown="pos: left-stretch; animate-out: true">
|
|
479
493
|
<ul class="uk-nav uk-dropdown-nav">
|
|
480
494
|
<li class="uk-active"><a href="#">Active</a></li>
|
|
@@ -485,7 +499,7 @@
|
|
|
485
499
|
</div>
|
|
486
500
|
|
|
487
501
|
<div class="uk-inline">
|
|
488
|
-
<button class="uk-button uk-button-default" type="button">Left
|
|
502
|
+
<button class="uk-button uk-button-default" type="button">Left Slide</button>
|
|
489
503
|
<div uk-dropdown="pos: left-stretch; animate-out: true; animation: slide">
|
|
490
504
|
<ul class="uk-nav uk-dropdown-nav">
|
|
491
505
|
<li class="uk-active"><a href="#">Active</a></li>
|
|
@@ -496,7 +510,7 @@
|
|
|
496
510
|
</div>
|
|
497
511
|
|
|
498
512
|
<div class="uk-inline">
|
|
499
|
-
<button class="uk-button uk-button-default" type="button">Left
|
|
513
|
+
<button class="uk-button uk-button-default" type="button">Left Slide Left</button>
|
|
500
514
|
<div uk-dropdown="pos: left-stretch; animate-out: true; animation: slide-left">
|
|
501
515
|
<ul class="uk-nav uk-dropdown-nav">
|
|
502
516
|
<li class="uk-active"><a href="#">Active</a></li>
|
|
@@ -507,7 +521,7 @@
|
|
|
507
521
|
</div>
|
|
508
522
|
|
|
509
523
|
<div class="uk-inline">
|
|
510
|
-
<button class="uk-button uk-button-default" type="button">Left
|
|
524
|
+
<button class="uk-button uk-button-default" type="button">Left Slide Right</button>
|
|
511
525
|
<div uk-dropdown="pos: left-stretch; animate-out: true; animation: slide-right">
|
|
512
526
|
<ul class="uk-nav uk-dropdown-nav">
|
|
513
527
|
<li class="uk-active"><a href="#">Active</a></li>
|
|
@@ -522,7 +536,7 @@
|
|
|
522
536
|
<div class="uk-margin" uk-margin>
|
|
523
537
|
|
|
524
538
|
<div class="uk-inline">
|
|
525
|
-
<button class="uk-button uk-button-default" type="button">Right
|
|
539
|
+
<button class="uk-button uk-button-default" type="button">Right Fade</button>
|
|
526
540
|
<div uk-dropdown="pos: right-stretch; animate-out: true">
|
|
527
541
|
<ul class="uk-nav uk-dropdown-nav">
|
|
528
542
|
<li class="uk-active"><a href="#">Active</a></li>
|
|
@@ -533,7 +547,7 @@
|
|
|
533
547
|
</div>
|
|
534
548
|
|
|
535
549
|
<div class="uk-inline">
|
|
536
|
-
<button class="uk-button uk-button-default" type="button">Right
|
|
550
|
+
<button class="uk-button uk-button-default" type="button">Right Slide</button>
|
|
537
551
|
<div uk-dropdown="pos: right-stretch; animate-out: true; animation: slide">
|
|
538
552
|
<ul class="uk-nav uk-dropdown-nav">
|
|
539
553
|
<li class="uk-active"><a href="#">Active</a></li>
|
|
@@ -544,7 +558,7 @@
|
|
|
544
558
|
</div>
|
|
545
559
|
|
|
546
560
|
<div class="uk-inline">
|
|
547
|
-
<button class="uk-button uk-button-default" type="button">Right
|
|
561
|
+
<button class="uk-button uk-button-default" type="button">Right Slide Left</button>
|
|
548
562
|
<div uk-dropdown="pos: right-stretch; animate-out: true; animation: slide-left">
|
|
549
563
|
<ul class="uk-nav uk-dropdown-nav">
|
|
550
564
|
<li class="uk-active"><a href="#">Active</a></li>
|
|
@@ -555,7 +569,7 @@
|
|
|
555
569
|
</div>
|
|
556
570
|
|
|
557
571
|
<div class="uk-inline">
|
|
558
|
-
<button class="uk-button uk-button-default" type="button">Right
|
|
572
|
+
<button class="uk-button uk-button-default" type="button">Right Slide Right</button>
|
|
559
573
|
<div uk-dropdown="pos: right-stretch; animate-out: true; animation: slide-right">
|
|
560
574
|
<ul class="uk-nav uk-dropdown-nav">
|
|
561
575
|
<li class="uk-active"><a href="#">Active</a></li>
|
|
@@ -567,6 +581,65 @@
|
|
|
567
581
|
|
|
568
582
|
</div>
|
|
569
583
|
|
|
584
|
+
<div class="uk-child-width-1-4@m" uk-grid>
|
|
585
|
+
<div>
|
|
586
|
+
<div class="scroll-container uk-height-large uk-resize-vertical">
|
|
587
|
+
|
|
588
|
+
<div class="uk-text-center"><button class="uk-button uk-button-default" type="button">Bottom Fade</button></div>
|
|
589
|
+
<div uk-dropdown="pos: bottom-stretch; animate-out: true">
|
|
590
|
+
<ul class="uk-nav uk-dropdown-nav">
|
|
591
|
+
<li class="uk-active"><a href="#">Active</a></li>
|
|
592
|
+
<li><a href="#">Item</a></li>
|
|
593
|
+
<li><a href="#">Item</a></li>
|
|
594
|
+
</ul>
|
|
595
|
+
</div>
|
|
596
|
+
|
|
597
|
+
</div>
|
|
598
|
+
</div>
|
|
599
|
+
<div>
|
|
600
|
+
<div class="scroll-container uk-height-large uk-resize-vertical">
|
|
601
|
+
|
|
602
|
+
<div class="uk-text-center"><button class="uk-button uk-button-default" type="button">Bottom Slide</button></div>
|
|
603
|
+
<div uk-dropdown="pos: bottom-stretch; animate-out: true; animation: slide">
|
|
604
|
+
<ul class="uk-nav uk-dropdown-nav">
|
|
605
|
+
<li class="uk-active"><a href="#">Active</a></li>
|
|
606
|
+
<li><a href="#">Item</a></li>
|
|
607
|
+
<li><a href="#">Item</a></li>
|
|
608
|
+
</ul>
|
|
609
|
+
</div>
|
|
610
|
+
|
|
611
|
+
</div>
|
|
612
|
+
</div>
|
|
613
|
+
<div>
|
|
614
|
+
<div class="scroll-container uk-height-large uk-resize-vertical">
|
|
615
|
+
|
|
616
|
+
<div class="uk-text-center"><button class="uk-button uk-button-default" type="button">Bottom Slide Left</button></div>
|
|
617
|
+
<div uk-dropdown="pos: bottom-stretch; animate-out: true; animation: slide-left">
|
|
618
|
+
<ul class="uk-nav uk-dropdown-nav">
|
|
619
|
+
<li class="uk-active"><a href="#">Active</a></li>
|
|
620
|
+
<li><a href="#">Item</a></li>
|
|
621
|
+
<li><a href="#">Item</a></li>
|
|
622
|
+
</ul>
|
|
623
|
+
</div>
|
|
624
|
+
|
|
625
|
+
</div>
|
|
626
|
+
</div>
|
|
627
|
+
<div>
|
|
628
|
+
<div class="scroll-container uk-height-large uk-resize-vertical">
|
|
629
|
+
|
|
630
|
+
<div class="uk-text-center"><button class="uk-button uk-button-default" type="button">Bottom Slide Right</button></div>
|
|
631
|
+
<div uk-dropdown="pos: bottom-stretch; animate-out: true; animation: slide-right">
|
|
632
|
+
<ul class="uk-nav uk-dropdown-nav">
|
|
633
|
+
<li class="uk-active"><a href="#">Active</a></li>
|
|
634
|
+
<li><a href="#">Item</a></li>
|
|
635
|
+
<li><a href="#">Item</a></li>
|
|
636
|
+
</ul>
|
|
637
|
+
</div>
|
|
638
|
+
|
|
639
|
+
</div>
|
|
640
|
+
</div>
|
|
641
|
+
</div>
|
|
642
|
+
|
|
570
643
|
<h2>JavaScript Options</h2>
|
|
571
644
|
|
|
572
645
|
<div class="uk-overflow-auto">
|
|
@@ -658,5 +731,19 @@
|
|
|
658
731
|
|
|
659
732
|
</div>
|
|
660
733
|
|
|
734
|
+
<script>
|
|
735
|
+
|
|
736
|
+
var options = UIkit.util.$$('#js-size-switcher option').map(function (option) { return option.value; });
|
|
737
|
+
|
|
738
|
+
UIkit.util.on('#js-size-switcher', 'change', function () {
|
|
739
|
+
var value = this.value;
|
|
740
|
+
UIkit.util.$$('.uk-dropdown').forEach(function (table) {
|
|
741
|
+
UIkit.util.removeClass(table, options);
|
|
742
|
+
UIkit.util.addClass(table, value);
|
|
743
|
+
});
|
|
744
|
+
});
|
|
745
|
+
|
|
746
|
+
</script>
|
|
747
|
+
|
|
661
748
|
</body>
|
|
662
749
|
</html>
|
package/tests/index.html
CHANGED
|
@@ -20,7 +20,7 @@
|
|
|
20
20
|
<ul class="uk-navbar-nav">
|
|
21
21
|
<li class="uk-active"><a href="#">Active</a></li>
|
|
22
22
|
<li>
|
|
23
|
-
<a href="#">Parent
|
|
23
|
+
<a href="#">Parent <span uk-navbar-parent-icon></span></a>
|
|
24
24
|
<div class="uk-navbar-dropdown">
|
|
25
25
|
<ul class="uk-nav uk-navbar-dropdown-nav">
|
|
26
26
|
<li class="uk-active"><a href="#">Active</a></li>
|
|
@@ -240,7 +240,7 @@
|
|
|
240
240
|
<ul class="uk-nav-default uk-nav-parent-icon uk-margin-medium" uk-nav>
|
|
241
241
|
<li class="uk-active"><a href="#">Active</a></li>
|
|
242
242
|
<li class="uk-parent">
|
|
243
|
-
<a href="#">Parent
|
|
243
|
+
<a href="#">Parent <span uk-nav-parent-icon></span></a>
|
|
244
244
|
<ul class="uk-nav-sub">
|
|
245
245
|
<li><a href="#">Sub item</a></li>
|
|
246
246
|
<li><a href="#">Sub item</a>
|
|
@@ -252,7 +252,7 @@
|
|
|
252
252
|
</ul>
|
|
253
253
|
</li>
|
|
254
254
|
<li class="uk-parent">
|
|
255
|
-
<a href="#">Parent
|
|
255
|
+
<a href="#">Parent <span uk-nav-parent-icon></span></a>
|
|
256
256
|
<ul class="uk-nav-sub">
|
|
257
257
|
<li><a href="#">Sub item</a></li>
|
|
258
258
|
<li><a href="#">Sub item</a></li>
|
package/tests/nav.html
CHANGED
|
@@ -61,7 +61,7 @@
|
|
|
61
61
|
<ul class="uk-nav-default uk-nav-parent-icon" uk-nav>
|
|
62
62
|
<li class="uk-active"><a href="#">Active</a></li>
|
|
63
63
|
<li class="uk-parent">
|
|
64
|
-
<a href="#">Parent
|
|
64
|
+
<a href="#">Parent <span uk-nav-parent-icon></span></a>
|
|
65
65
|
<ul class="uk-nav-sub">
|
|
66
66
|
<li><a href="#">Sub item</a></li>
|
|
67
67
|
<li><a href="#">Sub item</a>
|
|
@@ -73,7 +73,7 @@
|
|
|
73
73
|
</ul>
|
|
74
74
|
</li>
|
|
75
75
|
<li class="uk-parent">
|
|
76
|
-
<a href="#">Parent
|
|
76
|
+
<a href="#">Parent <span uk-nav-parent-icon></span></a>
|
|
77
77
|
<ul class="uk-nav-sub">
|
|
78
78
|
<li><a href="#">Sub item</a></li>
|
|
79
79
|
<li><a href="#">Sub item</a></li>
|
|
@@ -89,11 +89,12 @@
|
|
|
89
89
|
</div>
|
|
90
90
|
<div>
|
|
91
91
|
|
|
92
|
-
<h2>Multiple</h2>
|
|
93
|
-
|
|
92
|
+
<h2 class="uk-text-center">Center + Multiple</h2>
|
|
93
|
+
|
|
94
|
+
<ul class="uk-nav-default uk-nav-center uk-nav-parent-icon" uk-nav="multiple: true">
|
|
94
95
|
<li class="uk-active"><a href="#">Active</a></li>
|
|
95
96
|
<li class="uk-parent">
|
|
96
|
-
<a href="#">Parent
|
|
97
|
+
<a href="#">Parent <span uk-nav-parent-icon></span></a>
|
|
97
98
|
<ul class="uk-nav-sub">
|
|
98
99
|
<li><a href="#">Sub item</a></li>
|
|
99
100
|
<li><a href="#">Sub item</a>
|
|
@@ -105,7 +106,7 @@
|
|
|
105
106
|
</ul>
|
|
106
107
|
</li>
|
|
107
108
|
<li class="uk-parent">
|
|
108
|
-
<a href="#">Parent
|
|
109
|
+
<a href="#">Parent <span uk-nav-parent-icon></span></a>
|
|
109
110
|
<ul class="uk-nav-sub">
|
|
110
111
|
<li><a href="#">Sub item</a></li>
|
|
111
112
|
<li><a href="#">Sub item</a></li>
|
|
@@ -121,34 +122,13 @@
|
|
|
121
122
|
</div>
|
|
122
123
|
<div>
|
|
123
124
|
|
|
124
|
-
<h2
|
|
125
|
+
<h2>Subtitles</h2>
|
|
125
126
|
|
|
126
|
-
<ul class="uk-nav
|
|
127
|
-
<li class="uk-active"><a href="#">Active
|
|
128
|
-
<li class="uk-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
<li><a href="#">Sub item</a></li>
|
|
132
|
-
<li><a href="#">Sub item</a>
|
|
133
|
-
<ul>
|
|
134
|
-
<li><a href="#">Sub item</a></li>
|
|
135
|
-
<li><a href="#">Sub item</a></li>
|
|
136
|
-
</ul>
|
|
137
|
-
</li>
|
|
138
|
-
</ul>
|
|
139
|
-
</li>
|
|
140
|
-
<li class="uk-parent">
|
|
141
|
-
<a href="#">Parent</a>
|
|
142
|
-
<ul class="uk-nav-sub">
|
|
143
|
-
<li><a href="#">Sub item</a></li>
|
|
144
|
-
<li><a href="#">Sub item</a></li>
|
|
145
|
-
</ul>
|
|
146
|
-
</li>
|
|
147
|
-
<li class="uk-nav-header">Header</li>
|
|
148
|
-
<li><a href="#"><span class="uk-margin-small-right" uk-icon="icon: table"></span> Item</a></li>
|
|
149
|
-
<li><a href="#"><span class="uk-margin-small-right" uk-icon="icon: thumbnails"></span> Item</a></li>
|
|
150
|
-
<li class="uk-nav-divider"></li>
|
|
151
|
-
<li><a href="#"><span class="uk-margin-small-right" uk-icon="icon: trash"></span> Item</a></li>
|
|
127
|
+
<ul class="uk-nav uk-nav-default">
|
|
128
|
+
<li class="uk-active"><a href="#"><div>Active<div class="uk-nav-subtitle">Subtitle lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do.</div></div></a></li>
|
|
129
|
+
<li><a href="#"><div>Item<div class="uk-nav-subtitle">Subtitle lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do.</div></div></a></li>
|
|
130
|
+
<li><a href="#"><div>Item<div class="uk-nav-subtitle">Subtitle lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do.</div></div></a></li>
|
|
131
|
+
<li><a href="#"><div>Item<div class="uk-nav-subtitle">Subtitle lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do.</div></div></a></li>
|
|
152
132
|
</ul>
|
|
153
133
|
|
|
154
134
|
</div>
|
|
@@ -194,7 +174,7 @@
|
|
|
194
174
|
<ul class="uk-nav-primary uk-nav-parent-icon" uk-nav>
|
|
195
175
|
<li class="uk-active"><a href="#">Active</a></li>
|
|
196
176
|
<li class="uk-parent">
|
|
197
|
-
<a href="#">Parent
|
|
177
|
+
<a href="#">Parent <span uk-nav-parent-icon></span></a>
|
|
198
178
|
<ul class="uk-nav-sub">
|
|
199
179
|
<li><a href="#">Sub item</a></li>
|
|
200
180
|
<li><a href="#">Sub item</a>
|
|
@@ -206,7 +186,7 @@
|
|
|
206
186
|
</ul>
|
|
207
187
|
</li>
|
|
208
188
|
<li class="uk-parent">
|
|
209
|
-
<a href="#">Parent
|
|
189
|
+
<a href="#">Parent <span uk-nav-parent-icon></span></a>
|
|
210
190
|
<ul class="uk-nav-sub">
|
|
211
191
|
<li><a href="#">Sub item</a></li>
|
|
212
192
|
<li><a href="#">Sub item</a></li>
|
|
@@ -222,44 +202,12 @@
|
|
|
222
202
|
</div>
|
|
223
203
|
<div>
|
|
224
204
|
|
|
225
|
-
<h2>Multiple</h2>
|
|
226
|
-
<ul class="uk-nav-primary uk-nav-parent-icon" uk-nav="multiple: true">
|
|
227
|
-
<li class="uk-active"><a href="#">Active</a></li>
|
|
228
|
-
<li class="uk-parent">
|
|
229
|
-
<a href="#">Parent</a>
|
|
230
|
-
<ul class="uk-nav-sub">
|
|
231
|
-
<li><a href="#">Sub item</a></li>
|
|
232
|
-
<li><a href="#">Sub item</a>
|
|
233
|
-
<ul>
|
|
234
|
-
<li><a href="#">Sub item</a></li>
|
|
235
|
-
<li><a href="#">Sub item</a></li>
|
|
236
|
-
</ul>
|
|
237
|
-
</li>
|
|
238
|
-
</ul>
|
|
239
|
-
</li>
|
|
240
|
-
<li class="uk-parent">
|
|
241
|
-
<a href="#">Parent</a>
|
|
242
|
-
<ul class="uk-nav-sub">
|
|
243
|
-
<li><a href="#">Sub item</a></li>
|
|
244
|
-
<li><a href="#">Sub item</a></li>
|
|
245
|
-
</ul>
|
|
246
|
-
</li>
|
|
247
|
-
<li class="uk-nav-header">Header</li>
|
|
248
|
-
<li><a href="#"><span class="uk-margin-small-right" uk-icon="icon: table"></span> Item</a></li>
|
|
249
|
-
<li><a href="#"><span class="uk-margin-small-right" uk-icon="icon: thumbnails"></span> Item</a></li>
|
|
250
|
-
<li class="uk-nav-divider"></li>
|
|
251
|
-
<li><a href="#"><span class="uk-margin-small-right" uk-icon="icon: trash"></span> Item</a></li>
|
|
252
|
-
</ul>
|
|
253
|
-
|
|
254
|
-
</div>
|
|
255
|
-
<div>
|
|
256
|
-
|
|
257
|
-
<h2 class="uk-text-center">Center</h2>
|
|
205
|
+
<h2 class="uk-text-center">Center + Multiple</h2>
|
|
258
206
|
|
|
259
|
-
<ul class="uk-nav-primary uk-nav-center uk-nav-parent-icon" uk-nav>
|
|
207
|
+
<ul class="uk-nav-primary uk-nav-center uk-nav-parent-icon" uk-nav="multiple: true">
|
|
260
208
|
<li class="uk-active"><a href="#">Active</a></li>
|
|
261
209
|
<li class="uk-parent">
|
|
262
|
-
<a href="#">Parent
|
|
210
|
+
<a href="#">Parent <span uk-nav-parent-icon></span></a>
|
|
263
211
|
<ul class="uk-nav-sub">
|
|
264
212
|
<li><a href="#">Sub item</a></li>
|
|
265
213
|
<li><a href="#">Sub item</a>
|
|
@@ -271,7 +219,7 @@
|
|
|
271
219
|
</ul>
|
|
272
220
|
</li>
|
|
273
221
|
<li class="uk-parent">
|
|
274
|
-
<a href="#">Parent
|
|
222
|
+
<a href="#">Parent <span uk-nav-parent-icon></span></a>
|
|
275
223
|
<ul class="uk-nav-sub">
|
|
276
224
|
<li><a href="#">Sub item</a></li>
|
|
277
225
|
<li><a href="#">Sub item</a></li>
|
|
@@ -285,24 +233,9 @@
|
|
|
285
233
|
</ul>
|
|
286
234
|
|
|
287
235
|
</div>
|
|
288
|
-
</div>
|
|
289
|
-
|
|
290
|
-
<div class="uk-child-width-1-4@m" uk-grid>
|
|
291
236
|
<div>
|
|
292
237
|
|
|
293
|
-
<h2>
|
|
294
|
-
|
|
295
|
-
<ul class="uk-nav uk-nav-default">
|
|
296
|
-
<li class="uk-active"><a href="#"><div>Active<div class="uk-nav-subtitle">Subtitle lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do.</div></div></a></li>
|
|
297
|
-
<li><a href="#"><div>Item<div class="uk-nav-subtitle">Subtitle lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do.</div></div></a></li>
|
|
298
|
-
<li><a href="#"><div>Item<div class="uk-nav-subtitle">Subtitle lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do.</div></div></a></li>
|
|
299
|
-
<li><a href="#"><div>Item<div class="uk-nav-subtitle">Subtitle lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do.</div></div></a></li>
|
|
300
|
-
</ul>
|
|
301
|
-
|
|
302
|
-
</div>
|
|
303
|
-
<div>
|
|
304
|
-
|
|
305
|
-
<h2>Primary</h2>
|
|
238
|
+
<h2>Subtitles</h2>
|
|
306
239
|
|
|
307
240
|
<ul class="uk-nav uk-nav-primary">
|
|
308
241
|
<li class="uk-active"><a href="#"><div>Active<div class="uk-nav-subtitle">Subtitle lorem ipsum dolor sit amet, consectetur.</div></div></a></li>
|