// MaxSite CMS 
// Copyright http://max-3000.com/
// helpers.less

// хелперы

// см. readme-helpers.txt в shared-каталоге

// ШРИФТ
.f() {

	.verdana()
	{
		font-family: Verdana, Arial, Helvetica, sans-serif; 
	}
	
	.arial()
	{
		font-family: Arial, Helvetica, Verdana, sans-serif; 
	}
	
	.tahoma()
	{
		font-family: Tahoma, Arial, Helvetica, Verdana, sans-serif; 
	}
	
	.georgia()
	{
		font-family: Georgia, "Times New Roman", serif; 
	}
	
	.times()
	{
		font-family: "Times New Roman", Georgia, serif; 
	}
	
	.segoe()
	{
		font-family: "Segoe UI", Verdana, Arial, sans-serif; 
	}
	
	.helvetica()
	{
		font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	}
	
	.serif(@name: Georgia)
	{
		font-family: @name, "Times New Roman", Times, serif;
	}
	
	.sans(@name: Arial)
	{
		font-family: @name, "Helvetica Neue", Helvetica, Arial, sans-serif;
	}
	
	.cursive(@name: "Comic Sans")
	{
		font-family:@name, cursive;
	}
	
	.mono(@name: Courier New)
	{
		font-family: @name, Monaco, Menlo, Consolas, "Courier New", monospace;
	}
	
	.f(@name, @s: serif)
	{
		font-family: @name, @s;
	}
	
	.size(@size: 9pt)
	{
		font-size: @size;
	}
	
	.normal()
	{
		font-weight: normal;
		font-style: normal;
		text-decoration: none;
	}	
	
	.bold(@bold: bold)
	{
		font-weight: @bold;
	}
	
	.color(@color)
	{
		color: @color;
	}
	
	.italic(@italic: italic)
	{
		font-style: @italic;
	}
	
	.i(@italic: italic)
	{
		font-style: @italic;
	}
	
	.style(@style: normal)
	{
		font-style: normal;
	}
	
	.upper()
	{
		text-transform: uppercase;
	}
	
	.lower()
	{
		text-transform: lower;
	}
	
	.underline(@underline: underline)
	{
		text-decoration: @underline;
	}
	
	.small_caps(@s: small-caps)
	{
		font-variant: @s;
	}

} // .f

// полужирный
.bold(@b: bold)
{
	font-weight: @b;
}

// курсив
.italic(@i: italic)
{
	font-style: @i;
}

// цвет
.color(@color)
{
	color: @color;
}

// div по центру
.block_center(@top: 0, @bottom: 0)
{
	margin: @top auto @bottom auto;
}

.left(@f: left)
{
	float: @f;
}

.right(@f: right)
{
	float: @f;
}

// height = line-height
.lheight(@height: 30px) 
{
	height: @height; 
	line-height: @height; 
}

.align(@pos: left)
{
	text-align: @pos;
}

.border_radius(
	@radius_top_left, 
	@radius_top_right, 
	@radius_bottom_right, 
	@radius_bottom_left)
{
	-webkit-border-radius: @arguments;
	-moz-border-radius: @arguments;
	border-radius: @arguments;
}

.border_radius(@radius)
{
	-webkit-border-radius: @radius;
	-moz-border-radius: @radius;
	border-radius: @radius;
}

.border_radius(none)
{
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
}

// border
.border(@color: #C0C0C0, @width: 1px, @type: solid)
{
	border: @arguments;
}

.border_top(@color: #C0C0C0, @width: 1px, @type: solid)
{
	border-top: @arguments;
}

.border_right(@color: #C0C0C0, @width: 1px, @type: solid)
{
	border-right: @arguments;
}

.border_bottom(@color: #C0C0C0, @width: 1px, @type: solid)
{
	border-bottom: @arguments;
}

.border_left(@color: #C0C0C0, @width: 1px, @type: solid)
{
	border-left: @arguments;
}

.border(none)
{
	border: 0;
}

// тень блока
.box_shadow(none) 
{
	-o-box-shadow: none;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
}

.box_shadow(param, @attr) 
{
	-o-box-shadow: @attr;
	-webkit-box-shadow: @attr;
	-moz-box-shadow: @attr;
	box-shadow: @attr;
}

.box_shadow(@x: 0, @y: 0, @blur: 3px, @color:#888) 
{
	-o-box-shadow: @arguments;
	-webkit-box-shadow: @arguments;
	-moz-box-shadow: @arguments;
	box-shadow: @arguments;
}

.box_shadow_inset(@x: 0, @y: 0, @blur: 3px, @color: #888) 
{
	-moz-box-shadow: inset @arguments;
	-webkit-box-shadow: inset @arguments;
	box-shadow: inset @arguments;
}

.box_shadow_inset(none) 
{
	-moz-box-shadow: inset none;
	-webkit-box-shadow: inset none;
	box-shadow: inset none;
}

// тень текста
.text_shadow(@x: 0, @y: 0, @blur: 3px, @color:#888)
{
	text-shadow: @arguments;
	filter: e(%("dropshadow(color=%d, offx=%d, offy=%d)", @color, @x, @y)); // IE9 and down
}


// фон
.bg(@color: white) {
	background-color: @color;
}

// включая url-картинку
.bg(@color, @file)
{
	background: @color url("../images/backgrounds/@{file}");
}

.bgu(@file, @attr: no-repeat)
{
	background: url(@file) @attr;
}

.bgr(@color: red) {
	background-color: @color;
}

.bgy(@color: yellow) {
	background-color: @color;
}

.bgg(@color: green) {
	background-color: @color;
}


// градиент с bootstrap
.gradient()
{
	.horizontal(@start-color: #555, @start-percent: 0%, @end-color: #333, @end-percent: 100%) 
	{
		background-color: @end-color;
		background-image: -webkit-gradient(linear, @start-percent top, @end-percent top, from(@start-color), to(@end-color));
		background-image: -webkit-linear-gradient(left, color-stop(@start-color @start-percent), color-stop(@end-color @end-percent));
		background-image: -moz-linear-gradient(left, @start-color @start-percent, @end-color @end-percent);
		background-image:  linear-gradient(to right, @start-color @start-percent, @end-color @end-percent);
		background-repeat: repeat-x;
		filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",argb(@start-color),argb(@end-color)));
	}

	.vertical(@start-color: #555, @start-percent: 0%, @end-color: #333, @end-percent: 100%) 
	{
		background-color: @end-color;
		background-image: -webkit-gradient(linear, left @start-percent, left @end-percent, from(@start-color), to(@end-color)); 
		background-image: -webkit-linear-gradient(top, @start-color, @start-percent, @end-color, @end-percent); 
		background-image:  -moz-linear-gradient(top, @start-color @start-percent, @end-color @end-percent);
		background-image: linear-gradient(to bottom, @start-color @start-percent, @end-color @end-percent);
		background-repeat: repeat-x;
		filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@start-color),argb(@end-color)));
	}

	.directional(@start-color: #555, @end-color: #333, @deg: 45deg) 
	{
		background-color: @end-color;
		background-repeat: repeat-x;
		background-image: -webkit-linear-gradient(@deg, @start-color, @end-color);
		background-image: -moz-linear-gradient(@deg, @start-color, @end-color);
		background-image: linear-gradient(@deg, @start-color, @end-color);
	}
	
	.horizontal_three_colors(@start-color: #00b3ee, @mid-color: #7a43b6, @color-stop: 50%, @end-color: #c3325f) 
	{
		background-color: mix(@mid-color, @end-color, 80%);
		background-image: -webkit-gradient(left, linear, 0 0, 0 100%, from(@start-color), color-stop(@color-stop, @mid-color), to(@end-color));
		background-image: -webkit-linear-gradient(left, @start-color, @mid-color @color-stop, @end-color);
		background-image: -moz-linear-gradient(left, @start-color, @mid-color @color-stop, @end-color);
		background-image: linear-gradient(to right, @start-color, @mid-color @color-stop, @end-color);
		background-repeat: no-repeat;
		filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",argb(@start-color),argb(@end-color)));
	}

	.vertical_three_colors(@start-color: #00b3ee, @mid-color: #7a43b6, @color-stop: 50%, @end-color: #c3325f)
	{
		background-color: mix(@mid-color, @end-color, 80%);
		background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@start-color), color-stop(@color-stop, @mid-color), to(@end-color));
		background-image: -webkit-linear-gradient(@start-color, @mid-color @color-stop, @end-color);
		background-image: -moz-linear-gradient(top, @start-color, @mid-color @color-stop, @end-color);
		background-image: linear-gradient(@start-color, @mid-color @color-stop, @end-color);
		background-repeat: no-repeat;
		filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@start-color),argb(@end-color))); 
	}
	
	.radial(@inner-color: #555, @outer-color: #333) 
	{
		background-color: @outer-color;
		background-image: -webkit-gradient(radial, center center, 0, center center, 460, from(@inner-color), to(@outer-color));
		background-image: -webkit-radial-gradient(circle, @inner-color, @outer-color);
		background-image: -moz-radial-gradient(circle, @inner-color, @outer-color);
		background-image: radial-gradient(circle, @inner-color, @outer-color);
		background-repeat: no-repeat;
	}
	
	.striped(@color: #555, @angle: 45deg) 
	{
		background-color: @color;
		background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, rgba(255,255,255,.15)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(255,255,255,.15)), color-stop(.75, rgba(255,255,255,.15)), color-stop(.75, transparent), to(transparent));
		background-image: -webkit-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
		background-image: -moz-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
		background-image: linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
	}
}

// линейный градиент
.background_gradient(@startColor: #555, @endColor: #333)
{
	.gradient > .vertical(@startColor, 0%, @endColor, 100%);
}

.radial_gradient(@startColor: #555, @endColor: #333, @pos_x: center, @pos_y: center)  
{
	// closest-side, closest-corner, farthest-side, farthest-corner
	background-color: @startColor;
	background-image: -moz-radial-gradient(@pos_x @pos_y, farthest-side, @startColor, @endColor);
	background-image: -webkit-radial-gradient(@pos_x @pos_y, farthest-side, @startColor, @endColor);
	background-image: -o-radial-gradient(@pos_x @pos_y, farthest-side, @startColor, @endColor);
	background-repeat: no-repeat;
}


// прозрачность в %
.opacity(@opacity: 100) 
{
	filter: e(%("alpha(opacity=%d)", @opacity));
	-khtml-opacity: @opacity / 100;
	-moz-opacity: @opacity / 100;
	-webkit-opacity: @opacity / 100;
	opacity: @opacity / 100;
}

// аналог opacity
.op(@opacity: 100)
{
	.opacity(@opacity);
}

// аналог rgba(R,G,B, op) только с #RRGGBB
.op_color(@color: #abc, @opacity: .5)
{
	color: rgba(red(@color), green(@color), blue(@color), @opacity);
}

// цвет фона и его прозрачность
.bg_op(@color: #abc, @opacity: .5)
{
	background-color: @color;
	.opacity(@opacity * 100); 
}


// переходы
.transition(@transition) {
	-webkit-transition: @transition;
	-moz-transition: @transition;
	-ms-transition: @transition;
	-o-transition: @transition;
	transition: @transition;
}

.box_sizing(@box: border-box){
	-webkit-box-sizing: @box;
	-moz-box-sizing: @box;
	box-sizing: @box;
}

.box(@box: border-box) {
	.box_sizing(@box)
}

.transform(@transform) {
	-webkit-transform: @arguments;
	-moz-transform: @arguments;
	-o-transform: @arguments;
	-ms-transform: @arguments;
	transform: @arguments;
}

.placeholder(@color: #777) {
	&:-moz-placeholder { color: @color; }
	&::-moz-placeholder { color: @color; }
	&:-ms-input-placeholder { color: @color; }
	&::-webkit-input-placeholder { color: @color; } 
}

.text_overflow() {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
} 

.clearfix() {
	&:before,
	&:after {
		content: " "; 
		display: table; 
	}
	&:after {
		clear: both;
	}
}
