RubyGems - jekyll-uikit - Versions diffs - 0.1.7 → 0.2.0 - Mend

jekyll-uikit 0.1.7 → 0.2.0

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 (640) hide show

data/assets/node_modules/uikit/tests/cover.html DELETED

@@ -1,183 +0,0 @@
-<!DOCTYPE html>
-<html lang="en-gb" dir="ltr">
-    <head>
-        <meta charset="utf-8">
-        <meta name="viewport" content="width=device-width, initial-scale=1">
-        <title>Cover - UIkit tests</title>
-        <script src="../dist/js/uikit.js"></script>
-        <script src="js/test.js"></script>
-        <style type="text/css">
-            .test-height { height: 300px; }
-        </style>
-    </head>
-    <body>
-        <div class="uk-container">
-            <h1>Cover</h1>
-            <h2>Fixed Height</h2>
-            <div class="uk-child-width-1-2@m" uk-grid>
-                <div>
-                    <h3>Image</h3>
-                    <div class="test-height uk-cover-container uk-light">
-                        <img src="images/photo.jpg" alt="" uk-cover>
-                        <div class="uk-position-cover uk-flex uk-flex-center uk-flex-middle">
-                            <h1>Heading</h1>
-                        </div>
-                    </div>
-                </div>
-                <div>
-                    <h3>Video</h3>
-                    <div class="test-height uk-cover-container uk-light">
-                        <video autoplay loop muted playsinline uk-cover>
-                            <source src="//www.quirksmode.org/html5/videos/big_buck_bunny.mp4" type="video/mp4">
-                            <source src="//www.quirksmode.org/html5/videos/big_buck_bunny.ogv" type="video/ogg">
-                        </video>
-                        <div class="uk-position-cover uk-flex uk-flex-center uk-flex-middle">
-                            <h1>Heading</h1>
-                        </div>
-                    </div>
-                </div>
-                <div>
-                    <h3>Iframe (YouTube)</h3>
-                    <div class="test-height uk-cover-container uk-light">
-                        <iframe src="//www.youtube.com/embed/YE7VzlLtp-4?autoplay=1&amp;controls=0&amp;showinfo=0&amp;rel=0&amp;loop=1&amp;modestbranding=1&amp;wmode=transparent&amp;playsinline=1" width="560" height="315" frameborder="0" allowfullscreen uk-cover></iframe>
-                        <div class="uk-position-cover uk-flex uk-flex-center uk-flex-middle">
-                            <h1>Heading</h1>
-                        </div>
-                    </div>
-                </div>
-                <div>
-                    <h3>Iframe (Vimeo)</h3>
-                    <div class="test-height uk-cover-container uk-light">
-                        <iframe src="//player.vimeo.com/video/1084537?title=0&amp;byline=0&amp;autoplay=1&amp;loop=1&amp;setVolume=0" width="500" height="281" frameborder="0" allowfullscreen uk-cover></iframe>
-                        <div class="uk-position-cover uk-flex uk-flex-center uk-flex-middle">
-                            <h1>Heading</h1>
-                        </div>
-                    </div>
-                </div>
-            </div>
-            <h2>Responsive Height</h2>
-            <div class="uk-child-width-1-2@m" uk-grid>
-                <div>
-                    <h3>Video (JS)</h3>
-                    <div class="uk-cover-container uk-light">
-                        <canvas width="600" height="400"></canvas>
-                        <video autoplay loop muted playsinline uk-cover>
-                            <source src="//www.quirksmode.org/html5/videos/big_buck_bunny.mp4?test2" type="video/mp4">
-                            <source src="//www.quirksmode.org/html5/videos/big_buck_bunny.ogv?test2" type="video/ogg">
-                        </video>
-                        <div class="uk-position-cover uk-flex uk-flex-center uk-flex-middle">
-                            <h1>Heading</h1>
-                        </div>
-                    </div>
-                </div>
-                <div>
-                    <h3>Iframe (YouTube)</h3>
-                    <div class="uk-cover-container uk-light">
-                        <canvas width="600" height="400"></canvas>
-                        <iframe src="//www.youtube.com/embed/YE7VzlLtp-4?autoplay=1&amp;controls=0&amp;showinfo=0&amp;rel=0&amp;loop=1&amp;modestbranding=1&amp;wmode=transparent&amp;playsinline=1" width="560" height="315" frameborder="0" allowfullscreen uk-cover></iframe>
-                        <div class="uk-position-cover uk-flex uk-flex-center uk-flex-middle">
-                            <h1>Heading</h1>
-                        </div>
-                    </div>
-                </div>
-            </div>
-            <h2>Viewport Height</h2>
-            <div class="uk-child-width-1-2@m" uk-grid>
-                <div>
-                    <h3>Video (JS)</h3>
-                    <div class="uk-cover-container uk-light" uk-height-viewport>
-                        <video autoplay loop muted playsinline uk-cover>
-                            <source src="//www.quirksmode.org/html5/videos/big_buck_bunny.mp4?test3" type="video/mp4">
-                            <source src="//www.quirksmode.org/html5/videos/big_buck_bunny.ogv?test3" type="video/ogg">
-                        </video>
-                        <div class="uk-position-cover uk-flex uk-flex-center uk-flex-middle">
-                            <h1>Heading</h1>
-                        </div>
-                    </div>
-                </div>
-                <div>
-                    <h3>Iframe (YouTube)</h3>
-                    <div class="uk-cover-container uk-light" uk-height-viewport>
-                        <iframe src="//www.youtube.com/embed/YE7VzlLtp-4?autoplay=1&amp;controls=0&amp;showinfo=0&amp;rel=0&amp;loop=1&amp;modestbranding=1&amp;wmode=transparent&amp;playsinline=1" width="560" height="315" frameborder="0" allowfullscreen uk-cover></iframe>
-                        <div class="uk-position-cover uk-flex uk-flex-center uk-flex-middle">
-                            <h1>Heading</h1>
-                        </div>
-                    </div>
-                </div>
-            </div>
-            <h2>Javascript Options</h2>
-            <div class="uk-overflow-auto">
-                <table class="uk-table uk-table-striped">
-                    <thead>
-                        <tr>
-                            <th>Option</th>
-                            <th>Value</th>
-                            <th>Default</th>
-                            <th>Description</th>
-                        </tr>
-                    </thead>
-                    <tbody>
-                        <tr>
-                            <td><code>automute</code></td>
-                            <td>Boolean</td>
-                            <td>true</td>
-                            <td>Automutes the video.</td>
-                        </tr>
-                        <tr>
-                            <td><code>width</code></td>
-                            <td>Number</td>
-                            <td>undefined</td>
-                            <td>The element's width.</td>
-                        </tr>
-                        <tr>
-                            <td><code>height</code></td>
-                            <td>Number</td>
-                            <td>undefined</td>
-                            <td>The element's height.</td>
-                        </tr>
-                    </tbody>
-                </table>
-            </div>
-        </div>
-    </body>
-</html>

data/assets/node_modules/uikit/tests/description-list.html DELETED

@@ -1,52 +0,0 @@
-<!DOCTYPE html>
-<html lang="en-gb" dir="ltr">
-    <head>
-        <meta charset="utf-8">
-        <meta name="viewport" content="width=device-width, initial-scale=1">
-        <title>Description List - UIkit tests</title>
-        <script src="../dist/js/uikit.js"></script>
-        <script src="js/test.js"></script>
-    </head>
-    <body>
-        <div class="uk-container">
-            <h1>Description List</h1>
-            <div class="uk-child-width-1-2@m" uk-grid>
-                <div>
-                    <h3>Default</h3>
-                    <dl class="uk-description-list">
-                        <dt>Description term</dt>
-                        <dd>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</dd>
-                        <dt>Description term</dt>
-                        <dd>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</dd>
-                        <dt>Description term</dt>
-                        <dd>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</dd>
-                    </dl>
-                </div>
-                <div>
-                    <h3>Divider</h3>
-                    <dl class="uk-description-list uk-description-list-divider">
-                        <dt>Description term</dt>
-                        <dd>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</dd>
-                        <dt>Description term</dt>
-                        <dd>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</dd>
-                        <dt>Description term</dt>
-                        <dd>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</dd>
-                    </dl>
-                </div>
-            </div>
-        </div>
-    </body>
-</html>

data/assets/node_modules/uikit/tests/divider.html DELETED

@@ -1,50 +0,0 @@
-<!DOCTYPE html>
-<html lang="en-gb" dir="ltr">
-    <head>
-        <meta charset="utf-8">
-        <meta name="viewport" content="width=device-width, initial-scale=1">
-        <title>Divider - UIkit tests</title>
-        <script src="../dist/js/uikit.js"></script>
-        <script src="js/test.js"></script>
-    </head>
-    <body>
-        <div class="uk-container">
-            <h1>Divider icon</h1>
-            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
-            <hr class="uk-divider-icon">
-            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
-            <div class="uk-child-width-1-2 uk-margin-medium" uk-grid>
-                <div>
-                    <h1>Divider small</h1>
-                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.</p>
-                    <hr class="uk-divider-small">
-                    <p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
-                </div>
-                <div>
-                    <h1>Divider small</h1>
-                    <div class="uk-divider-small"></div>
-                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
-                </div>
-            </div>
-        </div>
-    </body>
-</html>

data/assets/node_modules/uikit/tests/dotnav.html DELETED

@@ -1,140 +0,0 @@
-<!DOCTYPE html>
-<html lang="en-gb" dir="ltr">
-    <head>
-        <meta charset="utf-8">
-        <meta name="viewport" content="width=device-width, initial-scale=1">
-        <title>Dotnav - UIkit tests</title>
-        <script src="../dist/js/uikit.js"></script>
-        <script src="js/test.js"></script>
-    </head>
-    <body>
-        <div class="uk-container">
-            <h1>Dotnav</h1>
-            <h2>Horizontal</h2>
-            <ul class="uk-dotnav">
-                <li class="uk-active"><a href="#">Item 1</a></li>
-                <li><a href="#">Item 2</a></li>
-                <li><a href="#">Item 3</a></li>
-                <li><a href="#">Item 4</a></li>
-                <li><a href="#">Item 5</a></li>
-                <li><a href="#">Item 6</a></li>
-            </ul>
-            <h2>Vertical</h2>
-            <ul class="uk-dotnav uk-dotnav-vertical">
-                <li class="uk-active"><a href="#">Item 1</a></li>
-                <li><a href="#">Item 2</a></li>
-                <li><a href="#">Item 3</a></li>
-                <li><a href="#">Item 4</a></li>
-                <li><a href="#">Item 5</a></li>
-                <li><a href="#">Item 6</a></li>
-            </ul>
-            <h2>Image</h2>
-            <div class="uk-child-width-1-3@m" uk-grid>
-                <div>
-                    <div class="uk-inline uk-light">
-                        <img src="images/photo.jpg" alt="">
-                        <div class="uk-position-small uk-position-bottom-center">
-                            <ul class="uk-dotnav">
-                                <li class="uk-active"><a href="#">Item 1</a></li>
-                                <li><a href="#">Item 2</a></li>
-                                <li><a href="#">Item 3</a></li>
-                                <li><a href="#">Item 4</a></li>
-                                <li><a href="#">Item 5</a></li>
-                                <li><a href="#">Item 6</a></li>
-                            </ul>
-                        </div>
-                        <div class="uk-position-small uk-position-center-right">
-                            <ul class="uk-dotnav uk-dotnav-vertical">
-                                <li class="uk-active"><a href="#">Item 1</a></li>
-                                <li><a href="#">Item 2</a></li>
-                                <li><a href="#">Item 3</a></li>
-                                <li><a href="#">Item 4</a></li>
-                                <li><a href="#">Item 5</a></li>
-                                <li><a href="#">Item 6</a></li>
-                            </ul>
-                        </div>
-                    </div>
-                </div>
-                <div>
-                    <div class="uk-inline uk-light">
-                        <img src="images/dark.jpg" alt="">
-                        <div class="uk-position-small uk-position-bottom-center">
-                            <ul class="uk-dotnav">
-                                <li class="uk-active"><a href="#">Item 1</a></li>
-                                <li><a href="#">Item 2</a></li>
-                                <li><a href="#">Item 3</a></li>
-                                <li><a href="#">Item 4</a></li>
-                                <li><a href="#">Item 5</a></li>
-                                <li><a href="#">Item 6</a></li>
-                            </ul>
-                        </div>
-                        <div class="uk-position-small uk-position-center-right">
-                            <ul class="uk-dotnav uk-dotnav-vertical">
-                                <li class="uk-active"><a href="#">Item 1</a></li>
-                                <li><a href="#">Item 2</a></li>
-                                <li><a href="#">Item 3</a></li>
-                                <li><a href="#">Item 4</a></li>
-                                <li><a href="#">Item 5</a></li>
-                                <li><a href="#">Item 6</a></li>
-                            </ul>
-                        </div>
-                    </div>
-                </div>
-                <div>
-                    <div class="uk-inline uk-dark">
-                        <img src="images/light.jpg" alt="">
-                        <div class="uk-position-small uk-position-bottom-center">
-                            <ul class="uk-dotnav">
-                                <li class="uk-active"><a href="#">Item 1</a></li>
-                                <li><a href="#">Item 2</a></li>
-                                <li><a href="#">Item 3</a></li>
-                                <li><a href="#">Item 4</a></li>
-                                <li><a href="#">Item 5</a></li>
-                                <li><a href="#">Item 6</a></li>
-                            </ul>
-                        </div>
-                        <div class="uk-position-small uk-position-center-right">
-                            <ul class="uk-dotnav uk-dotnav-vertical">
-                                <li class="uk-active"><a href="#">Item 1</a></li>
-                                <li><a href="#">Item 2</a></li>
-                                <li><a href="#">Item 3</a></li>
-                                <li><a href="#">Item 4</a></li>
-                                <li><a href="#">Item 5</a></li>
-                                <li><a href="#">Item 6</a></li>
-                            </ul>
-                        </div>
-                    </div>
-                </div>
-            </div>
-            <div class="uk-position-medium uk-position-center-right uk-position-fixed uk-visible@l">
-                <ul class="uk-dotnav uk-dotnav-vertical">
-                    <li class="uk-active"><a href="#">Item 1</a></li>
-                    <li><a href="#">Item 2</a></li>
-                    <li><a href="#">Item 3</a></li>
-                    <li><a href="#">Item 4</a></li>
-                    <li><a href="#">Item 5</a></li>
-                    <li><a href="#">Item 6</a></li>
-                </ul>
-            </div>
-        </div>
-    </body>
-</html>

data/assets/node_modules/uikit/tests/drop.html DELETED

@@ -1,409 +0,0 @@
-<!DOCTYPE html>
-<html lang="en-gb" dir="ltr">
-    <head>
-        <meta charset="utf-8">
-        <meta name="viewport" content="width=device-width, initial-scale=1">
-        <title>Drop - UIkit tests</title>
-        <script src="../dist/js/uikit.js"></script>
-        <script src="js/test.js"></script>
-        <style type="text/css">
-            .boundary { border: 1px dashed rgba(0,0,0,0.2); }
-            .small-width { width: 165px; }
-        </style>
-    </head>
-    <body>
-        <div class="uk-container">
-            <h1>Drop</h1>
-            <div class="uk-margin" uk-margin>
-                <div class="uk-inline">
-                    <button class="uk-button uk-button-default" type="button">Hover</button>
-                    <div id="parent-drop" uk-drop>
-                        <div id="parent-drop-card" class="uk-card uk-card-body uk-card-default">
-                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
-                            <button class="uk-button uk-button-primary uk-width-1-1" type="button">Hover</button>
-                            <div id="child-drop" uk-drop="pos: right-center; offset: 50">
-                                <div id="child-drop-card" class="uk-card uk-card-body uk-card-default">
-                                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
-                                    <button class="uk-button uk-button-primary uk-width-1-1" type="button">Hover</button>
-                                    <div id="child-child-drop" uk-drop="pos: right-center; offset: 50">
-                                        <div id="child-child-drop-card" class="uk-card uk-card-body uk-card-default">
-                                            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
-                                        </div>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-                <div class="uk-inline">
-                    <button class="uk-button uk-button-default" type="button">Click</button>
-                    <div id="parent-drop-click" uk-drop="mode: click">
-                        <div id="parent-drop-card-click" class="uk-card uk-card-body uk-card-default">
-                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
-                            <button class="uk-button uk-button-primary uk-width-1-1" type="button">Click</button>
-                            <div id="child-drop-click" uk-drop="pos: right-center; offset: 50; mode: click">
-                                <div id="child-drop-card-click" class="uk-card uk-card-body uk-card-default">
-                                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
-                                    <button class="uk-button uk-button-primary uk-width-1-1" type="button">Click</button>
-                                    <div id="child-child-drop-click" uk-drop="pos: right-center; offset: 50; mode: click">
-                                        <div id="child-child-drop-card-click" class="uk-card uk-card-body uk-card-default">
-                                            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
-                                        </div>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-                <div class="uk-inline">
-                    <button class="uk-button uk-button-default" type="button">Hover only</button>
-                    <div uk-drop="mode: hover; delay-hide: 0">
-                        <div class="uk-card uk-card-body uk-card-default">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
-                    </div>
-                </div>
-                <div class="uk-inline">
-                    <button class="uk-button uk-button-default" type="button" uk-toggle="target: ~div; mode: click,hover">Same</button>
-                    <button class="uk-button uk-button-default" type="button" uk-toggle="target: ~div; mode: click,hover">Same</button>
-                    <button class="uk-button uk-button-default" type="button">Target</button>
-                    <div uk-drop>
-                        <div class="uk-card uk-card-body uk-card-default">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
-                    </div>
-                </div>
-            </div>
-            <h2>Position</h2>
-            <div class="uk-margin" uk-margin>
-                <div class="uk-inline">
-                    <button class="uk-button uk-button-default" type="button">Bottom Left</button>
-                    <div uk-drop>
-                        <div class="uk-card uk-card-body uk-card-default">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
-                    </div>
-                </div>
-                <div class="uk-inline">
-                    <button class="uk-button uk-button-default" type="button">Bottom Center</button>
-                    <div uk-drop="pos: bottom-center">
-                        <div class="uk-card uk-card-body uk-card-default">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
-                    </div>
-                </div>
-                <div class="uk-inline">
-                    <button class="uk-button uk-button-default" type="button">Bottom Right</button>
-                    <div uk-drop="pos: bottom-right">
-                        <div class="uk-card uk-card-body uk-card-default">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
-                    </div>
-                </div>
-                <div class="uk-inline">
-                    <button class="uk-button uk-button-default" type="button">Bottom Justify</button>
-                    <div uk-drop="pos: bottom-justify">
-                        <div class="uk-card uk-card-body uk-card-default">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
-                    </div>
-                </div>
-            </div>
-            <div class="uk-margin" uk-margin>
-                <div class="uk-inline">
-                    <button class="uk-button uk-button-default" type="button">Top Left</button>
-                    <div uk-drop="pos: top-left">
-                        <div class="uk-card uk-card-body uk-card-default">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
-                    </div>
-                </div>
-                <div class="uk-inline">
-                    <button class="uk-button uk-button-default" type="button">Top Center</button>
-                    <div uk-drop="pos: top-center">
-                        <div class="uk-card uk-card-body uk-card-default">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
-                    </div>
-                </div>
-                <div class="uk-inline">
-                    <button class="uk-button uk-button-default" type="button">Top Right</button>
-                    <div uk-drop="pos: top-right">
-                        <div class="uk-card uk-card-body uk-card-default">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
-                    </div>
-                </div>
-                <div class="uk-inline">
-                    <button class="uk-button uk-button-default" type="button">Top Justify</button>
-                    <div uk-drop="pos: top-justify">
-                        <div class="uk-card uk-card-body uk-card-default">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
-                    </div>
-                </div>
-            </div>
-            <div class="uk-margin" uk-margin>
-                <div class="uk-inline">
-                    <button class="uk-button uk-button-default" type="button">Left Top</button>
-                    <div uk-drop="pos: left-top">
-                        <div class="uk-card uk-card-body uk-card-default">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
-                    </div>
-                </div>
-                <div class="uk-inline">
-                    <button class="uk-button uk-button-default" type="button">Left Center</button>
-                    <div uk-drop="pos: left-center">
-                        <div class="uk-card uk-card-body uk-card-default">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
-                    </div>
-                </div>
-                <div class="uk-inline">
-                    <button class="uk-button uk-button-default" type="button">Left Bottom</button>
-                    <div uk-drop="pos: left-bottom">
-                        <div class="uk-card uk-card-body uk-card-default">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
-                    </div>
-                </div>
-            </div>
-            <div class="uk-margin" uk-margin>
-                <div class="uk-inline">
-                    <button class="uk-button uk-button-default" type="button">Right Top</button>
-                    <div uk-drop="pos: right-top">
-                        <div class="uk-card uk-card-body uk-card-default">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
-                    </div>
-                </div>
-                <div class="uk-inline">
-                    <button class="uk-button uk-button-default" type="button">Right Center</button>
-                    <div uk-drop="pos: right-center">
-                        <div class="uk-card uk-card-body uk-card-default">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
-                    </div>
-                </div>
-                <div class="uk-inline">
-                    <button class="uk-button uk-button-default" type="button">Right Bottom</button>
-                    <div uk-drop="pos: right-bottom">
-                        <div class="uk-card uk-card-body uk-card-default">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
-                    </div>
-                </div>
-            </div>
-            <h2>Drop with Boundary</h2>
-            <div class="boundary uk-margin uk-flex uk-flex-between">
-                <div class="uk-inline">
-                    <button class="uk-button uk-button-default" type="button">Right</button>
-                    <div uk-drop="pos: bottom-right; boundary: ! .boundary">
-                        <div class="uk-card uk-card-body uk-card-default">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
-                    </div>
-                </div>
-                <div class="uk-inline">
-                    <button class="uk-button uk-button-default" type="button">Justify</button>
-                    <div uk-drop="pos: bottom-justify; boundary: ! .boundary; boundary-align: true">
-                        <div class="uk-card uk-card-body uk-card-default">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
-                    </div>
-                </div>
-                <div class="uk-inline">
-                    <button class="uk-button uk-button-default" type="button">Center</button>
-                    <div uk-drop="pos: bottom-center; boundary: ! .boundary">
-                        <div class="uk-card uk-card-body uk-card-default">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
-                    </div>
-                </div>
-                <div class="uk-inline">
-                    <button class="uk-button uk-button-default" type="button">Left</button>
-                    <div uk-drop="pos: bottom-left; boundary: ! .boundary; boundary-align: true">
-                        <div class="uk-card uk-card-body uk-card-default">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
-                    </div>
-                </div>
-                <div class="uk-inline">
-                    <button class="uk-button uk-button-default" type="button">Right</button>
-                    <div uk-drop="pos: bottom-right; boundary: ! .boundary; boundary-align: true">
-                        <div class="uk-card uk-card-body uk-card-default">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
-                    </div>
-                </div>
-                <div class="uk-inline">
-                    <button class="uk-button uk-button-default" type="button">Centered</button>
-                    <div uk-drop="pos: bottom-center; boundary: ! .boundary; boundary-align: true">
-                        <div class="uk-card uk-card-body uk-card-default">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
-                    </div>
-                </div>
-                <div class="uk-inline">
-                    <button class="uk-button uk-button-default" type="button">Left</button>
-                    <div uk-drop="pos: bottom-left; boundary: ! .boundary">
-                        <div class="uk-card uk-card-body uk-card-default">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
-                    </div>
-                </div>
-            </div>
-            <div class="boundary small-width uk-panel">
-                <div class="uk-inline uk-margin-small-bottom">
-                    <button class="uk-button uk-button-default" type="button">Top</button>
-                    <div uk-drop="pos: right-bottom; boundary: ! .boundary">
-                        <div class="uk-card uk-card-body uk-card-default">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
-                    </div>
-                </div>
-                <div class="uk-inline uk-margin-small-bottom">
-                    <button class="uk-button uk-button-default" type="button">Justify</button>
-                    <div uk-drop="pos: right-justify; boundary: ! .boundary; boundary-align: true">
-                        <div class="uk-card uk-card-body uk-card-default uk-height-1-1">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
-                    </div>
-                </div>
-                <div class="uk-inline uk-margin-small-bottom">
-                    <button class="uk-button uk-button-default" type="button">Center</button>
-                    <div uk-drop="pos: right-center; boundary: ! .boundary">
-                        <div class="uk-card uk-card-body uk-card-default">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
-                    </div>
-                </div>
-                <div class="uk-inline uk-margin-small-bottom">
-                    <button class="uk-button uk-button-default" type="button">Top</button>
-                    <div uk-drop="pos: right-top; boundary: ! .boundary; boundary-align: true">
-                        <div class="uk-card uk-card-body uk-card-default">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
-                    </div>
-                </div>
-                <div class="uk-inline uk-margin-small-bottom">
-                    <button class="uk-button uk-button-default" type="button">Bottom</button>
-                    <div uk-drop="pos: right-bottom; boundary: ! .boundary; boundary-align: true">
-                        <div class="uk-card uk-card-body uk-card-default">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
-                    </div>
-                </div>
-                <div class="uk-inline uk-margin-small-bottom">
-                    <button class="uk-button uk-button-default" type="button">Centered</button>
-                    <div uk-drop="pos: right-center; boundary: ! .boundary; boundary-align: true">
-                        <div class="uk-card uk-card-body uk-card-default">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
-                    </div>
-                </div>
-                <div class="uk-inline">
-                    <button class="uk-button uk-button-default" type="button">Bottom</button>
-                    <div uk-drop="pos: right-top; boundary: ! .boundary">
-                        <div class="uk-card uk-card-body uk-card-default">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
-                    </div>
-                </div>
-            </div>
-            <h2>Javascript Options</h2>
-            <div class="uk-overflow-auto">
-                <table class="uk-table uk-table-striped">
-                    <thead>
-                        <tr>
-                            <th>Option</th>
-                            <th>Value</th>
-                            <th>Default</th>
-                            <th>Description</th>
-                        </tr>
-                    </thead>
-                    <tbody>
-                        <tr>
-                            <td><code>toggle</code></td>
-                            <td>CSS selector | Boolean</td>
-                            <td>true</td>
-                            <td>By default the previous element will be used as toggled.</td>
-                        </tr>
-                        <tr>
-                            <td><code>pos</code></td>
-                            <td>String</td>
-                            <td>'bottom-left'</td>
-                            <td>Drop position.</td>
-                        </tr>
-                        <tr>
-                            <td><code>mode</code></td>
-                            <td>hover | click</td>
-                            <td>click,hover</td>
-                            <td>Comma separated list of drop trigger behaviour modes.</td>
-                        </tr>
-                        <tr>
-                            <td><code>delay-show</code></td>
-                            <td>Number</td>
-                            <td>0</td>
-                            <td>Delay time in hover mode before a Drop is shown in ms.</td>
-                        </tr>
-                        <tr>
-                            <td><code>delay-hide</code></td>
-                            <td>Number</td>
-                            <td>800</td>
-                            <td>Delay time in hover mode before a Drop is hidden in ms.</td>
-                        </tr>
-                        <tr>
-                            <td><code>boundary</code></td>
-                            <td>CSS selector</td>
-                            <td>window</td>
-                            <td>Referenced element to keep Drop's visibility.</td>
-                        </tr>
-                        <tr>
-                            <td><code>boundary-align</code></td>
-                            <td>Boolean</td>
-                            <td>false</td>
-                            <td>Align Drop to boundary.</td>
-                        </tr>
-                        <tr>
-                            <td><code>flip</code></td>
-                            <td>false|true|'x'|'y'</td>
-                            <td>true</td>
-                            <td>Automatic Drop flip.</td>
-                        </tr>
-                        <tr>
-                            <td><code>cls</code></td>
-                            <td>String</td>
-                            <td>'uk-drop'</td>
-                            <td>The Drop container class.</td>
-                        </tr>
-                        <tr>
-                            <td><code>offset</code></td>
-                            <td>Number</td>
-                            <td>0</td>
-                            <td>The offset of the Drop container.</td>
-                        </tr>
-                        <tr>
-                            <td><code>animation</code></td>
-                            <td>String</td>
-                            <td>false</td>
-                            <td>The space separated names of animations to use.</td>
-                        </tr>
-                        <tr>
-                            <td><code>duration</code></td>
-                            <td>Number</td>
-                            <td>200</td>
-                            <td>The animation duration.</td>
-                        </tr>
-                    </tbody>
-                </table>
-            </div>
-        </div>
-    </body>
-</html>