Skip to content

Instantly share code, notes, and snippets.

@aekaplan
Last active December 17, 2015 16:39
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
Save aekaplan/5640867 to your computer and use it in GitHub Desktop.
Input Text SCSS
@mixin transition {
-moz-transition: 0.4s background, 0.4s border-color;
-webkit-transition: 0.4s background, 0.4s border-color;
transition: 0.4s background, 0.4s border-color;
}
@mixin border-radius {
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
}
input[type="text"] {
background: #fff;
border: 1px solid #ddd;
@include border-radius;
color: #555;
display: block;
margin-bottom: 1em;
padding: 0.5em;
@include transition;
-webkit-appearance: none;
width: 100%;
&:focus {
background: #f8f8f8;
border-color: #ccc;
outline: medium none;
}
&.validation-error {
background: #fdeeed;
border-color: #f48b80;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment