From a7ad2c0a63da402c10613d5d5124b4896661737b Mon Sep 17 00:00:00 2001
From: Lisa Passing <mail@lislis.de>
Date: Wed, 15 Jul 2015 20:12:13 +0200
Subject: [PATCH] add some env var form error styles

---
 app/components/add-env-var.coffee        |  1 +
 app/styles/app/layouts/settings.sass     | 11 +++++++++++
 app/styles/app/modules/forms.sass        |  2 +-
 app/templates/components/add-env-var.hbs |  6 +++---
 4 files changed, 16 insertions(+), 4 deletions(-)

diff --git a/app/components/add-env-var.coffee b/app/components/add-env-var.coffee
index b4a674e3..830a1fac 100644
--- a/app/components/add-env-var.coffee
+++ b/app/components/add-env-var.coffee
@@ -3,6 +3,7 @@
 AddEnvVarComponent = Ember.Component.extend
 
   classNames: ['form--envvar']
+  classNameBindings: ['nameIsBlank:form-error']
 
   store: Ember.inject.service()
 
diff --git a/app/styles/app/layouts/settings.sass b/app/styles/app/layouts/settings.sass
index ce4456f9..e11522f0 100644
--- a/app/styles/app/layouts/settings.sass
+++ b/app/styles/app/layouts/settings.sass
@@ -172,3 +172,14 @@
     height: 1.3em
     margin: .2em auto 0
 
+.form-error
+  .env-name
+    border: $fail-color 2px solid
+  .form-error
+    color: $fail-color
+    font-size: 14px
+    margin: 0
+
+
+
+
diff --git a/app/styles/app/modules/forms.sass b/app/styles/app/modules/forms.sass
index 600541f3..da463443 100644
--- a/app/styles/app/modules/forms.sass
+++ b/app/styles/app/modules/forms.sass
@@ -44,7 +44,7 @@ textarea
 .form--envvar
   .form-elem
     display: inline-block
-    vertical-align: middle
+    vertical-align: top
     width: 100%
     margin-bottom: 1em
 
diff --git a/app/templates/components/add-env-var.hbs b/app/templates/components/add-env-var.hbs
index 8d25dbb8..cad73dfd 100644
--- a/app/templates/components/add-env-var.hbs
+++ b/app/templates/components/add-env-var.hbs
@@ -1,9 +1,9 @@
 <form {{action "save" on="submit"}}>
-  {{#if nameIsBlank }}
-    <p class="form-error">Name cannot be blank</p>
-  {{/if}}
   <div class="form-elem">
     {{input value=name class="env-name" on="key-press" action="nameChanged" placeholder="Name"}}
+    {{#if nameIsBlank }}
+      <p class="form-error">Name cannot be blank</p>
+    {{/if}}
   </div>
   <div class="form-elem">
     {{input value=value class="env-value" placeholder="Value"}}