File "mb-button.less"

Full path: /home/webcknlt/admissiontell.com/wp-content/plugins/mango-buttons/public/style/mb-button.less
File size: 3.66 B (3.66 KB bytes)
MIME-type: text/plain
Charset: utf-8

Download   Open   Edit   Advanced Editor &nnbsp; Back

@import 'mb-utilities.less';

.mb-button{
	
	position:relative;
	display:inline-block;
	margin-bottom:1em;
	
	/*Reset*/
	border:none;
	outline:none;
	.no-shadow();
	text-shadow:none;
	text-transform:none;
	
	-webkit-font-smoothing:subpixel-antialiased !important;
	
	/*Default font size -- All Heights, Padding, etc. based off this height*/
	font-size:17px;
	
	/*Default font family*/
	font-family:'Open Sans';
	
	//background:#00D0B1;
	//background:#409dc2;
	//background:#2ECDDA;//teal
	//background:#2E72D9;//nice blue
	//background:#2E8CD9;//nice blue (lighter)
	//background:#42c97f;//light green (too light)
	
	background:#2bc470;//default green bg if none specified
	
	color:#FFF !important;
	text-decoration:none !important;
	
	/*MIGHT FIX SOMETHING IN BROWSER TEST*/
	a{color:#FFF;}
	
	/*Default .2s transition for all styles*/
	.transition();
	
	/*Default Style is slight rounded corners*/
	.rounded-corners(.25em);
	
	/*Default cursor = pointer over button*/
	cursor:pointer;
	
	/*disabled helper class*/
	&.mb-disabled{
		cursor:pointer;
		opacity:.35;
	}
	
	/*Default Padding*/
	padding:1em 2em;
	
	/*Default Line Height*/
	line-height:1.5;
	
	/*Button Sizes*/
	&.mb-size-micro{
		font-size:10px;
		padding:.5em 1.2em;
	}
	&.mb-size-tiny{
		font-size:11px;
		padding:.75em 1.4em;
	}
	&.mb-size-small{
		font-size:14px;
		padding:.75em 1.70em;
	}
	&.mb-size-large{
		font-size:21px;
		padding:1em 2.25em;
	}
	&.mb-size-jumbo{
		font-size:28px;
		padding:1em 2.75em;
	}
	&.full-width{
		width:100%;
		padding:0;
	}
	
	&.mb-style-flat{
		//background-color:#00D0B1;
		/*font-weight:300;
		letter-spacing:.10em;*/
		
		&:hover{
			.gradient-overlay(to bottom; rgba(0,0,0,.04), rgba(0,0,0,.04););
		}
	}
	&.mb-style-traditional{
		//background-color:#2585F2;
		
		.gradient-overlay(to bottom; rgba(0,0,0,0), rgba(0,0,0,.25););
		
		&:hover{
			.gradient-overlay(to bottom; rgba(0,0,0,.05), rgba(0,0,0,.25););
		}
		&:active{
			.gradient-overlay(to bottom; rgba(0,0,0,.25), rgba(0,0,0,.15););
		}
	}
	&.mb-style-reversed{
		//background-color:#637AAD;
		
		border:.10em solid rgba(0,0,0,.15);
		.gradient-overlay(to bottom; rgba(255,255,255,.2), rgba(255,255,255,.05) 10%, rgba(0,0,0,.05););
		
		&:hover{
			.gradient-overlay(to bottom; rgba(255,255,255,.15), rgba(255,255,255,0) 10%, rgba(0,0,0,.08););
		}
		
		&:active{
			.gradient-overlay(to top; rgba(255,255,255,.2), rgba(255,255,255,.05) 10%, rgba(0,0,0,.05););
		}
	}
	&.mb-style-bordered{
		border:.20em solid rgba(0,0,0,.05);
		border-top:.10em solid rgba(255,255,255,.10);
		
		&:hover{
			.gradient-overlay(to bottom; rgba(0,0,0,.05), rgba(0,0,0,.05););
		}
		&:active{
			.gradient-overlay(to bottom; rgba(0,0,0,.10), rgba(0,0,0,.10););
		}
	}
	&.mb-style-glass{
		/*font-weight:300;
		letter-spacing:.05em;*/
		//background-color:#25BCF2;
		
		.gradient-overlay(to bottom;rgba(255,255,255,.2), rgba(255,255,255,0) 50%, rgba(0,0,0,.06) 51%, rgba(0,0,0,.02););
		
		&:hover{
			.gradient-overlay(to bottom; rgba(255,255,255,.1), rgba(255,255,255,0) 50%, rgba(0,0,0,.04) 51%, rgba(0,0,0,0););
		}
	}
	&.mb-style-raised{
		/*font-weight:700;
		letter-spacing:.15em;*/
		//background-color:#5EA053;
		
		border-bottom:.20em solid rgba(0,0,0,.25);
		
		&:hover{
			.gradient-overlay(to bottom; rgba(0,0,0,.05), rgba(0,0,0,.05););
		}
	}
	
	/*Corner Rounding*/
	&.mb-corners-default{
		.rounded-corners(.25em);
	}
	&.mb-corners-straight{
		.rounded-corners(0);
	}
	&.mb-corners-pill{
		.rounded-corners(3em);
	}
	
	/*Font Weight and Spacing*/
	&.mb-text-style-default{
		font-weight:400;
		letter-spacing:0;
	}
	&.mb-text-style-light{
		font-weight:300;
		letter-spacing:.05em;
	}
	&.mb-text-style-heavy{
		font-weight:700;
		letter-spacing:.10em;
		text-transform:uppercase;
	}
	
	
}