From 56fcedc06a72a94f75f228abed831da2947ff8eb Mon Sep 17 00:00:00 2001
From: Cassie Tarakajian <ctarakajian@gmail.com>
Date: Wed, 28 Sep 2016 13:15:50 -0400
Subject: [PATCH] add autofresh toggle to toolbar

---
 client/modules/IDE/components/Toolbar.js | 9 +++++++++
 client/styles/components/_toolbar.scss   | 9 +++++++++
 2 files changed, 18 insertions(+)

diff --git a/client/modules/IDE/components/Toolbar.js b/client/modules/IDE/components/Toolbar.js
index 0d9dee5b..6a4f773d 100644
--- a/client/modules/IDE/components/Toolbar.js
+++ b/client/modules/IDE/components/Toolbar.js
@@ -69,6 +69,15 @@ class Toolbar extends React.Component {
         >
           <InlineSVG src={stopUrl} alt="Stop Sketch" />
         </button>
+        <div className="toolbar__autorefresh">
+          <input
+            id="autorefresh"
+            type="checkbox"
+          />
+          <label htmlFor="autorefresh" className="toolbar__autorefresh-label">
+            Auto-refresh
+          </label>
+        </div>
         <div className={nameContainerClass}>
           <a
             className="toolbar__project-name"
diff --git a/client/styles/components/_toolbar.scss b/client/styles/components/_toolbar.scss
index b3180e97..3dbf58b8 100644
--- a/client/styles/components/_toolbar.scss
+++ b/client/styles/components/_toolbar.scss
@@ -30,6 +30,7 @@
 .toolbar__stop-button {
 	@include themify() {
 		@extend %toolbar-button;
+		margin-right: #{15 / $base-font-size}rem;
 		&--selected {
 			@extend %toolbar-button--selected;
 		}
@@ -96,3 +97,11 @@
 .toolbar__project-owner {
 	margin-left: #{5 / $base-font-size}rem;
 }
+
+.toolbar__autorefresh-label {
+	@include themify() {
+		color: getThemifyVariable('inactive-text-color');
+	}
+	margin-left: #{5 / $base-font-size}rem;
+	font-size: #{12 / $base-font-size}rem;
+}