Lungo.js/example/static/asides/features.html

<aside id="features" data-transition="left">
    <header data-title="Features">
        <nav class="on-right">
            <a href="#" class="buttons" data-icon="settings"></a>
        </nav>
    </header>

    <article class="list scroll active">
        <ul>
            <!-- Basic Layout -->
            <li data-view-article="main-article" data-icon="question-sign">
                <strong>Meet the framework</strong>
                <small>Real Cross-Device</small>
            </li>

            <!-- Layout & Navigation -->
            <li data-view-section="layout" data-async="static/sections/layout.html" data-icon="user">
                <div class="tag on-right">5</div>
                <strong>Layout</strong>
            </li>

            <!-- List -->
            <li data-view-article="list" data-async="static/articles/list.html" data-icon="list">
                <div class="tag on-right">22</div>
                <strong>Lists</strong>
            </li>

            <!-- Forms -->
            <li data-view-section="form" data-icon="check">
                <div class="tag on-right">8</div>
                <strong>Form Elements</strong>
            </li>

            <!-- Asides -->
            <li data-view-section="aside" data-async="static/sections/aside.html" data-icon="signout">
                <strong>Aside</strong>
            </li>

            <!-- Menu -->
            <li data-view-section="menu" data-async="static/sections/menu.html" data-icon="menu">
                <div class="tag on-right">2</div>
                <strong>Menu</strong>
            </li>

            <!-- Data-Attributes -->
            <li data-view-article="data" data-async="static/articles/data.html" data-icon="tag">
                <div class="tag on-right">9</div>
                <strong>Data-attributes</strong>
            </li>

            <!-- Icons -->
            <li data-view-article="icon-symbol" data-async="static/articles/icon-symbol.html" data-icon="check-empty">
                <div class="tag on-right">+250</div>
                <strong>Icons</strong>
            </li>

            <!-- Scrolls -->
            <li data-view-section="scroll" data-async="static/sections/scroll.html" data-icon="download">
                <div class="tag on-right">2</div>
                <strong>Scrolls</strong>
            </li>

            <!-- Touch Events -->
            <li data-view-article="touchevents" data-async="static/articles/touchevents.html" data-icon="magic">
                <div class="tag on-right">19</div>
                <strong>Touch Events</strong>
            </li>

            <!-- Layout Events -->
            <li data-view-section="layoutevents" data-async="static/sections/layoutevents.html" data-icon="link">
                <div class="tag on-right">2</div>
                <strong>Layout Events</strong>
            </li>

            <!-- Notifications -->
            <li data-view-article="notification" data-async="static/articles/notification.html"  data-icon="info-sign">
                <div class="tag on-right">8</div>
                <strong>Notifications</strong>
            </li>

            <!-- Pull & Refresh -->
            <li  data-view-section="pull" data-async="static/sections/pull.html" data-icon="resize-vertical">
                <div class="tag on-right">1</div>
                <strong>Pull & Refresh</strong>
            </li>

            <!-- Carousel -->
            <li data-view-section="carousel" data-async="static/sections/carousel.html" data-icon="picture">
                <div class="tag on-right">1</div>
                <strong>Carousel</strong>
            </li>

            <!-- Environment -->
            <li data-view-article="environment" data-async="static/articles/environment.html" data-icon="mobile-phone">
                <div class="tag on-right">1</div>
                <strong>Environment</strong>
            </li>

            <!-- Buttons & Colours -->
            <li data-view-article="buttons" data-async="static/articles/buttons.html" data-icon="tint">
                <div class="tag on-right">14</div>
                <strong>Buttons & Colours</strong>
            </li>

            <!-- Grid System -->
            <li data-view-article="grid" data-async="static/articles/grid.html" data-icon="grid">
                <strong>Grid System</strong>
            </li>
        </ul>
    </article>
</aside>