RPeraltaJr
3/10/2017 - 3:10 PM

Sass Mixins

Sass Mixins

@mixin backImage($image, $height: 50vh, $opacity: 0) { // default value of height is 100vh if not defined
  background: linear-gradient(rgba(0, 0, 0, $opacity), rgba(0, 0, 0, $opacity)), url($image);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  height: $height;
}

@mixin placeholderColor($color) { // use within form class
	::-webkit-input-placeholder { /* Chrome/Opera/Safari */
	  color: $color;
	}
	::-moz-placeholder { /* Firefox 19+ */
	  color: $color;
	}
	:-ms-input-placeholder { /* IE 10+ */
	  color: $color;
	}
	:-moz-placeholder { /* Firefox 18- */
	  color: $color;
	}
}