Skip to content

Instantly share code, notes, and snippets.

@plugn

plugn/index.html

Forked from anonymous/index.html
Created January 20, 2017 14:19
Show Gist options
  • Save plugn/4c08f40363ca045b82ddd46811950620 to your computer and use it in GitHub Desktop.
Save plugn/4c08f40363ca045b82ddd46811950620 to your computer and use it in GitHub Desktop.
Download ZIP
mvt-styler2 // source http://jsbin.com/pimuli
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>mvt-styler2</title>
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/css/uikit.min.css"/>
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/css/components/accordion.min.css"/>
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/css/components/sortable.min.css"/>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/js/uikit.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/js/components/accordion.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/js/components/sortable.min.js"></script>
<style>
body {
padding-bottom: 20px;
}
</style>
</head>
<body>
<div class="uk-grid" data-uk-grid-margin>
<div class="uk-width-medium-1-2">
<p><code>data-uk-nav</code></p>
<ul class="uk-nav uk-nav-side uk-nav-parent-icon uk-width-medium-2-3" data-uk-nav>
<li class="uk-active"><a href="#">Active</a></li>
<li><a href="#">Item</a></li>
<li class="uk-parent">
<a href="#">Parent</a>
<ul class="uk-nav-sub">
<li><a href="#">Sub item</a></li>
<li><a href="#">Sub item</a>
<ul>
<li><a href="#">Sub item</a></li>
<li><a href="#">Sub item</a></li>
</ul>
</li>
</ul>
</li>
<li class="uk-parent">
<a href="#">Parent</a>
<ul class="uk-nav-sub">
<li><a href="#">Sub item</a></li>
<li><a href="#">Sub item</a></li>
</ul>
</li>
</ul>
</div>
<div class="uk-width-medium-1-2">
<p><code>data-uk-nav="{multiple:true}"</code></p>
<ul class="uk-nav uk-nav-side uk-nav-parent-icon uk-width-medium-2-3" data-uk-nav="{multiple:true}">
<li class="uk-active"><a href="#">Active</a></li>
<li><a href="#">Item</a></li>
<li class="uk-parent">
<a href="#">Parent</a>
<ul class="uk-nav-sub">
<li><a href="#">Sub item</a></li>
<li><a href="#">Sub item</a>
<ul>
<li><a href="#">Sub item</a></li>
<li><a href="#">Sub item</a></li>
</ul>
</li>
</ul>
</li>
<li class="uk-parent">
<a href="#">Parent</a>
<ul class="uk-nav-sub">
<li><a href="#">Sub item</a></li>
<li><a href="#">Sub item</a></li>
</ul>
</li>
</ul>
</div>
</div>
<div class="uk-width-medium-1-3">
<ul class="uk-nav uk-nav-side" data-uk-nav>
<li class="uk-nav-header">Header</li>
<li><a href="#">Item <div>Subtitle</div></a></li>
<li><a href="#">Item</a></li>
<li class="uk-nav-divider"></li>
<li><a href="#">Item</a></li>
</ul>
</div>
<ul class="uk-nav uk-nav-parent-icon" data-uk-nav="{ multiple: true }">
<li class="uk-parent">
<a href="#">Documentation</a>
<ul class="uk-nav-sub">
<li><a href="docs/documentation_get-started.html">Get started</a></li>
<li><a href="docs/documentation_how-to-customize.html">How to customize</a></li>
<li><a href="docs/documentation_layouts.html">Layout examples</a></li>
<li><a href="docs/core.html">Core</a></li>
<li><a href="docs/components.html">Components</a></li>
</ul>
</li>
</ul>
<h2>Sortable DIVs</h2>
<div class="uk-grid uk-grid-width-1-2">
<div>
<h3>First list</h3>
<div class="uk-sortable uk-margin" data-uk-sortable="{group:'test'}">
<div class="uk-margin">
<div class="uk-panel uk-panel-box">Item 1</div>
</div>
<div class="uk-margin">
<div class="uk-panel uk-panel-box">Item 2</div>
</div>
<div class="uk-margin">
<div class="uk-panel uk-panel-box">Item 3</div>
</div>
<div class="uk-margin">
<div class="uk-panel uk-panel-box">Item 4</div>
</div>
</div>
</div>
<div>
<h3>Second list</h3>
<div class="uk-sortable uk-margin" data-uk-sortable="{group:'test'}">
<div class="uk-margin">
<div class="uk-panel uk-panel-box">Item 1</div>
</div>
<div class="uk-margin">
<div class="uk-panel uk-panel-box">Item 2</div>
</div>
<div class="uk-margin">
<div class="uk-panel uk-panel-box">Item 3</div>
</div>
<div class="uk-margin">
<div class="uk-panel uk-panel-box">Item 4</div>
</div>
</div>
</div>
</div>
<h2>Accordion </h2>
<div class="uk-accordion uk-margin" data-uk-accordion="{collapse: false}">
<h3 class="uk-accordion-title">Heading 1</h3>
<div class="uk-accordion-content">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing 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>
<h3 class="uk-accordion-title">Heading 2</h3>
<div class="uk-accordion-content">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing 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>
<h3 class="uk-accordion-title">Heading 3</h3>
<div class="uk-accordion-content">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing 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>
<h2>Combining accordion and sortable</h2>
<div class="uk-grid uk-grid-width-1-2">
<div>
<h3>First list</h3>
<div class="uk-sortable uk-accordion uk-margin" data-uk-sortable="{group:'combine'}" data-uk-accordion="{collapse: false}">
<div class="uk-margin">
<h3 class="uk-accordion-title">Heading 1</h3>
<div class="uk-accordion-content">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing 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 class="uk-margin">
<h3 class="uk-accordion-title">Heading 2</h3>
<div class="uk-accordion-content">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing 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 class="uk-margin">
<h3 class="uk-accordion-title">Heading 3</h3>
<div class="uk-accordion-content">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing 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 class="uk-margin">
<h3 class="uk-accordion-title">Heading 5</h3>
<div class="uk-accordion-content">
<p>.murobal tse di mina tillom tnuresed aiciffo iuq apluc ni tnus ,tnediorp non tatadipuc taceacco tnis ruetpecxE .rutairap allun taiguf ue erolod mullic esse tilev etatpulov ni tiredneherper ni rolod eruri etua siuD .tauqesnoc odommoc ae xe piuqila tu isin sirobal ocmallu noitaticrexe durtson siuq ,mainev minim da mine tU .auqila angam erolod te erobal tu tnudidicni ropmet domsuie od des ,tile gnicisipida rutetcesnoc ,tema tis rolod muspi meroL</p>
</div>
</div>
</div>
</div>
<div>
<h3>Second list</h3>
<div class="uk-sortable uk-accordion uk-margin" data-uk-sortable="{group:'combine'}" data-uk-accordion="{collapse: false}">
<div class="uk-margin">
<h3 class="uk-accordion-title">Heading 1</h3>
<ul class="uk-accordion-content uk-sortable" data-uk-sortable="{group:'layers}">
<li>forest</li>
<li>lake</li>
<li>beach</li>
</ul>
<!--
<div class="uk-accordion-content">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing 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 class="uk-margin">
<h3 class="uk-accordion-title">Heading 2</h3>
<ul class="uk-accordion-content uk-sortable" data-uk-sortable="{group:'layers}">
<li>space</li>
<li>spades</li>
<li>place</li>
</ul>
</div>
<div class="uk-margin">
<h3 class="uk-accordion-title">Heading 3</h3>
<div class="uk-accordion-content">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing 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 class="uk-margin">
<h3 class="uk-accordion-title">Heading 5</h3>
<div class="uk-accordion-content">
<p>.murobal tse di mina tillom tnuresed aiciffo iuq apluc ni tnus ,tnediorp non tatadipuc taceacco tnis ruetpecxE .rutairap allun taiguf ue erolod mullic esse tilev etatpulov ni tiredneherper ni rolod eruri etua siuD .tauqesnoc odommoc ae xe piuqila tu isin sirobal ocmallu noitaticrexe durtson siuq ,mainev minim da mine tU .auqila angam erolod te erobal tu tnudidicni ropmet domsuie od des ,tile gnicisipida rutetcesnoc ,tema tis rolod muspi meroL</p>
</div>
</div>
</div>
</div>
</div>
<!--
<div class="uk-sortable uk-margin" data-uk-sortable="{group:'test'}">
<div class="uk-margin uk-accordion">
<ul class="uk-list uk-list-lines">
<li>List item 1</li>
<li>List item 2</li>
<li>List item 3</li>
</ul>
</div>
<div class="uk-margin">
<div class="uk-panel uk-panel-box">Item 2</div>
</div>
</div>
-->
<script id="jsbin-source-html" type="text/html"><!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>mvt-styler2</title>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/css/uikit.min.css"/>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/css/components/accordion.min.css"/>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/css/components/sortable.min.css"/>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"><\/script>
<script src="//cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/js/uikit.min.js"><\/script>
<script src="//cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/js/components/accordion.min.js"><\/script>
<script src="//cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/js/components/sortable.min.js"><\/script>
<style>
body {
padding-bottom: 20px;
}
</style>
</head>
<body>
<div class="uk-grid" data-uk-grid-margin>
<div class="uk-width-medium-1-2">
<p><code>data-uk-nav</code></p>
<ul class="uk-nav uk-nav-side uk-nav-parent-icon uk-width-medium-2-3" data-uk-nav>
<li class="uk-active"><a href="#">Active</a></li>
<li><a href="#">Item</a></li>
<li class="uk-parent">
<a href="#">Parent</a>
<ul class="uk-nav-sub">
<li><a href="#">Sub item</a></li>
<li><a href="#">Sub item</a>
<ul>
<li><a href="#">Sub item</a></li>
<li><a href="#">Sub item</a></li>
</ul>
</li>
</ul>
</li>
<li class="uk-parent">
<a href="#">Parent</a>
<ul class="uk-nav-sub">
<li><a href="#">Sub item</a></li>
<li><a href="#">Sub item</a></li>
</ul>
</li>
</ul>
</div>
<div class="uk-width-medium-1-2">
<p><code>data-uk-nav="{multiple:true}"</code></p>
<ul class="uk-nav uk-nav-side uk-nav-parent-icon uk-width-medium-2-3" data-uk-nav="{multiple:true}">
<li class="uk-active"><a href="#">Active</a></li>
<li><a href="#">Item</a></li>
<li class="uk-parent">
<a href="#">Parent</a>
<ul class="uk-nav-sub">
<li><a href="#">Sub item</a></li>
<li><a href="#">Sub item</a>
<ul>
<li><a href="#">Sub item</a></li>
<li><a href="#">Sub item</a></li>
</ul>
</li>
</ul>
</li>
<li class="uk-parent">
<a href="#">Parent</a>
<ul class="uk-nav-sub">
<li><a href="#">Sub item</a></li>
<li><a href="#">Sub item</a></li>
</ul>
</li>
</ul>
</div>
</div>
<div class="uk-width-medium-1-3">
<ul class="uk-nav uk-nav-side" data-uk-nav>
<li class="uk-nav-header">Header</li>
<li><a href="#">Item <div>Subtitle</div></a></li>
<li><a href="#">Item</a></li>
<li class="uk-nav-divider"></li>
<li><a href="#">Item</a></li>
</ul>
</div>
<ul class="uk-nav uk-nav-parent-icon" data-uk-nav="{ multiple: true }">
<li class="uk-parent">
<a href="#">Documentation</a>
<ul class="uk-nav-sub">
<li><a href="docs/documentation_get-started.html">Get started</a></li>
<li><a href="docs/documentation_how-to-customize.html">How to customize</a></li>
<li><a href="docs/documentation_layouts.html">Layout examples</a></li>
<li><a href="docs/core.html">Core</a></li>
<li><a href="docs/components.html">Components</a></li>
</ul>
</li>
</ul>
<h2>Sortable DIVs</h2>
<div class="uk-grid uk-grid-width-1-2">
<div>
<h3>First list</h3>
<div class="uk-sortable uk-margin" data-uk-sortable="{group:'test'}">
<div class="uk-margin">
<div class="uk-panel uk-panel-box">Item 1</div>
</div>
<div class="uk-margin">
<div class="uk-panel uk-panel-box">Item 2</div>
</div>
<div class="uk-margin">
<div class="uk-panel uk-panel-box">Item 3</div>
</div>
<div class="uk-margin">
<div class="uk-panel uk-panel-box">Item 4</div>
</div>
</div>
</div>
<div>
<h3>Second list</h3>
<div class="uk-sortable uk-margin" data-uk-sortable="{group:'test'}">
<div class="uk-margin">
<div class="uk-panel uk-panel-box">Item 1</div>
</div>
<div class="uk-margin">
<div class="uk-panel uk-panel-box">Item 2</div>
</div>
<div class="uk-margin">
<div class="uk-panel uk-panel-box">Item 3</div>
</div>
<div class="uk-margin">
<div class="uk-panel uk-panel-box">Item 4</div>
</div>
</div>
</div>
</div>
<h2>Accordion </h2>
<div class="uk-accordion uk-margin" data-uk-accordion="{collapse: false}">
<h3 class="uk-accordion-title">Heading 1</h3>
<div class="uk-accordion-content">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing 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>
<h3 class="uk-accordion-title">Heading 2</h3>
<div class="uk-accordion-content">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing 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>
<h3 class="uk-accordion-title">Heading 3</h3>
<div class="uk-accordion-content">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing 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>
<h2>Combining accordion and sortable</h2>
<div class="uk-grid uk-grid-width-1-2">
<div>
<h3>First list</h3>
<div class="uk-sortable uk-accordion uk-margin" data-uk-sortable="{group:'combine'}" data-uk-accordion="{collapse: false}">
<div class="uk-margin">
<h3 class="uk-accordion-title">Heading 1</h3>
<div class="uk-accordion-content">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing 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 class="uk-margin">
<h3 class="uk-accordion-title">Heading 2</h3>
<div class="uk-accordion-content">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing 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 class="uk-margin">
<h3 class="uk-accordion-title">Heading 3</h3>
<div class="uk-accordion-content">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing 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 class="uk-margin">
<h3 class="uk-accordion-title">Heading 5</h3>
<div class="uk-accordion-content">
<p>.murobal tse di mina tillom tnuresed aiciffo iuq apluc ni tnus ,tnediorp non tatadipuc taceacco tnis ruetpecxE .rutairap allun taiguf ue erolod mullic esse tilev etatpulov ni tiredneherper ni rolod eruri etua siuD .tauqesnoc odommoc ae xe piuqila tu isin sirobal ocmallu noitaticrexe durtson siuq ,mainev minim da mine tU .auqila angam erolod te erobal tu tnudidicni ropmet domsuie od des ,tile gnicisipida rutetcesnoc ,tema tis rolod muspi meroL</p>
</div>
</div>
</div>
</div>
<div>
<h3>Second list</h3>
<div class="uk-sortable uk-accordion uk-margin" data-uk-sortable="{group:'combine'}" data-uk-accordion="{collapse: false}">
<div class="uk-margin">
<h3 class="uk-accordion-title">Heading 1</h3>
<ul class="uk-accordion-content uk-sortable" data-uk-sortable="{group:'layers}">
<li>forest</li>
<li>lake</li>
<li>beach</li>
</ul>
<\!--
<div class="uk-accordion-content">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing 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 class="uk-margin">
<h3 class="uk-accordion-title">Heading 2</h3>
<ul class="uk-accordion-content uk-sortable" data-uk-sortable="{group:'layers}">
<li>space</li>
<li>spades</li>
<li>place</li>
</ul>
</div>
<div class="uk-margin">
<h3 class="uk-accordion-title">Heading 3</h3>
<div class="uk-accordion-content">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing 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 class="uk-margin">
<h3 class="uk-accordion-title">Heading 5</h3>
<div class="uk-accordion-content">
<p>.murobal tse di mina tillom tnuresed aiciffo iuq apluc ni tnus ,tnediorp non tatadipuc taceacco tnis ruetpecxE .rutairap allun taiguf ue erolod mullic esse tilev etatpulov ni tiredneherper ni rolod eruri etua siuD .tauqesnoc odommoc ae xe piuqila tu isin sirobal ocmallu noitaticrexe durtson siuq ,mainev minim da mine tU .auqila angam erolod te erobal tu tnudidicni ropmet domsuie od des ,tile gnicisipida rutetcesnoc ,tema tis rolod muspi meroL</p>
</div>
</div>
</div>
</div>
</div>
<\!--
<div class="uk-sortable uk-margin" data-uk-sortable="{group:'test'}">
<div class="uk-margin uk-accordion">
<ul class="uk-list uk-list-lines">
<li>List item 1</li>
<li>List item 2</li>
<li>List item 3</li>
</ul>
</div>
<div class="uk-margin">
<div class="uk-panel uk-panel-box">Item 2</div>
</div>
</div>
-->
</body>
</html>
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment