Address PR feedback

public/stylesheets/automator.css

@@ -171,13 +171,7 @@
 
 .c-automator__button--active {
   background-color: var(--color-reality);
-}
-
-.c-automator__button-resume {
-  transform: rotate(90deg);
-  height: 3.3rem;
-  width: 2.31rem;
-  margin: -0.1rem 0.9rem;
+  border-color: var(--color-reality-light);
 }
 
 .l-automator__script-names {
@@ -298,7 +292,6 @@
 .c-automator-docs--button {
   width: 2.8rem;
   height: 2.2rem;
-  padding: 0;
   margin: 0.1rem;
   border-radius: 0.3rem;
   border-width: 0.1rem;

src/components/tabs/automator/AutomatorControls.vue

@@ -24,12 +24,20 @@ export default {
       if (!this.isRunning) return "Start Automator";
       return "Pause Automator execution";
     },
-    playPauseClass() {
+    playButtonClass() {
       return {
+        "c-automator__button": true,
+        "l-automator__button": true,
+        "fas": true,
         "c-automator__button--active": this.isRunning,
+      };
+    },
+    playButtonContentsClass() {
+      return {
         "fa-play": !this.isRunning && !this.isPaused,
         "fa-pause": this.isRunning,
-        "fa-eject c-automator__button-resume": this.isPaused,
+        "fa-eject": this.isPaused,
+        "c-text-rotation": this.isPaused,
       };
     },
   },
@@ -70,11 +78,13 @@ export default {
       class="fa-fast-backward"
       @click="rewind"
     />
-    <AutomatorButton
+    <button
       v-tooltip="playTooltip"
-      :class="playPauseClass"
+      :class="playButtonClass"
       @click="play"
-    />
+    >
+      <span :class="playButtonContentsClass" />
+    </button>
     <AutomatorButton
       v-tooltip="'Stop Automator and reset position'"
       class="fa-stop"
@@ -107,5 +117,7 @@ export default {
 </template>
 
 <style scoped>
-
+  .c-text-rotation {
+    transform: rotate(90deg);
+  }
 </style>

src/components/tabs/automator/AutomatorEditor.vue

@@ -42,9 +42,6 @@ export default {
     isTextAutomator() {
       return this.automatorType === AUTOMATOR_TYPE.TEXT;
     },
-    isBlockAutomator() {
-      return this.automatorType === AUTOMATOR_TYPE.BLOCK;
-    },
     activeLine() {
       return AutomatorBackend.state.topLevelScript === this.currentScriptID ? this.activeLineRaw : 0;
     },
@@ -142,7 +139,7 @@ export default {
       v-if="isTextAutomator"
       :current-script-id="currentScriptID"
     />
-    <AutomatorBlockEditor v-if="isBlockAutomator" />
+    <AutomatorBlockEditor v-if="!isTextAutomator" />
   </div>
 </template>