soyjavi 13 éve
szülő
commit
8362405133
1 módosított fájl, 73 hozzáadás és 37 törlés
  1. 73 37
      example/flexbox.html

+ 73 - 37
example/flexbox.html

@@ -25,42 +25,12 @@
 </head>
 
 <body class="app">
-    <aside id="features" class="left">
-        <header data-title="Features">
-            <nav class="right">
-                <a href="#" class="buttons" data-icon="settings"></a>
-            </nav>
-        </header>
 
-        <article class="list scroll active">
-            <ul>
-                <!-- Basic Layout -->
-                <li class="active">
-                    <a href="#layout-art1" data-router="article" data-title="Profile" class="active">
-                        <strong>Profile</strong></a>
-                </li>
-                <li>
-                    <a href="#layout-art2" data-router="article" data-title="Inbox">
-                        <div class="tag right">19</div>
-                        <strong>Inbox</strong></a>
-                </li>
-                <li>
-                    <a href="#layout-art3" data-router="article" data-title="Map"><strong>Map</strong></a>
-                </li>
-                <li>
-                    <a href="#layout-art4" data-router="article" data-title="Settings"><strong>Settings</strong></a>
-                </li>
 
-            </ul>
-        </article>
-
-        <footer>ASIDE/FOOTER</footer>
-    </aside>
-
-    <section id="main" data-transition="">
+    <section id="main" data-transition="" data-aside="features" data-child="second">
         <header>
             <nav class="left">
-                <a href="#features" data-router="aside" data-icon="menu"></a>
+                <a href="#features" data-action="aside" data-router="aside" data-icon="menu"></a>
             </nav>
             <img src="http://cdn.tapquo.com/lungo/logo.png" class="title centered">
             <nav class="right">
@@ -91,15 +61,81 @@
 
     </section>
 
-    <section id='second' data-transition="slide">
-        <header data-title='second' data-back="home"></header>
-        <footer class=''>
-            <nav class=''></nav>
-        </footer>
+
+    <section id='second' data-transition="slide" class="" data-aside="features"  class="hide">
+        <header data-title='second' data-back="home">
+            <nav class="right">
+                <a href="#features2" data-action="aside" data-router="aside" data-icon="menu"></a>
+            </nav>
+        </header>
 
         <article id='a' class='active'></article>
     </section>
 
+
+    <!--
+    <section id='second' class="show" data-transition="slide" data-aside="features2" data-child="">
+        <header data-title='second' data-back="home">
+            <nav class="right">
+                <a href="#features2" data-action="aside" data-router="aside" data-icon="menu"></a>
+            </nav>
+        </header>
+
+        <article id='a' class='active'></article>
+    </section>
+    -->
+
+
+    <aside id="features" >
+        <header data-title="Features">
+            <nav class="right">
+                <a href="#" class="buttons" data-icon="settings"></a>
+            </nav>
+        </header>
+
+        <article class="list scroll active">
+            <ul>
+                <!-- Basic Layout -->
+                <li class="active">
+                    <a href="#layout-art1" data-router="article" data-title="Profile" class="active">
+                        <strong>Profile</strong></a>
+                </li>
+                <li>
+                    <a href="#layout-art2" data-router="article" data-title="Inbox">
+                        <div class="tag right">19</div>
+                        <strong>Inbox</strong></a>
+                </li>
+                <li>
+                    <a href="#layout-art3" data-router="article" data-title="Map"><strong>Map</strong></a>
+                </li>
+                <li>
+                    <a href="#layout-art4" data-router="article" data-title="Settings"><strong>Settings</strong></a>
+                </li>
+                <li>
+                    <a href="#second" data-router="section"><strong>Section 2</strong></a>
+                </li>
+            </ul>
+        </article>
+
+        <footer>ASIDE/FOOTER</footer>
+    </aside>
+
+    <aside id="features2" class="right">
+        <header data-title="Features 2"></header>
+
+        <article class="list scroll active">
+            <ul>
+                <!-- Basic Layout -->
+                <li class="active">
+                    <a href="#layout-art1" data-router="article" data-title="Profile" class="active">
+                        <strong>Profile</strong></a>
+                </li>
+            </ul>
+        </article>
+
+        <footer>ASIDE/FOOTER</footer>
+    </aside>
+
     <!-- Lungo dependencies -->
     <script src="components/quojs/quo.js"></script>
     <script src="components/lungo/lungo.js"></script>