diff --git a/app/components/add-env-var.coffee b/app/components/add-env-var.coffee
new file mode 100644
index 00000000..fbffbfb2
--- /dev/null
+++ b/app/components/add-env-var.coffee
@@ -0,0 +1,38 @@
+`import Ember from 'ember'`
+
+AddEnvVarComponent = Ember.Component.extend
+
+  classNames: ['form--envvar']
+
+  store: Ember.inject.service()
+
+  isValid: () ->
+    true
+
+  reset: ->
+    @setProperties(name: null, value: null, public: null)
+
+  actions:
+    save: ->
+      return if @get('isSaving')
+      @set('isSaving', true)
+
+      if @isValid()
+        env_var = @get('store').createRecord('env_var',
+          name: @get('name')
+          value: @get('value')
+          public: @get('public')
+          repo: @get('repo')
+        )
+
+        self = this
+        env_var.save().then =>
+          @set('isSaving', false)
+          @reset()
+        , =>
+          @set('isSaving', false)
+      else
+        @set('isSaving', false)
+
+
+`export default AddEnvVarComponent`
diff --git a/app/components/env-var.coffee b/app/components/env-var.coffee
index bb4047f9..b013604e 100644
--- a/app/components/env-var.coffee
+++ b/app/components/env-var.coffee
@@ -4,12 +4,6 @@ EnvVarComponent = Ember.Component.extend
 
   classNames: ['settings-envvar']
 
-  name:   DS.attr()
-  value:  DS.attr()
-  public: DS.attr('boolean')
-
-  repo: DS.belongsTo('repo', async: true)
-
   isEditing: false
   isDeleting: false
 
@@ -20,14 +14,11 @@ EnvVarComponent = Ember.Component.extend
   showValueField: Ember.computed.alias('public')
 
   value: ( (key, value) ->
-    if arguments.length == 2
-      @get('model').set('value', value)
-      value
-    else if @get('public')
-      @get('model.value')
+    if @get('envVar.public')
+      @get('envVar.value')
     else
       '••••••••••••••••'
-  ).property('model.value', 'public')
+  ).property('envVar.value', 'envVar.public')
 
   actions:
     delete: ->
diff --git a/app/controllers/settings.coffee b/app/controllers/settings.coffee
new file mode 100644
index 00000000..9d535b96
--- /dev/null
+++ b/app/controllers/settings.coffee
@@ -0,0 +1,7 @@
+`import Ember from 'ember'`
+
+SettingsController = Ember.Controller.extend
+
+  envVars: Ember.computed.filterBy('model.envVars', 'isNew', false)
+
+`export default SettingsController`
diff --git a/app/routes/settings.coffee b/app/routes/settings.coffee
index aeaae42c..cb9a0f0e 100644
--- a/app/routes/settings.coffee
+++ b/app/routes/settings.coffee
@@ -3,6 +3,18 @@
 Route = TravisRoute.extend
   needsAuth: true
   setupController: (controller, model) ->
+    @_super.apply(this, arguments)
+    controller.set('repo', @modelFor('repo'))
     @controllerFor('repo').activate('settings')
 
+  fetchEnvVars: () ->
+    repo = @modelFor('repo')
+    repo.get('envVars.promise')
+
+  model: () ->
+    return Ember.RSVP.hash({
+      envVars: this.fetchEnvVars(),
+      # sshKey: this.fetchSshKey()
+    });
+
 `export default Route`
diff --git a/app/routes/settings/index.coffee b/app/routes/settings/index.coffee
index a91a1ebd..d9845989 100644
--- a/app/routes/settings/index.coffee
+++ b/app/routes/settings/index.coffee
@@ -6,7 +6,6 @@ Route = TravisRoute.extend
 
   model: ->
     repo = @modelFor('repo')
-    console.log('######### YEHA ###############')
 
     repo.fetchSettings().then (settings) ->
 
diff --git a/app/styles/app/layouts/settings.sass b/app/styles/app/layouts/settings.sass
index 6de7e0f9..ce4456f9 100644
--- a/app/styles/app/layouts/settings.sass
+++ b/app/styles/app/layouts/settings.sass
@@ -114,6 +114,12 @@
 
 .env-var-value
   @extend %settings-value-section
+
+  // public value
+  // background-image: none;
+  // font-size: 16px;
+  // padding: 0.4rem 0 0.4rem 0.7rem;
+
   input
     display: inline-block
     width: 100%
diff --git a/app/styles/app/modules/buttons.sass b/app/styles/app/modules/buttons.sass
index 2a7c463e..7ea35a31 100644
--- a/app/styles/app/modules/buttons.sass
+++ b/app/styles/app/modules/buttons.sass
@@ -81,12 +81,6 @@ $button-border-color: #d4d4d4
     position: relative
     top: -0.15em
 
-<<<<<<< HEAD
-=======
-.btn
-  @extend .button
-  border-radius: 2px
->>>>>>> master
 .button--green
   border: none
   font-size: $font-size-small
diff --git a/app/templates/components/add-env-var.hbs b/app/templates/components/add-env-var.hbs
new file mode 100644
index 00000000..a0dded7c
--- /dev/null
+++ b/app/templates/components/add-env-var.hbs
@@ -0,0 +1,47 @@
+<form {{action "save" on="submit"}}>
+  <div class="form-elem">
+    {{input value=name class="env-name" placeholder="Name"}}
+  </div>
+  <div class="form-elem">
+    {{input value=value class="env-value" placeholder="Value"}}
+  </div>
+  <div class="form-elem">
+    {{travis-switch active=public}}
+  </div>
+  <div class="form-elem">
+    <input type="submit" value="Add" class="form-submit {{if isSaving "saving"}}" disabled={{isSaving}} />
+  </div>
+</form>
+
+{{!-- 
+
+
+<form class="env-var" {{action "save" on="submit"}}>
+  {{#travis-field "name"}}
+    
+    {{input value=name class="env-name" placeholder="Name"}} {{travis-errors "name"}}
+  {{/travis-field}}
+  <span class="equals">=</span>
+  {{#if showValueField}}
+    <div class="field value value--extra">
+      {{#label for="value" class="value"}}Value:{{/label}}
+      {{input value=value class="env-value" placeholder="Value"}}
+    </div>
+  {{else}}
+    <div class="field name">
+      <span class="value value-display secure">{{value}}</span>
+    </div>
+  {{/if}}
+  <div class="field field--switch">
+    {{travis-switch active=public}}
+    {{#label for="secure" class="public"}}Display value in build logs{{/label}}
+  </div>
+
+  <div class="actions">
+    <input type="submit" {{bind-attr value=actionType class=":submit-env-var isSaving:saving" disabled=isSaving}} />
+    <span class="or">or</span>
+    <a href="#" class="cancel-env-var" {{action "cancel"}}>Cancel</a>
+  </div>
+</form>
+
+ --}}
\ No newline at end of file
diff --git a/app/templates/components/env-var.hbs b/app/templates/components/env-var.hbs
index ef2d900e..5a260f16 100644
--- a/app/templates/components/env-var.hbs
+++ b/app/templates/components/env-var.hbs
@@ -1,7 +1,7 @@
 
-<div class="env-var-name">THIS_IS_THE_ENV_NAME</div>
+<div class="env-var-name">{{envVar.name}}</div>
 <div class="env-var-value">
-  <input type="pw" value="••••••••••••••••" readonly="readonly">
+  <input type="pw" value="{{value}}" readonly="readonly">
 </div>
 <div class="env-var-action">
   <div class="tooltip">
diff --git a/app/templates/components/travis-switch.hbs b/app/templates/components/travis-switch.hbs
index c82e3447..a33d23b7 100644
--- a/app/templates/components/travis-switch.hbs
+++ b/app/templates/components/travis-switch.hbs
@@ -1,7 +1,9 @@
-
-<span class="on">
-  ON
-</span>
-<span class="off">
-  OFF
-</span>
\ No newline at end of file
+<div class="switch-inner">
+  <span class="on">
+    ON
+  </span>
+  <span class="off">
+    OFF
+  </span>
+</div>
+<span class="label">Display value in build log</span>
diff --git a/app/templates/settings.hbs b/app/templates/settings.hbs
index eea5133b..93689a2b 100644
--- a/app/templates/settings.hbs
+++ b/app/templates/settings.hbs
@@ -18,29 +18,13 @@
     <h2 class="small-title">Environment Variables</h2>
 
     <ul class="settings-list--envvars">
-      <li>{{env-var}}</li>
-      <li>{{env-var}}</li>
-      <li>{{env-var}}</li>
-      <li>{{env-var}}</li>
+      {{#each envVars as |envVar|}}
+        <li>{{env-var envVar=envVar}}</li>
+      {{/each}}
     </ul>
 
+    {{add-env-var repo=repo}}
 
-     <div class="form--envvar">
-       <form action="">
-         <div class="form-elem">
-           <input type="text" placeholder="Name">
-         </div>
-         <div class="form-elem">
-           <input type="text" placeholder="Value">
-         </div>
-         <div class="form-elem">
-           {{settings-switch inline="true"}}
-         </div>
-         <div class="form-elem">
-           <input type="submit" class="form-submit" value="Add">
-         </div>
-       </form>
-     </div>
 
   </section>
 {{#if config.endpoints.sshKey}}
diff --git a/tests/unit/controllers/settings-test.coffee b/tests/unit/controllers/settings-test.coffee
new file mode 100644
index 00000000..c64b14d9
--- /dev/null
+++ b/tests/unit/controllers/settings-test.coffee
@@ -0,0 +1,12 @@
+`import { test, moduleFor } from 'ember-qunit'`
+
+moduleFor 'controller:settings', {
+  # Specify the other units that are required for this test.
+  # needs: ['controller:foo']
+}
+
+# Replace this with your real tests.
+test 'it exists', (assert) ->
+  controller = @subject()
+  assert.ok controller
+