adding field

adding input

src/scss/_crispy.scss

@@ -14,5 +14,7 @@
     'components/modal',
     'components/panel',
     'components/table',
+    
+    'form/form',
 
     'helpers/helpers';

src/scss/example.scss

@@ -12,6 +12,8 @@
 @include crispy__panel();
 @include crispy__table();
 
+@include crispy__form__text();
+
 .button {
     border: 1px solid $crispy__color-primary;
     background-color: $crispy__color-primary;
@@ -27,7 +29,6 @@
     background-color: lighten($crispy__color-secondary, 25%);
 }
 
-
 .sm, .md, .md-only, .lg-only {
     display: none;
 }

src/scss/form/_form.scss

@@ -0,0 +1,2 @@
+@import
+    'text';

src/scss/form/_text.scss

@@ -0,0 +1,56 @@
+/**
+ * input text
+ *
+ *
+ * @author Björn Hase
+ *
+ */
+
+$crispy__form__font-size: $crispy__body__font-size !default;
+$crispy__form__padding: toEm(6px 8px) !default;
+$crispy__form__text__color: $crispy__color-text !default;
+$crispy__form__border: 1px solid $crispy__color-secondary !default;
+
+$crispy__form__border-color--focus: $crispy__color-primary !default;
+$crispy__form__border-color--valid: $crispy__color-success !default;
+$crispy__form__border-color--error: $crispy__color-danger !default;
+
+@mixin crispy__form__text() {
+    input:not([type="submit"]),
+    textarea {
+        display: block;
+        width: 100%;
+
+        line-height: $crispy__golden-ratio;
+        padding: $crispy__form__padding;
+        color: $crispy__form__text__color;
+
+        border: $crispy__form__border;
+        appearance: none;
+
+        @include crispy__font-size($crispy__form__font-size);
+    }
+
+    .field {
+        &--valid {
+            input:not([type="submit"]),
+            textarea {
+                border-color: $crispy__form__border-color--valid;
+            }
+        }
+
+        &--error {
+            input:not([type="submit"]),
+            textarea {
+                border-color: $crispy__form__border-color--error;
+            }
+        }
+    }
+
+    input:not([type="submit"]),
+    textarea {
+        &:focus {
+			border-color: $crispy__form__border-color--focus;
+		}
+    }
+}