Remove test app

examples/test/app/app.js

@@ -1,18 +0,0 @@
-var App = (function(lng, undefined) {
-
-    var _getEnvironmentFromQuoJS = (function() {
-        var environment = lng.Core.environment();
-        if (environment.isMobile) {
-           // alert('Your phone is ' + environment.os.name + ' (' + environment.os.version + ')');
-        }
-    })();
-
-    eventConsole = function(event) {
-        $$('#touchevents-console').html($$(event.target).data('event'));
-    };
-
-    return {
-        eventConsole: eventConsole
-    };
-
-})(Lungo);

examples/test/app/events.touch.js

@@ -1,36 +0,0 @@
-
-Lungo.Events.init({
-    // 'tap section#touchevents': function() {
-    //     alert(1);
-    // },
-
-    // 'touch section#touchevents a[data-event=touch]': function() {
-    //     Lungo.Notification.show('Touch', 'Description', 'message', false, 2);
-    // },
-
-
-    'tap section#touchevents [data-event=tap]': App.eventConsole,
-    'doubleTap section#touchevents [data-event=doubleTap]': App.eventConsole,
-    'hold section#touchevents [data-event=hold]': App.eventConsole,
-
-    'swipe section#touchevents [data-event=swipe]': App.eventConsole,
-    'swipeLeft section#touchevents [data-event=swipeLeft]': App.eventConsole,
-    'swipeUp section#touchevents [data-event=swipeUp]': App.eventConsole,
-    'swipeRight section#touchevents [data-event=swipeRight]': App.eventConsole,
-    'swipeDown section#touchevents [data-event=swipeDown]': App.eventConsole,
-    'swiping section#touchevents [data-event=swiping]': App.eventConsole,
-
-    'rotate section#touchevents [data-event=rotate]': App.eventConsole,
-    'rotateLeft section#touchevents [data-event=rotateLeft]': App.eventConsole,
-    'rotateRight section#touchevents [data-event=rotateRight]': App.eventConsole,
-    'rotating section#touchevents [data-event=rotating]': App.eventConsole,
-
-    'pinch section#touchevents [data-event=pinch]': App.eventConsole,
-    'pinchIn section#touchevents [data-event=pinchIn]': App.eventConsole,
-    'pinchOut section#touchevents [data-event=pinchOut]': App.eventConsole,
-    'pinching section#touchevents [data-event=pinching]': App.eventConsole,
-
-    'drag section#touchevents [data-event=drag]': App.eventConsole
-
-});
-

examples/test/app/resources/asides/features.html

@@ -1,97 +0,0 @@
-<aside id="features" class="left">
-    <header data-title="Features"></header>
-    <article class="list scroll">
-        <ul>
-            <!-- Basic Layout -->
-            <li class="current">
-                <a href="#main-article" data-target="article">
-                    <div class="bubble right">8</div>
-                    <strong>Presentation</strong>
-                    <small>Indented, Scroll</small>
-                </a>
-            </li>
-
-            <!-- Basic Layout -->
-            <li>
-                <a href="#layout" data-target="section">
-                    <div class="bubble right">8</div>
-                    <strong>Layout</strong>
-                    <small>Indented, Scroll</small>
-                </a>
-            </li>
-
-            <!-- List -->
-            <li>
-                <a href="#list" data-target="section" data-count="17">
-                    <strong>Lists</strong>
-                    <small>Indented, Scroll</small>
-                </a>
-            </li>
-
-            <!-- Notifications -->
-            <li>
-                <a href="#notification" data-target="section">
-                    <div class="bubble right">8</div>
-                    <strong>Notifications</strong>
-                    <small>Indented, Scroll</small>
-                </a>
-            </li>
-
-            <!-- Icons -->
-            <li>
-                <a href="#icon" data-target="section">
-                    <div class="bubble right">109</div>
-                    <strong>Icons</strong>
-                    <small>Messages, skskks</small>
-                </a>
-            </li>
-
-
-            <!-- Grid System -->
-            <li>
-                <a href="#grid" data-target="section">
-                    <div class="bubble right">2</div>
-                    <strong>Grid System</strong>
-                    <small>Indented, Scroll</small>
-                </a>
-            </li>
-
-             <!-- Forms -->
-            <li>
-                <a href="#form" data-target="section">
-                    <div class="bubble right">8</div>
-                    <strong>Form Elements</strong>
-                    <small>Indented, Scroll</small>
-                </a>
-            </li>
-
-            <!-- Asides -->
-            <li>
-                <a href="#aside" data-target="section">
-                    <div class="bubble right">8</div>
-                    <strong>Asides</strong>
-                    <small>Indented, Scroll</small>
-                </a>
-            </li>
-
-            <!-- Touch Events -->
-            <li>
-                <a href="#touchevents" data-target="section">
-                    <div class="bubble right">19</div>
-                    <strong>Touch Events</strong>
-                    <small>Touch, Tap, Double-Tap, Swipe...</small>
-                </a>
-            </li>
-
-
-            <!-- Pulls -->
-            <li>
-                <a href="#" data-target="section">
-                    <div class="bubble right">8</div>
-                    <strong>Buttons</strong>
-                    <small>Indented, Scroll</small>
-                </a>
-            </li>
-        </ul>
-    </article>
-</aside>

examples/test/app/resources/sections/aside.html

@@ -1,9 +0,0 @@
-<section id="aside" data-target="slide">
-    <header data-back="home" data-title="Asides"></header>
-    <article id="aside-example" class="indented">
-        <div>
-            <a href="#left" data-target="aside" data-icon="left" class="button big blue">Example of normal aside</a>
-            <a href="#right" data-target="aside" data-icon="right" class="button big red">Example of mini right aside</a>
-        </div>
-    </article>
-</section>

examples/test/app/resources/sections/form.html

@@ -1,44 +0,0 @@
-<section id="form" data-transition="slide">
-    <header data-back="home button" data-title="Form Elements"></header>
-
-    <article class="list scroll">
-        <ul>
-            <li class="contrast">
-                    <input type="search" placeholder="type your search" />
-                    <a href="#" class="button theme" data-icon="search"></a>
-                </li>
-            <li>
-                <label>Example of text</label>
-                <input type="text" placeholder="type your name" />
-            </li>
-            <li>
-                <label>Example of textarea</label>
-                <textarea placeholder="type your name"></textarea>
-            </li>
-            <li>
-                <label>Example of select</label>
-                <label class="select">
-                    <select class="custom">
-                        <option value="1">One</option>
-                        <option value="2">Two</option>
-                        <option value="3">Three</option>
-                    </select>
-                </label>
-            </li>
-            <li  class="padding">
-                <label>Do you like Lungo forms?</label>
-                <label class="checkbox right"><input type="checkbox" id="checkbox-0" checked/></label>
-            </li>
-            <li class="padding">
-                <label>Example of progress</label>
-                <div id="progress-normal" data-progress="25%"></div>
-            </li>
-            <li>
-                <label>Example of range</label>
-                <input type="range" placeholder="type your name" />
-
-            </li>
-        </ul>
-
-    </article>
-</section>

examples/test/app/resources/sections/grid.html

@@ -1,30 +0,0 @@
-<section id="grid">
-    <header data-back="home" data-title="Grid System" class="extended"></header>
-
-    <nav class="groupbar">
-        <a href="#grid-basic" data-target="article" class="current" data-label="basic"></a>
-        <a href="#grid-calendar" data-target="article" data-label="calendar example"></a>
-    </nav>
-
-
-    <article id="grid-basic" style="font-size:0.7em;">
-        <div class="four rows">class="four rows"</div>
-        <div class="one row blue">class="one row blue"</div>
-        <div class="one row">class="one row"</div>
-        <div class="two rows ">
-            <div class="two columns blue">class="two colums blue"</div>
-            <div class="two column">class="two columns"</div>
-            <div class="three columns blue">class="three columns blue"</div>
-            <div class="three columns">class="three columns"</div>
-        </div>
-        <div class="two rows">
-            <div class="three columns">class="three columns"</div>
-            <div class="three column blue">class="three column"</div>
-            <div class="two columns">class="two columns"</div>
-            <div class="two columns blue">class="two columns blue"</div>
-        </div>
-    </article>
-
-    <article id="grid-calendar">
-    </article>
-</section>

examples/test/app/resources/sections/icon.html

@@ -1,628 +0,0 @@
-<section id="icon" data-transition="slide">
-    <header class="extended" data-back="home" data-title="Icons Repository"></header>
-
-    <nav class="groupbar">
-        <a href="#icons-default" data-target="article" data-label="Normal" data-count="72" class="current"></a>
-        <a href="#icons-brands" data-target="article" data-label="Brands" data-count="37" ></a>
-    </nav>
-
-    <article id="icons-default" class="list scroll indented">
-        <ul>
-            <li data-icon="home">
-                <a href="#">
-                    <strong>Home</strong>
-                    <small>class .home</small>
-                </a>
-            </li>
-            <li data-icon="picture">
-                <a href="#">
-                <strong>picture</strong>
-                <small>class .picture</small>
-                </a>
-            </li>
-            <li data-icon="camera">
-                <a href="#">
-                <strong>camera</strong>
-                <small>class .camera</small>
-                </a>
-            </li>
-            <li data-icon="music">
-                <a href="#">
-                <strong>music</strong>
-                <small>class .music</small>
-                </a>
-            </li>
-            <li data-icon="broadcast">
-                <a href="#">
-                <strong>broadcast</strong>
-                <small>class .broadcast</small>
-                </a>
-            </li>
-            <li data-icon="microphone">
-                <a href="#">
-                <strong>microphone</strong>
-                <small>class .microphone</small>
-                </a>
-            </li>
-            <li data-icon="book">
-                <a href="#">
-                <strong>book</strong>
-                <small>class .book</small>
-                </a>
-            </li>
-            <li data-icon="folder">
-                <a href="#">
-                <strong>folder</strong>
-                <small>class .folder</small>
-                </a>
-            </li>
-            <li data-icon="tag">
-                <a href="#">
-                <strong>tag</strong>
-                <small>class .tag</small>
-                </a>
-            </li>
-            <li data-icon="ticket">
-                <a href="#">
-                <strong>ticket</strong>
-                <small>class .ticket</small>
-                </a>
-            </li>
-            <li data-icon="cart">
-                <a href="#">
-                <strong>cart</strong>
-                <small>class .cart</small>
-                </a>
-            </li>
-            <li data-icon="phone">
-                <a href="#">
-                <strong>phone</strong>
-                <small>class .p>one</small>
-                </a>
-            </li>
-            <li data-icon="address">
-                <a href="#">
-                <strong>address</strong>
-                <small>class .address</small>
-                </a>
-            </li>
-            <li data-icon="mail">
-                <a href="#">
-                <strong>mail</strong>
-                <small>class .mail</small>
-                </a>
-            </li>
-            <li data-icon="mail-open">
-                <a href="#">
-                <strong>mail-open</strong>
-                <small>class .mail-open</small>
-                </a>
-            </li>
-            <li data-icon="pushpin">
-                <a href="#">
-                <strong>pushpin</strong>
-                <small>class .pushpin</small>
-                </a>
-            </li>
-            <li data-icon="compass">
-                <a href="#">
-                <strong>compass</strong>
-                <small>class .compass</small>
-                </a>
-            </li>
-            <li data-icon="clock">
-                <a href="#">
-                <strong>clock</strong>
-                <small>class .clock</small>
-                </a>
-            </li>
-            <li data-icon="calendar">
-                <a href="#">
-                <strong>calendar</strong>
-                <small>class .calendar</small>
-                </a>
-            </li>
-            <li data-icon="mobile">
-                <a href="#">
-                <strong>mobile</strong>
-                <small>class .mobile</small>
-                </a>
-            </li>
-            <li data-icon="inbox">
-                <a href="#">
-                <strong>inbox</strong>
-                <small>class .inbox</small>
-                </a>
-            </li>
-            <li data-icon="inbox-full">
-                <a href="#">
-                <strong>inbox-full</strong>
-                <small>class .inbox-full</small>
-                </a>
-            </li>
-            <li data-icon="user">
-                <a href="#">
-                <strong>user</strong>
-                <small>class .user</small>
-                </a>
-            </li>
-            <li data-icon="users">
-                <a href="#">
-                <strong>users</strong>
-                <small>class .users</small>
-                </a>
-            </li>
-            <li data-icon="vcard">
-                <a href="#">
-                <strong>vcard</strong>
-                <small>class .vcard</small>
-                </a>
-            </li>
-            <li data-icon="chat">
-                <a href="#">
-                <strong>chat</strong>
-                <small>class .chat</small>
-                </a>
-            </li>
-            <li data-icon="message">
-                <a href="#">
-                <strong>message</strong>
-                <small>class .message</small>
-                </a>
-            </li>
-            <li data-icon="search">
-                <a href="#">
-                <strong>search</strong>
-                <small>class .search</small>
-                </a>
-            </li>
-            <li data-icon="pie">
-                <a href="#">
-                <strong>pie</strong>
-                <small>class .pie</small>
-                </a>
-            </li>
-            <li data-icon="bars">
-                <a href="#">
-                <strong>bars</strong>
-                <small>class .bars</small>
-                </a>
-            </li>
-            <li data-icon="remove">
-                <a href="#">
-                <strong>remove</strong>
-                <small>class .remove</small>
-                </a>
-            </li>
-            <li data-icon="grid">
-                <a href="#">
-                <strong>grid</strong>
-                <small>class .grid</small>
-                </a>
-            </li>
-            <li data-icon="menu">
-                <a href="#">
-                <strong>menu</strong>
-                <small>class .menu</small>
-                </a>
-            </li>
-            <li data-icon="cloud">
-                <a href="#">
-                <strong>cloud</strong>
-                <small>class .cloud</small>
-                </a>
-            </li>
-            <li data-icon="upload">
-                <a href="#">
-                <strong>upload</strong>
-                <small>class .upload</small>
-                </a>
-            </li>
-            <li data-icon="star">
-                <a href="#">
-                <strong>star</strong>
-                <small>class .star</small>
-                </a>
-            </li>
-            <li data-icon="star-full">
-                <a href="#">
-                <strong>star-full</strong>
-                <small>class .star-full</small>
-                </a>
-            </li>
-            <li data-icon="heart">
-                <a href="#">
-                <strong>heart</strong>
-                <small>class .heart</small>
-                </a>
-            </li>
-            <li data-icon="heart-full">
-                <a href="#">
-                <strong>heart-full</strong>
-                <small>class .heart-full</small>
-                </a>
-            </li>
-            <li data-icon="thumbs-up">
-                <a href="#">
-                <strong>thumbs-up</strong>
-                <small>class .thumbs-up</small>
-                </a>
-            </li>
-            <li data-icon="thumbs-down">
-                <a href="#">
-                <strong>thumbs-down</strong>
-                <small>class .thumbs-down</small>
-                </a>
-            </li>
-            <li data-icon="help">
-                <a href="#">
-                <strong>help</strong>
-                <small>class .help</small>
-                </a>
-            </li>
-            <li data-icon="warning">
-                <a href="#">
-                <strong>warning</strong>
-                <small>class .warning</small>
-                </a>
-            </li>
-            <li data-icon="info">
-                <a href="#">
-                <strong>info</strong>
-                <small>class .info</small>
-                </a>
-            </li>
-            <li data-icon="cancel">
-                <a href="#">
-                <strong>cancel</strong>
-                <small>class .cancel</small>
-                </a>
-            </li>
-            <li data-icon="check">
-                <a href="#">
-                <strong>check</strong>
-                <small>class .check</small>
-                </a>
-            </li>
-            <li data-icon="multiply">
-                <a href="#">
-                <strong>multiply</strong>
-                <small>class .multiply</small>
-                </a>
-            </li>
-            <li data-icon="plus">
-                <a href="#">
-                <strong>plus</strong>
-                <small>class .plus</small>
-                </a>
-            </li>
-            <li data-icon="minus">
-                <a href="#">
-                <strong>minus</strong>
-                <small>class .minus</small>
-                </a>
-            </li>
-            <li data-icon="left">
-                <a href="#">
-                <strong>left</strong>
-                <small>class .left</small>
-                </a>
-            </li>
-            <li data-icon="down">
-                <a href="#">
-                <strong>down</strong>
-                <small>class .down</small>
-                </a>
-            </li>
-            <li data-icon="right">
-                <a href="#">
-                <strong>right</strong>
-                <small>class .right</small>
-                </a>
-            </li>
-            <li data-icon="up">
-                <a href="#">
-                <strong>up</strong>
-                <small>class .up</small>
-                </a>
-            </li>
-            <li data-icon="refresh">
-                <a href="#">
-                <strong>refresh</strong>
-                <small>class .refresh</small>
-                </a>
-            </li>
-            <li data-icon="share">
-                <a href="#">
-                <strong>share</strong>
-                <small>class .share</small>
-                </a>
-            </li>
-            <li data-icon="settings">
-                <a href="#">
-                <strong>settings</strong>
-                <small>class .settings</small>
-                </a>
-            </li>
-            <li data-icon="accessibility">
-                <a href="#">
-                <strong>accessibility</strong>
-                <small>class .accessibility</small>
-                </a>
-            </li>
-            <li data-icon="pencil">
-                <a href="#">
-                <strong>pencil</strong>
-                <small>class .pencil</small>
-                </a>
-            </li>
-            <li data-icon="file">
-                <a href="#">
-                <strong>file</strong>
-                <small>class .file</small>
-                </a>
-            </li>
-            <li data-icon="lock">
-                <a href="#">
-                <strong>lock</strong>
-                <small>class .lock</small>
-                </a>
-            </li>
-            <li data-icon="map">
-                <a href="#">
-                <strong>map</strong>
-                <small>class .map</small>
-                </a>
-            </li>
-            <li data-icon="eye">
-                <a href="#">
-                <strong>eye</strong>
-                <small>class .eye</small>
-                </a>
-            </li>
-        </ul>
-    </article>
-
-    <article id="icons-brands" class="list scroll indented">
-        <ul>
-            <li data-icon="brand google-plus">
-                <a href="#">
-                <strong>google-plus</strong>
-                <small>class .brand.google-plus</small>
-                </a>
-            </li>
-            <li data-icon="brand facebook">
-                <a href="#">
-                <strong>facebook</strong>
-                <small>class .brand.facebook</small>
-                </a>
-            </li>
-            <li data-icon="brand twitter">
-                <a href="#">
-                <strong>twitter</strong>
-                <small>class .brand.twitter</small>
-                </a>
-            </li>
-             <li data-icon="brand feed">
-                <a href="#">
-                <strong>feed</strong>
-                <small>class .brand.feed</small>
-                </a>
-            </li>
-            <li data-icon="brand vimeo">
-                <a href="#">
-                <strong>vimeo</strong>
-                <small>class .brand.vimeo</small>
-                </a>
-            </li>
-            <li data-icon="brand flickr">
-                <a href="#">
-                <strong>flickr</strong>
-                <small>class .brand.flickr</small>
-                </a>
-            </li>
-            <li data-icon="brand dribbble">
-                <a href="#">
-                <strong>dribbble</strong>
-                <small>class .brand.dribbble</small>
-                </a>
-            </li>
-            <li data-icon="brand forrst">
-                <a href="#">
-                <strong>forrst</strong>
-                <small>class .brand.forrst</small>
-                </a>
-            </li>
-            <li data-icon="brand deviantart">
-                <a href="#">
-                <strong>deviantart</strong>
-                <small>class .brand.deviantart</small>
-                </a>
-            </li>
-            <li data-icon="brand github">
-                <a href="#">
-                <strong>github</strong>
-                <small>class .brand.github</small>
-                </a>
-            </li>
-
-            <li data-icon="brand git">
-                <a href="#">
-                <strong>git</strong>
-                <small>class .brand.git</small>
-                </a>
-            </li>
-
-            <li data-icon="brand branch">
-                <a href="#">
-                <strong>branch</strong>
-                <small>class .brand.branch</small>
-                </a>
-            </li>
-
-            <li data-icon="brand fork">
-                <a href="#">
-                <strong>fork</strong>
-                <small>class .brand.fork</small>
-                </a>
-            </li>
-
-            <li data-icon="brand apple">
-                <a href="#">
-                <strong>apple</strong>
-                <small>class .brand.apple</small>
-                </a>
-            </li>
-            <li data-icon="brand android">
-                <a href="#">
-                <strong>android</strong>
-                <small>class .brand.android</small>
-                </a>
-            </li>
-            <li data-icon="brand windows">
-                <a href="#">
-                <strong>windows</strong>
-                <small>class .brand.windows</small>
-                </a>
-            </li>
-            <li data-icon="brand skype">
-                <a href="#">
-                <strong>skype</strong>
-                <small>class .brand.skype</small>
-                </a>
-            </li>
-            <li data-icon="brand linkedin">
-                <a href="#">
-                <strong>linkedin</strong>
-                <small>class .brand.linkedin</small>
-                </a>
-            </li>
-            <li data-icon="brand html5">
-                <a href="#">
-                <strong>html5</strong>
-                <small>class .brand.html5</small>
-                </a>
-            </li>
-
-            <li data-icon="brand css3">
-                <a href="#">
-                <strong>css3</strong>
-                <small>class .brand.css3</small>
-                </a>
-            </li>
-            <li data-icon="brand chrome">
-                <a href="#">
-                <strong>chrome</strong>
-                <small>class .brand.chrome</small>
-                </a>
-            </li>
-            <li data-icon="brand firefox">
-                <a href="#">
-                <strong>firefox</strong>
-                <small>class .brand.firefox</small>
-                </a>
-            </li>
-            <li data-icon="brand IE">
-                <a href="#">
-                <strong>IE</strong>
-                <small>class .brand.IE</small>
-                </a>
-            </li>
-            <li data-icon="brand opera">
-                <a href="#">
-                <strong>opera</strong>
-                <small>class .brand.opera</small>
-                </a>
-            </li>
-
-            <li data-icon="brand wordpress">
-                <a href="#">
-                <strong>wordpress</strong>
-                <small>class .brand.wordpress</small>
-                </a>
-            </li>
-        </ul>
-        <ul>
-            <li class="anchor">Variations</li>
-            <li data-icon="brand google-plus-2">
-                <a href="#">
-                <strong>google-plus-2</strong>
-                <small>class .brand.google-plus-2</small>
-                </a>
-            </li>
-
-            <li data-icon="brand twitter-2">
-                <a href="#">
-                <strong>twitter-2</strong>
-                <small>class .brand.twitter-2</small>
-                </a>
-            </li>
-            <li data-icon="brand facebook-2">
-                <a href="#">
-                <strong>facebook-2</strong>
-                <small>class .brand.facebook-2</small>
-                </a>
-            </li>
-
-            <li data-icon="brand feed-2">
-                <a href="#">
-                <strong>feed-2</strong>
-                <small>class .brand.feed-2</small>
-                </a>
-            </li>
-
-            <li data-icon="brand vimeo-2">
-                <a href="#">
-                <strong>vimeo-2</strong>
-                <small>class .brand.vimeo-2</small>
-                </a>
-            </li>
-
-            <li data-icon="brand flickr-2">
-                <a href="#">
-                <strong>flickr-2</strong>
-                <small>class .brand.flickr-2</small>
-                </a>
-            </li>
-
-            <li data-icon="brand dribbble-2">
-                <a href="#">
-                <strong>dribbble-2</strong>
-                <small>class .brand.dribbble-2</small>
-                </a>
-            </li>
-
-            <li data-icon="brand deviantart-2">
-                <a href="#">
-                <strong>deviantart-2</strong>
-                <small>class .brand.deviantart-2</small>
-                </a>
-            </li>
-            <li data-icon="brand git-2">
-                <a href="#">
-                <strong>git-2</strong>
-                <small>class .brand.git-2</small>
-                </a>
-            </li>
-            <li data-icon="brand github-2">
-                <a href="#">
-                <strong>github-2</strong>
-                <small>class .brand.github-2</small>
-                </a>
-            </li>
-            <li data-icon="brand wordpress-2">
-                <a href="#">
-                <strong>wordpress-2</strong>
-                <small>class .brand.wordpress-2</small>
-                </a>
-            </li>
-
-            <li data-icon="brand html5-2">
-                <a href="#">
-                <strong>html5-2</strong>
-                <small>class .brand.html5-2</small>
-                </a>
-            </li>
-        </ul>
-    </article>
-</section>

examples/test/app/resources/sections/layout.html

@@ -1,31 +0,0 @@
-<section id="layout" data-transition="slide">
-    <header data-title="Layout" class="extended">
-        <nav class="left button">
-            <a href="#back" data-target="section" data-icon="home"></a>
-        </nav>
-        <nav class="right button">
-            <a href="#" data-icon="user" data-label="button"></a>
-        </nav>
-    </header>
-
-    <nav class="groupbar">
-        <a href="#layout-art1" data-target="article" class="current" data-icon="home" data-label="aaa"></a>
-        <a href="#layout-art2" data-target="article" data-icon="user" data-label="aaa"></a>
-        <a href="#layout-art3" data-target="article" data-icon="user" data-label="aaa"></a>
-        <a href="#layout-art4" data-target="article" data-icon="user" data-label="aaa"></a>
-    </nav>
-
-    <footer>
-        <nav class="with-labels">
-            <a href="#layout-art1" data-target="article" class="current" data-icon="home" data-label="aaa"></a>
-            <a href="#layout-art2" data-target="article" data-icon="user" data-label="aaa"></a>
-            <a href="#layout-art3" data-target="article" data-icon="user" data-label="aaa"></a>
-            <a href="#layout-art4" data-target="article" data-icon="user" data-label="aaa"></a>
-        </nav>
-    </footer>
-
-    <article id="layout-art1"></article>
-    <article id="layout-art2"></article>
-    <article id="layout-art3"></article>
-    <article id="layout-art4"></article>
-</section>

examples/test/app/resources/sections/list.html

@@ -1,212 +0,0 @@
-<section id="list" data-transition="slide">
-    <header data-title="Lists" class="extended" data-back="home"></header>
-
-    <nav class="groupbar">
-        <a href="#list-normal" data-target="article" class="current" data-icon="checkmark" data-label="Normal"></a>
-        <a href="#list-indented" data-target="article" data-icon="close" data-label="Indented"></a>
-    </nav>
-
-    <article id="list-normal" class="list scroll">
-        <ul>
-            <li class="anchor">With right elements</li>
-
-            <li>
-                <strong>&lt;li&gt; + &lt;strong&gt; </strong>
-            </li>
-
-            <li class="selectable">
-                <strong>&lt;li class="selectable"&gt; + &lt;strong&gt; </strong>
-            </li>
-
-            <li>
-                <a href="#">
-                    <strong>&lt;li&gt; + &lt;a&gt; + &lt;strong&gt; </strong>
-                </a>
-            </li>
-
-            <li>
-                <strong>&lt;li&gt; + &lt;strong&gt; </strong>
-                <small>&lt;small&gt;</small>
-            </li>
-
-            <li class="anchor">.arrow class</li>
-
-            <li class="arrow">
-                <strong>&lt;li class="arrow"&gt; + &lt;strong&gt; </strong>
-            </li>
-
-            <li class="arrow">
-                <strong>&lt;li class="arrow"&gt; + &lt;strong&gt; </strong>
-                <small>&lt;small&gt;</small>
-            </li>
-
-            <li class="arrow">
-                <strong>&lt;li class="arrow"&gt; + &lt;strong&gt; </strong>
-                <small>&lt;small&gt;</small>
-                <small>&lt;small&gt;</small>
-            </li>
-
-
-            <li class="anchor">.right element</li>
-
-            <li>
-                <a href="#">
-                    <div class="right">.right</div>
-                    <strong>&lt;strong&gt; element</strong>
-                    <small>with &lt;small&gt; element</small>
-                </a>
-            </li>
-
-            <li>
-                <a href="#">
-                    <div class="right bubble blue">.right.bubble</div>
-                    <strong>&lt;strong&gt; element</strong>
-                    <small>with &lt;small&gt; element</small>
-                </a>
-            </li>
-
-            <li>
-                <a href="#">
-                    <div class="right bubble blue" data-icon="clock">.right data-icon</div>
-                    <strong>&lt;strong&gt; element</strong>
-                    <small>with &lt;small&gt; element</small>
-                </a>
-            </li>
-
-            <li class="anchor">With data-icon or data-image attribute</li>
-            <li data-image="http://placehold.it/32x32">
-                <strong>&lt;li data-image&gt; + &lt;strong&gt; </strong>
-                <small>&lt;small&gt;</small>
-            </li>
-            <li class=" thumb" data-image="http://placehold.it/46x46">
-                <strong>&lt;li class="thumb" data-image&gt; + &lt;strong&gt; </strong>
-                <small>&lt;small&gt;</small>
-            </li>
-            <li data-icon="user">
-                <strong>&lt;li data-icon&gt; + &lt;strong&gt; </strong>
-                <small>&lt;small&gt;</small>
-            </li>
-            <li class="thumb" data-icon="user">
-                <strong>&lt;li class="thumb" data-icon&gt; + &lt;strong&gt; </strong>
-                <small>&lt;small&gt;</small>
-            </li>
-
-            <li class="anchor">With colours</li>
-            <li class="blue">
-                <strong>&lt;li class="blue"&gt; + &lt;strong&gt; </strong>
-                <small>&lt;small&gt;</small>
-            </li>
-            <li class="green">
-                <strong>&lt;li class="green"&gt; + &lt;strong&gt; </strong>
-                <small>&lt;small&gt;</small>
-            </li>
-            <li class="yellow">
-                <strong>&lt;li class="yellow"&gt; + &lt;strong&gt; </strong>
-                <small>&lt;small&gt;</small>
-            </li>
-        </ul>
-
-    </article>
-
-    <article id="list-indented" class="list scroll indented">
-        <ul>
-            <li class="anchor">With right elements</li>
-
-            <li>
-                <strong>&lt;li&gt; + &lt;strong&gt; </strong>
-            </li>
-
-            <li class="selectable">
-                <strong>&lt;li class="selectable"&gt; + &lt;strong&gt; </strong>
-            </li>
-
-            <li>
-                <a href="#">
-                    <strong>&lt;li&gt; + &lt;a&gt; + &lt;strong&gt; </strong>
-                </a>
-            </li>
-
-            <li>
-                <strong>&lt;li&gt; + &lt;strong&gt; </strong>
-                <small>&lt;small&gt;</small>
-            </li>
-
-            <li class="anchor">.arrow class</li>
-
-            <li class="arrow">
-                <strong>&lt;li class="arrow"&gt; + &lt;strong&gt; </strong>
-            </li>
-
-            <li class="arrow">
-                <strong>&lt;li class="arrow"&gt; + &lt;strong&gt; </strong>
-                <small>&lt;small&gt;</small>
-            </li>
-
-            <li class="arrow">
-                <strong>&lt;li class="arrow"&gt; + &lt;strong&gt; </strong>
-                <small>&lt;small&gt;</small>
-                <small>&lt;small&gt;</small>
-            </li>
-
-
-            <li class="anchor">.right element</li>
-
-            <li>
-                <a href="#">
-                    <div class="right">.right</div>
-                    <strong>&lt;strong&gt; element</strong>
-                    <small>with &lt;small&gt; element</small>
-                </a>
-            </li>
-
-            <li>
-                <a href="#">
-                    <div class="right bubble blue">.right.bubble</div>
-                    <strong>&lt;strong&gt; element</strong>
-                    <small>with &lt;small&gt; element</small>
-                </a>
-            </li>
-
-            <li>
-                <a href="#">
-                    <div class="right bubble blue" data-icon="clock">.right data-icon</div>
-                    <strong>&lt;strong&gt; element</strong>
-                    <small>with &lt;small&gt; element</small>
-                </a>
-            </li>
-
-            <li class="anchor">With data-icon or data-image attribute</li>
-            <li data-image="http://placehold.it/32x32">
-                <strong>&lt;li data-image&gt; + &lt;strong&gt; </strong>
-                <small>&lt;small&gt;</small>
-            </li>
-            <li class=" thumb" data-image="http://placehold.it/46x46">
-                <strong>&lt;li class="thumb" data-image&gt; + &lt;strong&gt; </strong>
-                <small>&lt;small&gt;</small>
-            </li>
-            <li data-icon="user">
-                <strong>&lt;li data-icon&gt; + &lt;strong&gt; </strong>
-                <small>&lt;small&gt;</small>
-            </li>
-            <li class="thumb" data-icon="user">
-                <strong>&lt;li class="thumb" data-icon&gt; + &lt;strong&gt; </strong>
-                <small>&lt;small&gt;</small>
-            </li>
-
-            <li class="anchor">With colours</li>
-            <li class="blue">
-                <strong>&lt;li class="blue"&gt; + &lt;strong&gt; </strong>
-                <small>&lt;small&gt;</small>
-            </li>
-            <li class="green">
-                <strong>&lt;li class="green"&gt; + &lt;strong&gt; </strong>
-                <small>&lt;small&gt;</small>
-            </li>
-            <li class="yellow">
-                <strong>&lt;li class="yellow"&gt; + &lt;strong&gt; </strong>
-                <small>&lt;small&gt;</small>
-            </li>
-        </ul>
-
-    </article>
-</section>

examples/test/app/resources/sections/notification.html

@@ -1,19 +0,0 @@
-<section id="notification" data-transition="slide">
-    <header data-title="Notifications" data-back="home"></header>
-
-    <article class="list scroll indented">
-        <div>
-            <a href="#" class="button big" data-label="Normal" data-action="normal"></a>
-            <a href="#" class="button big" data-label="Normal + Animation" data-action="animate"></a>
-            <a href="#" class="button big" data-label="Loading" data-label="Loading" data-action="loading"></a>
-            <a href="#" class="button big" data-label="Confirm" data-action="confirm"></a>
-            <a href="#" class="button big" data-label="Html" data-action="html"></a>
-
-            <a href="#" class="button big green" data-label="Success" data-action="success"></a>
-            <a href="#" class="button big red" data-label="Error" data-action="error"></a>
-            <a href="#" class="button big yellow" data-label="Alert" data-action="alert"></a>
-
-            <a href="#" class="button big blue" data-label="Chaining" data-action="chaining"></a>
-        </div>
-    </article>
-</section>

examples/test/app/resources/sections/splash.html

@@ -1,13 +0,0 @@
-<section id="login">
-    <article class="indented splash current">
-        <h1>New user</h1>
-        <form class="roundeds">
-            <input type="text" placeholder="Your email" id="txt-signup-mail" value="">
-            <input type="text" placeholder="Your username" id="txt-signup-name" value="">
-            <input type="password" placeholder="Your password" id="txt-signup-password" value="">
-            <a href="#" class="button blue big" id="btn-signup-call" data-icon="checkmark">Signup</a>
-            <a href="#back" data-target="section" class="button red big" data-icon="close">Return to login</a>
-            <a href="#back" data-target="section" class="button green " data-icon="user">Return to login</a>
-        </form>
-    </article>
-</section>

examples/test/app/resources/sections/touchevents.html

@@ -1,45 +0,0 @@
-<section id="touchevents" data-transition="slide">
-    <header data-title="Touch Events" data-back="home"></header>
-
-    <article>
-        <div class="two rows" id="touchevents-console">Test them...</div>
-        <div class="eight rows list scroll">
-        <ul>
-            <li class="anchor">Test events in your Mobile Device</li>
-            <li data-event="touch"><strong>Touch me!</strong></li>
-            <li data-event="tap" id="prueba"><strong>Tap me!</strong></li>
-            <li data-event="doubleTap"><strong>doubleTap me!</strong></li>
-            <li data-event="hold"><strong>hold me!</strong></li>
-            <li data-event="Drag">
-                <strong>Drag me!</strong>
-                <small>Swipe with 2 (or more) fingers</small></li>
-
-            <li data-event="swipe">
-                <strong>Swipe me!</strong>
-                <small>Drag in any direction</small></li>
-            <li data-event="swipeLeft"><strong>swipeLeft me!</strong></li>
-            <li data-event="swipeUp"><strong>swipeUp me!</strong></li>
-            <li data-event="swipeRight"><strong>swipeRight me!</strong></li>
-            <li data-event="swipeDown"><strong>swipeDown me!</strong></li>
-            <li data-event="swiping"><strong>swiping me!</strong></li>
-
-            <li data-event="rotate">
-                <strong>rotate me!</strong>
-                <small>Drag in any direction</small></li>
-            <li data-event="rotateLeft"><strong>rotateLeft me!</strong></li>
-            <li data-event="rotateRight"><strong>rotateRight me!</strong></li>
-            <li data-event="rotating"><strong>rotating me!</strong></li>
-
-            <li data-event="pinch">
-                <strong>pinch me!</strong>
-                <small>Drag in any direction</small></li>
-            <li data-event="pinchIn"><strong>pinchIn me!</strong></li>
-            <li data-event="pinchOut"><strong>pinchOut me!</strong></li>
-            <li data-event="pinching"><strong>pinching me!</strong></li>
-
-
-
-        </ul></div>
-    </article>
-
-</section>

examples/test/index.html

@@ -1,410 +0,0 @@
-<!doctype html>
-<html>
-<head>
-    <meta charset="utf-8">
-    <title>Lungo 2.0</title>
-    <meta name="description" content="">
-    <meta name="author" content="Javier Jiménez Villar (@soyjavi)">
-    <!-- Mobile viewport optimization http://goo.gl/b9SaQ -->
-    <meta name="HandheldFriendly" content="True">
-    <meta name="MobileOptimized" content="320">
-    <meta name="viewport" content="width=device-width, user-scalable=no">
-
-    <meta name="apple-mobile-web-app-capable" content="yes">
-    <meta name="apple-mobile-web-app-status-bar-style" content="black">
-    <meta name="format-detection" content="telephone=no">
-    <!-- For iPhone 4 with high-resolution Retina display: -->
-    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="assets/images/icon@2x.png">
-    <link rel="apple-touch-icon-precomposed" sizes="72x72" href="assets/images/icon-72.png">
-    <link rel="apple-touch-icon-precomposed" href="assets/images/icon.png">
-    <link rel="apple-touch-startup-image" href="assets/images/default.png">
-
-    <meta http-equiv="cleartype" content="on">
-
-    <!-- Main Stylesheet -->
-    <link rel="stylesheet" href="../../src/stylesheets/css/Lungo.base.css">
-    <link rel="stylesheet" href="../../src/stylesheets/css/Lungo.layout.css">
-    <link rel="stylesheet" href="../../src/stylesheets/css/Lungo.layout.nav.css">
-    <link rel="stylesheet" href="../../src/stylesheets/css/Lungo.layout.aside.css">
-    <link rel="stylesheet" href="../../src/stylesheets/css/Lungo.layout.article.css">
-    <link rel="stylesheet" href="../../src/stylesheets/css/Lungo.layout.list.css">
-    <link rel="stylesheet" href="../../src/stylesheets/css/Lungo.layout.grid.css">
-    <link rel="stylesheet" href="../../src/stylesheets/css/Lungo.widgets.css">
-    <link rel="stylesheet" href="../../src/stylesheets/css/Lungo.widgets.splash.css">
-    <link rel="stylesheet" href="../../src/stylesheets/css/Lungo.widgets.button.css">
-    <link rel="stylesheet" href="../../src/stylesheets/css/Lungo.widgets.form.css">
-    <link rel="stylesheet" href="../../src/stylesheets/css/Lungo.widgets.colour.css">
-    <link rel="stylesheet" href="../../src/stylesheets/css/Lungo.widgets.icon.css">
-    <link rel="stylesheet" href="../../src/stylesheets/css/Lungo.widgets.loading.css">
-    <link rel="stylesheet" href="../../src/stylesheets/css/Lungo.widgets.notification.css">
-    <link rel="stylesheet" href="../../src/stylesheets/css/Lungo.theme.scaffold.css">
-    <!--
-    <link rel="stylesheet" href="../../release/lungo.css">
-    <link rel="stylesheet" href="../../release/lungo.icon.css">
-    <link rel="stylesheet" href="../../release/lungo.theme.scaffold.css">
-    -->
-    <!-- App Stylesheet -->
-    <link rel="stylesheet" href="assets/stylesheets/app.css">
-</head>
-
-<body class="app">
-<!--
-    <section id="login">
-        <article class="indented splash current">
-            <h1>New user</h1>
-            <form>
-                <label>Mail</label>
-                <input type="text" placeholder="Your email" id="txt-signup-mail" value="">
-                <label>Mail</label>
-                <input type="text" placeholder="Your username" id="txt-signup-name" value="">
-                <label>Mail</label>
-                <input type="password" placeholder="Your password" id="txt-signup-password" value="">
-                <a href="#" class="button blue big" id="btn-signup-call" data-icon="checkmark">Signup</a>
-                <a href="#back" data-target="section" class="button red big" data-icon="close">Return to login</a>
-                <a href="#back" data-target="section" class="button green " data-icon="user">Return to login</a>
-            </form>
-        </article>
-    </section>
-
-    <section id="foundation">
-        <header data-title="test"></header>
-        <footer class="toolbar with-labels"></footer>
-
-        <article>
-            <div class="row one red">.row.one</div>
-
-            <div class="row six blue">
-                <div class="one column orange"></div>
-                <div class="one column"></div>
-                <div class="four column orange">.four.column.orange</div>
-                <div class="one column"></div>
-                <div class="one column orange tall"></div>
-                <div class="one column "></div>
-                <div class="one column orange "></div>
-            </div>
-
-            <div class="row two green">
-                <div class="two columns centered red"></div>
-            </div>
-
-            <div class="row one yellow">.row.one.yellow</div>
-        </article>
-    </section>
-
-    <section id="a" data-transition="pop" >
-        <header data-title="a">
-            <nav class="right">
-                <a href="#baaaa" data-target="section">B</a>
-            </nav>
-        </header>
-        <article class="">
-            <a href="#" class="button big" data-icon="home">Prueba</a>
-        </article>
-    </section>
-
-    <section id="baaaa" data-transition="pop" >
-        <header data-title="b" data-back="home"></header>
-             <article></article>
-    </section>
-
--->
-    <section id="sec-1"  class="popa" data-transition="slide">
-        <header class="extended">
-            <nav class="left">
-                <a href="#aside-controls" data-target="aside" data-icon="menu"></a>
-                <a href="#kitchen-sink-scroll" data-article="nav-2" data-target="aside" data-icon="heart" data-count="8"></a>
-            </nav>
-            <div class="left">
-                <span class="title with-subtitle">Javi Jiménez Villar</span>
-                <span class="subtitle">@soyjavi</span>
-            </div>
-            <nav class="right ">
-                <!--
-                <a href="#profiles" data-target="aside" data-label="User"></a>
-                <a href="#profiles" data-target="aside" data-icon="users" data-label="User"></a>
-                 -->
-                 <a href="#" data-icon="cloud" id="btn-toggle-loading"></a>
-                <a href="#profiles" data-target="aside" data-icon="user" data-count="1"></a>
-            </nav>
-
-            <nav class="right plain ">
-                <a href="#" data-loading="white disable"></a>
-                <a href="#" data-loading="white "></a>
-            </nav>
-        </header>
-
-        <nav class="groupbar">
-            <a href="#nav-1" data-target="article" class="current"  data-icon="html5">&nbsp;Lists</a>
-            <a href="#nav-2" data-target="article" data-icon="calendar">&nbsp;Form</a>
-        </nav>
-
-        <footer class="toolbar with-labels">
-            <nav>
-                <a href="#nav-0" data-target="article" data-icon="refresh" class="current" data-label="loading">
-                    <span class="bubble count" data-loading="white"></span>
-                </a>
-                <a href="#nav-1" data-target="article" data-title="d" data-icon="settings" data-label="boxes" data-count="1"></a>
-                <a href="#nav-2" data-target="article" data-title="b" data-icon="close" data-count="12" data-label="Form"></a>
-                <a href="#nav-3" data-target="article" data-title="c"  data-icon="share" data-label="Emails" data-count="123"></a>
-                <a href="#nav-4" data-target="article" data-title="lists" data-label="lists" data-loading="white"></a>
-            </nav>
-        </footer>
-
-        <!--
-        <footer class="toolbar">
-            <nav>
-                <a href="#nav-1" data-target="article" class="current"  data-icon="clock"></a>
-                <a href="#nav-2" data-target="article" data-icon="calendar" data-count="17"></a>
-                <a href="#a" data-target="article" data-icon="mail" data-count="124"></a>
-                <a href="#a" data-target="article" data-icon="phone" data-count="12"></a>
-            </nav>
-        </footer>
-        -->
-
-        <article id="nav-0" data-loading="black">
-        </article>
-
-        <article id="nav-1" class="lisst">
-            <div id = "prueba" class="five row list  " style="background: url(http://placehold.it/320x200);">
-            </div>
-
-            <div class="three row grey">
-                <div class="six row green">
-                    <div class="wrapper">
-                        <div class="right" data-icon="calendar">June 9, 2012</div>
-                        <strong>LungoJS.2 Application</strong>
-                        <small>by Javi Jimenez <div class="bubble grey">PRO</div></small>
-                    </div>
-                </div>
-
-                <div class="four row red">
-                    <a href="#" class="four columns">
-                        <div class="wrapper" data-icon="heart">217 Likes</div>
-                    </a>
-                    <a href="#" class="three columns">
-                        <div class="wrapper" data-icon="pushpin">4 Buckets</div>
-                    </a>
-                    <a href="#" class="three columns">
-                        <div class="wrapper" data-icon="picture">389 Views</div>
-                    </a>
-                </div>
-            </div>
-
-            <div class="two row  white list scroll">
-                <ul>
-                    <li class=" selectable" >
-                        <a href="#" data-image="http://placehold.it/32x32">
-
-                            <div class="right" data-icon="calendar">2 days ago</div>
-                            <strong>List: .selectable</strong>
-                            <small>a: data-image</small>
-                        </a>
-                    </li>
-
-                    <li class=" selectable" >
-                        <a href="#" data-image="http://placehold.it/32x32">
-
-                            <div class="right" data-icon="calendar">2 days ago</div>
-                            <strong>List: .selectable</strong>
-                            <small>a: data-image</small>
-                        </a>
-                    </li>
-
-                    <li class=" selectable" >
-                        <a href="#" data-image="http://placehold.it/32x32">
-
-                            <div class="right" data-icon="calendar">2 days ago</div>
-                            <strong>List: .selectable</strong>
-                            <small>a: data-image</small>
-                        </a>
-                    </li>
-                </ul>
-            </div>
-
-        </article>
-
-        <article id="nav-2" class="list indented scroll">
-            <ul class="form minimal">
-                <li data-loading="black big"></li>
-                <li id="loading-code" style="background-color: grey;"></li>
-                <li class="padding">
-                    <label>type="text"</label>
-                    <input type="text" placeholder="Input text"/>
-                    <textarea placeholder="Textarea sample"></textarea>
-                    <label class="select">
-                        <select class="custom">
-                            <option value="1">One</option>
-                            <option value="2">Two</option>
-                            <option value="3">Three</option>
-                        </select>
-                    </label>
-                </li>
-                <li class="padding">
-                    <label class="radio"><input type="radio" name="group-0" id="radio-0" checked="checked"/></label>
-                    <label class="radio"><input type="radio" name="group-0" id="radio-1"/></label>
-                    <label class="radio"><input type="radio" name="group-0" id="radio-2"/></label>
-                </li>
-                <li  class="padding">
-                    <label class="-pop">Do you like LungoJS forms?</label>
-                    <label class="checkbox right"><input type="checkbox" id="checkbox-0" checked/></label>
-                </li>
-
-                <li class="padding">
-                    <div id="progress-normal" data-progress="25%"></div>
-                    <div id="progress-big" data-progress="50%" class="big"></div>
-                    <label>type="range"</label>
-                    <input type="range">
-                </li>
-            </ul>
-            <ul>
-                <li class="anchor " data-icon="small user">Examples of anchors</li>
-                <li class="padding">
-                    <strong>Lorem Ipsum</strong>
-                    <small>is simply dummy text of the printing and typesetting industry</small>
-                </li>
-                <li class="anchor" data-icon="home small">Lorem Ipsum is simply dummy text...</li>
-                <li class="anchor contrast" data-icon="home small">Lorem Ipsum is simply dummy text...</li>
-
-                <li class="anchor" data-icon="home">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's...</li>
-                <li class="anchor contrast" data-icon="home">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's...</li>
-
-
-                <li class="anchor contrast" data-icon="question small">It's a special form element you must set the label with class "select"</li>
-            </ul>
-        </article>
-
-
-
-        <article id="nav-4" class="list scroll">
-            <ul>
-                <li>
-                    <a href="#" >
-                        <strong>List: none</strong>
-                        <small>a: none</small>
-                    </a>
-                </li>
-
-                <li class=" selectable" >
-                    <a href="#" data-image="http://placehold.it/32x32">
-
-                        <div class="right" data-icon="calendar">2 days ago</div>
-                        <strong>List: .selectable</strong>
-                        <small>a: data-image</small>
-                    </a>
-                </li>
-                 <li class="arrow thumb">
-                    <a href="#" data-image="http://placehold.it/48x48">
-                        <strong>List: .arrow .thumb </strong>
-                         <small>a: data-image</small>
-                    </a>
-                </li>
-                <li class="red">
-                    <a href="#"  data-icon="home">
-                        <div class="bubble red right"><span class="icon map"></span>125m</div>
-                        <strong>List: .red</strong>
-                        <small data-icon="clock">a: data-icon & .bubble</small>
-                    </a>
-                </li>
-
-                <li class="padding" data-icon="user">
-                    <strong>List: .padding & data-icon</strong>
-                    <small><span class="icon home"></span>a: undefined</small>
-                </li>
-
-                <li class="padding">
-                    <input type="text" placeholder="Input text"/>
-                    <textarea placeholder="Textarea sample"></textarea>
-                    <label class="select">
-                        <select class="custom">
-                            <option value="1">One</option>
-                            <option value="2">Two</option>
-                            <option value="3">Three</option>
-                        </select>
-                    </label>
-                </li>
-            </ul>
-
-        </article>
-
-        <article id="nav-3" class="list indented">
-            <div>
-                <a href="#sec-2" data-target="section" class="button big" data-icon="check">Test 2</a>
-                <a href="#sec-2"  class="button big red " data-icon="check">Test 2</a>
-                <a href="#sec-2" class="button big green" data-icon="check">Test 2</a>
-            </div>
-        </article>
-    </section>
-
-
-    <section id="sec-2" data-transition="pop">
-        <header data-title="Auto title centered">
-            <nav class="left">
-                <a href="#back" data-target="section" class="cancel" data-icon="close" data-label="CANCEL"></a>
-            </nav>
-
-            <nav class="right ">
-                <a href="#" class="accept" data-icon="check" data-label="ACCEPT"></a>
-            </nav>
-        </header>
-        <article>
-            None
-        </article>
-    </section>
-
-    <!-- Lungo dependencies -->
-    <script src="../../src/lib/quo.debug.js"></script>
-    <!--
-    <script src="../../release/lungo.js"></script>
-    -->
-    <script src="../../src/Lungo.js"></script>
-    <script src="../../src/Lungo.init.js"></script>
-    <script src="../../src/Lungo.Core.js"></script>
-    <script src="../../src/Lungo.Dom.js"></script>
-    <script src="../../src/Lungo.Service.js"></script>
-    <script src="../../src/Lungo.Constants.js"></script>
-    <script src="../../src/Lungo.Element.js"></script>
-    <script src="../../src/Lungo.Events.js"></script>
-    <script src="../../src/Lungo.Notification.js"></script>
-    <script src="../../src/router/Lungo.Router.js"></script>
-    <script src="../../src/router/Lungo.Router.History.js" ></script>
-    <script src="../../src/view/Lungo.View.Resize.js"></script>
-    <script src="../../src/view/Lungo.View.Article.js" ></script>
-    <script src="../../src/view/Lungo.View.Aside.js" ></script>
-    <script src="../../src/view/Lungo.View.Element.js"></script>
-    <script src="../../src/view/Lungo.View.Template.js"></script>
-    <script src="../../src/view/Lungo.View.Template.Binding.js"></script>
-    <script src="../../src/view/Lungo.View.Template.List.js"></script>
-    <script src="../../src/data/Lungo.Data.Cache.js"></script>
-    <script src="../../src/data/Lungo.Data.Sql.js"></script>
-    <script src="../../src/data/Lungo.Data.Storage.js"></script>
-    <script src="../../src/attributes/Lungo.Attributes.Data.js"></script>
-    <script src="../../src/Lungo.Fallback.js"></script>
-    <script src="../../src/boot/Lungo.Boot.Resources.js" ></script>
-    <script src="../../src/boot/Lungo.Boot.Stats.js" ></script>
-    <script src="../../src/boot/Lungo.Boot.Layout.js"></script>
-    <script src="../../src/boot/Lungo.Boot.Events.js"></script>
-    <script src="../../src/boot/Lungo.Boot.Data.js"></script>
-    <script src="../../src/boot/Lungo.Boot.Section.js"></script>
-    <script src="../../src/boot/Lungo.Boot.Article.js"></script>
-
-    <!-- LungoJS - Sandbox App -->
-    <script>
-        Lungo.init({
-            name: 'Kitchen Sink',
-            version: '2.0',
-            sugars: ['map', 'pull'],
-            resources: {
-                sections: ['aside.html', 'aside-profiles.html', 'notification.html'],
-                templates: [],
-                asides: []
-            }
-        });
-    </script>
-    <script src="app/app.js"></script>
-    <script src="app/view.js"></script>
-    <script src="app/data.js"></script>
-    <script src="app/services.js"></script>
-    <script src="app/events.js"></script>
-        <script src="app/events.notification.js"></script>
-</body>
-</html>