merge substance toolbar and adding basic styles

app/components/SimpleEditor/SimpleEditor.scss

@@ -19,6 +19,9 @@ $teal: #46b9ba;
 $toolbar-active-bg: rgba(204, 204, 204, .75);
 $transparent-black: rgba(0, 0, 0, .75);
 $white: #fff;
+// track changes
+$inactive-grey: #404040;
+$active-blue: #4a90e2;
 
 .editor-wrapper {
   height: 90vh;
@@ -68,10 +71,10 @@ $white: #fff;
     }
 
     .sm-target-text {
-      padding: 0;
+      bottom: 5px;
       height: 100%;
+      padding: 0;
       position: relative;
-      bottom: 5px;
       .sc-switch-text-type {
         margin-left: 1px;
         width: 150px;
@@ -101,59 +104,72 @@ $white: #fff;
       }
     } // end dropdown
 
-    .sm-target-document {
-      border-left: 1px solid $border;
-      border-right: 1px solid $border;
-      padding-right: 9px;
-    }
-
-    .sm-target-annotations {
-      border-right: 1px solid $border;
-      padding: 0 9px;
-    }
-    .sm-target-insert {
-      border-right: 1px solid $border;
-    }
     .sm-target-track-change-enable {
       border-right: 1px solid $border;
-        &:before {
-          bottom: 14px;
-          content: 'Track Changes';
-          font-size: 11px;
-          left: 24%;
-          position: relative;
-        }
+
+      &:before {
+        bottom: 14px;
+        content: 'Track Changes';
+        font-size: 13px;
+        left: 24%;
+        position: relative;
+      }
+
       button {
+        background-color: $inactive-grey;
+        color: $white;
+        border-radius: 0;
         cursor: pointer;
         position: relative;
+        padding-left: 35px;
+        padding-right: 35px;
+        right: 40%;
         top: 10px;
-        right: 50%;
       }
 
       button::after {
         content: 'Record';
       }
+
       .track-changes-active {
-       background-color: blue !important;
-       color: #fff !important;
+        background-color: $active-blue;
+        color: $white;
+        padding-left: 26px;
+        padding-right: 26px;
+
        &:after {
            content: 'Recording';
        }
       }
     }
 
-
     .sm-target-track-change-toggle-view {
       cursor: pointer;
+
       button::after {
         content: 'View is Off';
       }
+
       .track-changes-view-active::after {
         content: 'View is On';
       }
     }
 
-    .sm-target-document, .sm-target-annotations, .sm-target-insert {
+    .sm-target-document {
+      border-left: 1px solid $border;
+    }
+
+    .sm-target-track-change-enable,
+    .sm-target-track-change-toggle-view {
+      padding: 10px 0;
+    }
+
+    .sm-target-document,
+    .sm-target-annotations,
+    .sm-target-insert {
+      border-right: 1px solid $border;
+      padding: 10px 9px;
+
       .sc-button {
         background: transparent;
         border: 0;

app/components/SimpleEditor/elements/track_change/trackChange.scss

-$blue: blue;
+$blue: #4a90e2;
 
 .sc-track-change-add {
   color: $blue;