jscow-application-environment/dist/css/less/themes/default/components/jscow/button.less

jsCow - Application Environment - Javascript Component Framework

//
// NOTE: There is a dependencie to the package "jscow-theme".
// To generate your jscow theme you need this package to develop your theme.


//
// Button

.jsc-btn,
.jsc-btn-disabled {
	display: inline-block;
	cursor: pointer;
	padding: (@space-default / 2) @space-default;
	.layout-default(lighten( @color-default, 5% ));
	.round-corner-all();
	.innerShadow(0, 0, 1px, 0, lighten(@shadow-color-default, 100%));
	.shadow(0, 0, 1px, 0, @shadow-color-default);
	.noelect();
	
	.fa ~ span:not(.hidden) { 
		margin-left: (@space-default / 2);
	}

	span:not(.hidden) ~ .fa { 
		margin-left: (@space-default / 2); 
	}
	
}

.jsc-btn-disabled {
	.disabled();
}

.jsc-btn-hover {
	.layout-default( lighten(@color-default, (@color-offset-default * 3) ));
	.text();
}

.jsc-btn-pressed,
.jsc-btn-press { 
	.layout-highlighted();
	.innerShadow(0, 0, 1px, 0, lighten(@shadow-color-default, 100%));
	.shadow(0, 0, 1px, 0, @shadow-color-default);
}


//
// Buttongroup

.jsc-btngroup {

	.jsc-btn {
		.round-corner-all(0);

		& ~ .jsc-btn {
			.border-left();
		}

		&:first-child {
			.round-corner-left();
		}
		
		&:last-child {
			.round-corner-right();
		}

	}

}


//
// Button within window title bar

.jsc-window-title {
	
	.jsc-btn {
		display: inline-block;
		float: right;
		padding: 0 7px;
	}
	
}