Move preset change flash to CSS

Author: hlfan

css/80_app.css

@@ -1257,6 +1257,14 @@ a.hide-toggle {
     font-style: italic;
 }
 
+button.preset-reset .label.flash-bg {
+    animation: flash-bg 750ms;
+}
+@keyframes flash-bg {
+    0% { background-color: #fff; }
+    100% { background-color: #f6f6f6; }
+}
+
 .preset-list-button .label-inner {
     width: 100%;
     line-height: 1.35em;

modules/ui/entity_editor.js

@@ -1,4 +1,5 @@
 import { dispatch as d3_dispatch } from 'd3-dispatch';
+import { select as d3_select } from 'd3-selection';
 import deepEqual from 'fast-deep-equal';
 
 import { presetManager } from '../presets';
@@ -142,10 +143,10 @@ export function uiEntityEditor(context) {
             if (priorActivePreset && _activePresets.length === 1 && priorActivePreset !== _activePresets[0]) {
                 // flash the button to indicate the preset changed
                 context.container().selectAll('.entity-editor button.preset-reset .label')
-                    .style('background-color', '#fff')
-                    .transition()
-                    .duration(750)
-                    .style('background-color', null);
+                    .classed('flash-bg', true)
+                    .on('animationend', function() {
+                        d3_select(this).classed('flash-bg', false);
+                    });
             }
         }
     }