Changes on aside transforms

examples/test/index.html

@@ -60,8 +60,8 @@
 
         <footer class="toolbar with-labels">
             <nav>
-                <a href="#nav-1" data-target="article" data-icon="clock" data-label="Alarm"></a>
-                <a href="#nav-2" data-target="article" class="current" data-icon="calendar" data-count="17" data-label="Calendar"></a>
+                <a href="#nav-1" data-target="article" class="current"  data-icon="clock" data-label="Alarm"></a>
+                <a href="#nav-2" data-target="article" data-icon="calendar" data-count="17" data-label="Calendar"></a>
                 <a href="#nav-3" data-target="article" data-icon="mail" data-label="Emails" data-count="124"></a>
                 <a href="#nav-4" data-target="article" data-icon="phone" data-label="Calls" data-count="12"></a>
             </nav>
@@ -100,7 +100,7 @@
                     <label class="radio"><input type="radio" name="group-0" id="radio-2"/></label>
                 </li>
                 <li>
-                    <label class="">Do you like LungoJS forms?</label>
+                    <label class="pop">Do you like LungoJS forms?</label>
                     <label class="checkbox onright"><input type="checkbox" id="checkbox-0" checked/></label>
                 </li>
 
@@ -139,20 +139,32 @@
     </section>
 
 
+    <section id="test-2" class="pop">
+        <header data-back="home" style="display: block; visibility: visible;">
+            <a href="#back" data-target="section" class="button red onright">Pruebame</a>
+        </header>
+
+        <article>
+            <a href="#back" data-target="section" class="button big blue" data-icon="home">Volver</a>
+            <a href="#back" data-target="section" class="button red onright">Pruebame</a>
+        </article>
+    </section>
 
 
-    <section id="test-2" class="pop">
+    <!-- <section id="test-2" class="-pop">
         <header data-title="Auto title centered">
             <nav class="onleft">
-                <a href="#" class="cancel" data-icon="close"  data-label="CANCEL"></a>
+                <a href="#back" data-target="section" class="cancel" data-icon="close" data-label="CANCEL"></a>
             </nav>
 
             <nav class="onright ">
                 <a href="#" class="accept" data-icon="check" data-label="ACCEPT"></a>
             </nav>
         </header>
-        <article></article>
-    </section>
+        <article>
+            None
+        </article>
+    </section> -->
 
     <!-- Third parties dependencies -->
     <script src="../../src/lib/QuoJS.js"></script>

src/boot/Lungo.Boot.Events.js

@@ -32,10 +32,10 @@ LUNGO.Boot.Events = (function(lng, undefined) {
         var resize = 'resize';
 
         //@ToDo: Error with input type="range"
-        //lng.dom(SELECTORS.DOCUMENT).on(touch_move_event, _iScroll);
+        lng.dom(SELECTORS.DOCUMENT).on(touch_move_event, _iScroll);
         lng.dom(SELECTORS.WINDOW).on(resize, _changeOrientation);
         lng.dom(SELECTORS.HREF_TARGET).tap(_loadTarget);
-        lng.dom(SELECTORS.HREF_TARGET_FROM_ASIDE).tap(_asideVisibility);
+        lng.dom(SELECTORS.HREF_TARGET_FROM_ASIDE).touch(_asideVisibility);
     };
 
     var _iScroll = function(event) {
@@ -49,7 +49,6 @@ LUNGO.Boot.Events = (function(lng, undefined) {
 
     var _loadTarget = function(event) {
         var link = lng.dom(this);
-
         _selectTarget(link);
 
         event.preventDefault();

src/stylesheets/css/Lungo.theme.default.css

@@ -40,7 +40,6 @@ footer {
 }
 article {
   background-color: #EBEBEB;
-  background: none;
 }
 article .title {
   color: #797979;

src/stylesheets/less/Lungo.layout.aside.less

@@ -11,12 +11,12 @@
 @import "mixins.less";
 
 section.aside {
-	&:not(.mini) { left: @aside-width; }
-	&.mini { left: @aside-width-mini; }
+	&:not(.mini) { .transform(translate(@aside-width, 0)); }
+	&.mini { .transform(translate(@aside-width-mini, 0)); }
 	
 	&.onright {  
-		left: 0px;	
-		.transform(translate(-@aside-width, 0)); 
+		.transform(translate(-@aside-width, 0));
+		&.mini { .transform(translate(-@aside-width-mini, 0)); }
 	}
 }
 

src/stylesheets/less/Lungo.layout.less

@@ -10,11 +10,9 @@
 @import "constants.less";
 @import "mixins.less";
 
-/* @group <section> */
-html {
-    overflow: hidden;
-}
+body {  overflow: hidden; }
 
+/* @group <section> */
 section {
 	position: absolute; /* position: fixed on iOS5 & Android 4 */
 	left:  0px;
@@ -78,7 +76,7 @@ header, footer  {
 	overflow: hidden;	
 }
 
-header  {
+header {
 	top: 0px;
 	
 	& .title {

src/stylesheets/less/Lungo.theme.default.less

@@ -70,7 +70,6 @@ footer {
 
 article {
 	background-color: #EBEBEB;
-	background: none;
 	& .title {
     	color: #797979;
     	text-shadow: 0px 1px 0px #fff;