| Index: src/scss/_form.scss | 
| =================================================================== | 
| new file mode 100644 | 
| --- /dev/null | 
| +++ b/src/scss/_form.scss | 
| @@ -0,0 +1,56 @@ | 
| +/******************************************************************************* | 
| + * Form | 
| + ******************************************************************************/ | 
| + | 
| +input, | 
| +button | 
| +{ | 
| +  width: 100%; | 
| +  height: 2.6em; | 
| +} | 
| + | 
| +/* Input field | 
| + ******************************************************************************/ | 
| + | 
| +input | 
| +{ | 
| +  margin-bottom: $medium-space; | 
| +  padding: 0 $x-small-space; | 
| +  border: 2px solid #CDCDCD; | 
| +} | 
| + | 
| +/* Error state | 
| + ******************************************************************************/ | 
| + | 
| +.invalid | 
| +{ | 
| +  border-color: $error; | 
| +} | 
| + | 
| +.error-message | 
| +{ | 
| +  display: none; | 
| +} | 
| + | 
| +.invalid + .error-message | 
| +{ | 
| +  display: block; | 
| +  margin-top: -$x-small-space; | 
| +  margin-bottom: $small-space; | 
| +  color: $error; | 
| +} | 
| + | 
| +/* Buttons | 
| + ******************************************************************************/ | 
| + | 
| +button | 
| +{ | 
| +  border: 0; | 
| +  text-transform: uppercase; | 
| +} | 
| + | 
| +.secondary | 
| +{ | 
| +  color: #fff; | 
| +  background-color: $secondary; | 
| +} | 
|  |