Lungo2.0.js/src/stylesheets/less/Lungo.layout.article.less

/**
 * Stylesheet
 *
 * @namespace LUNGO.Layout
 * @class Article
 *
 * @author Javier Jimenez Villar <javi@tapquo.com> || @soyjavi
 */

@import "mixins.less";
@import "constants.less";


@defaultTrasition : @easeOutSine;
@header_footer_height: 40px;
	@header_extended_height: 75px;
@footer_toolbar_height: 48px;

/* @group <article> */
article {
	position: absolute;
	width: 100% !important;
	height: auto;
	top: 0px;
	bottom: 0px;
	
	display: none;
	visibility: hidden;
	z-index: 0;
	
	&.current {
    	visibility: visible;
	    display: block;
		z-index: 1;
	}
	
	& .title {
    	font-size: 1.1em;
		margin: 0px 0 4px;
		& .icon { margin-right: 4px; }
	}
	
	& .text {
    	margin: 4px 0 8px;
		display: block;
    	font-size: 0.9em;
    	font-weight: normal;
    	line-height: 1.4em;
	}	
}
		
header:not(.extended) ~ article { top: @header-height; }	
	header.extended ~ article { top: @header_extended_height; }		
footer:not(.with-labels) ~ article { bottom: @article-bottom; }
	footer.with-labels ~ article { bottom: @article-bottom-with-labels; }

@media handheld, only screen and (min-width: 768px) {
	article.aside { .transform(translate3d(0px, 0, 0)); }
}			
/* @end */