Skip to content

Instantly share code, notes, and snippets.

@jsylvanus
Last active December 19, 2015 23:59
Show Gist options
  • Save jsylvanus/6038764 to your computer and use it in GitHub Desktop.
Save jsylvanus/6038764 to your computer and use it in GitHub Desktop.
SCSS input placeholder mixin and usage example
#filter-search-query {
@include border-radius(0.75em);
width:100%;
border:1px solid #d8d8d8;
padding:0.3em 0.9em;
@include placeholder { // placeholder usage
color:#eee;
font-family:$sans-serif;
&:before {
font-family:$icon-font;
content:$icon-search;
padding-right:5px;
}
}
}
/*********************
PLACEHOLDER STYLING
*********************/
@mixin placeholder {
$prefixes : (":-webkit-input","-moz",":-moz","-ms-input");
@each $prefix in $prefixes {
&:#{$prefix}-placeholder {
@content;
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment