Mixins pour Media Queries en SCSS

Déclaration de mixins prennant en compte une variable de taille pour travailler en responsive. Grâce à @content, transmission des blocs de code entiers.

@mixin mediamaxwidth($max){
	@media screen and (max-width:$max){
		@content;
	}
}
@mixin mediaminwidth($min){
	@media screen and (min-width:$min){
		@content;
	}
}
@mixin mediamaxheight($max){
	@media screen and (max-height:$max){
		@content;
	}
}
@mixin mediaminheight($min){
	@media screen and (min-height:$min){
		@content;
	}
}

Usage :

@include mediamaxwidth(980px){
	body{
		background:SlateBlue;
	}
}