Index: scss/_form.scss |
=================================================================== |
new file mode 100644 |
--- /dev/null |
+++ b/scss/_form.scss |
@@ -0,0 +1,57 @@ |
+/******************************************************************************* |
+ * Form |
+ ******************************************************************************/ |
+ |
+input, |
+button |
+{ |
+ width: 100%; |
+ height: 2.6em; |
+ border-radius: 4px; |
+} |
+ |
+/* Input field |
juliandoucette
2017/12/22 14:34:31
Suggest: Group fields into paragraphs in order to
|
+ ******************************************************************************/ |
+ |
+input |
juliandoucette
2017/12/22 14:34:31
NIT: There seems to be more space below these in t
|
+{ |
+ margin-bottom: $small-space; |
+ padding: 0 $x-small-space; |
+ border: 1px 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; |
+} |