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

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

@import "mixins.less";

.app {
    background: @black;
}
	
/* @group <header> & <footer> & <article> */
header {
	background-color: #72be4b;
	
	border-top: 1px solid #84dd56;	
	border-bottom: 1px solid #589739;
}
	
footer {
	background: #2c2c2d -webkit-gradient(linear, left top, left bottom, color-stop(0.25, #2c2c2d), color-stop(1, #1c1d1d));
	border-top: 1px inset #1c1c1c;
}

.title {
	color: #fff;
	//text-shadow: 0px -1px 0px rgba(0,0,0,0.5) ;
	text-shadow: 0px 1px 0px #589739; 
}

article { background-color: #e2e2e2; }
	
	article .title {
    	color: #797979;
    	text-shadow: 0px 1px 0px #fff;
	}
/* @end */

/* @group <nav> */
nav a { color: rgba(0,0,0,0.5); }

nav a.current { color: #fff; }

.toolbar a.current{
	background: #1c1c1c;
	box-shadow: inset 0px 0px 8px #101010;
	text-shadow: 0px 1px 4px #000;
}	
/* @end */

/* @group <aside> */

aside {
    background: #252525;
}
	aside a {
		color: #fff;
	    text-shadow: 0px 1px 0px #000;    
	    border-bottom: 1px inset #101010;
		border-top: 1px inset #868686;
	}
	
	aside a.current { 
		background: #1c1c1c;
		box-shadow: inset 0px 0px 8px #101010;
		border-top: 1px inset #1c1c1c;
	}
	
	aside a .icon { 
		text-shadow: none; 
		color: #7a7a7a;
	}
	
	aside .anchor {
	    background: #101010;
		color:  #7a7a7a;
	}
	
	aside ~ article {
		box-shadow: -1px 0px 4px #000;
	}

/* @end */

/* @group .list */
.list, .list li:not(.toolbar) a {
	color: #333;
}
	.list li {
		background: #fff;
		border-bottom: 1px inset #e6e6e6;
	}
	
	.list li:last-child { border-bottom: none; }
	
	.indented ul {
    	border: 1px solid #c5c5c5;
	}
	
	.list .darker {
		background-color: #2c2c2d;	
		color: #fff;
		text-shadow: 0px 1px 0px #000;
	}
		.list li.darker a{ color: #fff !important; }
	
	.list .dark {
	    background-color: #f4f4f4;
		box-shadow: inset 0px 1px 0px #fff;			
		text-shadow: 0px 1px 0px #fff;
	}

	.list small, .list .onright:not(.bubble) {
		color: #999;
	}
	
	.list .tip {
		color: #7a7a7a;
	}
	
	.list li.anchor {
		background: #f4f4f4;
		color: #222;
	}
	
	.list .toolbar {
		border-bottom-color: rgba(0,0,0,0.2);
	}	
	
	.list .arrow:before {
		color: #a9a9a9;
	}
	
	.list .toolbar a { box-shadow: 1px 0px 0px #d9d9d9; }
		
		.list .toolbar a:last-child { box-shadow: none; }
		
		.list .toolbar a.current {
			background: transparent;
			color: #333;
			text-shadow: none !important;
		}
/* @end */

/* @group widgets */

.splash { 
	background: #019d5e -webkit-gradient(linear, left top, left bottom, color-stop(0.1, #019d5e), color-stop(1, #006b41));
	color: #fff; 
	text-shadow: 0px 1px 1px #000;
}

/* @group .button */

a.button {
	
	
	box-shadow: inset 0 1px 0 rgba(34,57,100,0.6), inset 1px 0 0 rgba(34,57,100,0.4), inset -1px 0 0 rgba(34,57,100,0.5), inset 0 -1px 0 rgba(34,57,100,0.6), inset 0 2px 0 rgba(255,255,255,0.2), 0px 1px 0px rgba(255,255,255,0.2);
}

a.button:active {
	box-shadow:inset 0 1px 0 rgba(10,10,10,0.5), inset 1px 0 0 rgba(10,10,10,0.3), inset -1px 0 0 rgba(10,10,10,0.4), inset 0 -1px 0 rgba(10,10,10,0.5),inset 0 1px 5px rgba(0,0,0,0.3),0 1px 0 rgba(255,255,255, 0.3);
}
/* @end */

/* @group <inputs> */
input, textarea, select {
	border: 1px solid #c5c5c5;
	
	background: #fff -webkit-gradient(linear, left top, left bottom, color-stop(0, #eee), color-stop(0.25, #fff));

}

.rounded input, textarea, select {
    .border-radius(2px);
}
	
input:focus, textarea:focus, select:focus { 
	border: 1px solid #058cf5;
	.box-shadow(0px 0px 4px 0px #058cf5);
	background: #e8fefe;
}
	
.select:after {
	background: #ccc;
	color: white;
}
/* @end */

.bubble {
	color: #fff;
	text-shadow: none;
	box-shadow: inset 0px 0px 2px rgba(0,0,0,0.7);
}
	.bubble.count { background: #e33100; }
/* @end */