Defocus buttons after pressing

Fixes #89.

package.json

@@ -1,6 +1,6 @@
 {
     "name": "minesweeper",
-    "version": "0.81.5",
+    "version": "0.81.6",
     "description": "Just Minesweeper!",
     "author": "Felix W. Dekker",
     "browser": "dist/bundle.js",

src/main/css/main.css

@@ -7,11 +7,7 @@ form {
     display: inline;
 }
 
-form button:focus:not(:hover) {
+form button.cancel {
-    background-color: var(--fwdekker-theme-color);
-}
-
-form button.cancel, form button.cancel:focus, form button.cancel:hover {
     background-color: #606c76;
     border-color: #606c76;
 }

src/main/js/Common.ts

@@ -20,6 +20,14 @@ export function shuffleArrayInPlace(array: any[], seed: number): any[] {
     return array;
 }
 
+/**
+ * Blurs the currently active element, if possible.
+ */
+export function blurActiveElement(): void {
+    // @ts-ignore
+    document.activeElement?.blur?.();
+}
+
 /**
  * Slices `array` into chunks of `chunkSize` elements each.
  *

src/main/js/Game.ts

@@ -2,7 +2,7 @@
 import {$} from "@fwdekker/template";
 // @ts-ignore
 import alea from "alea";
-import {stringToHash} from "./Common";
+import {blurActiveElement, stringToHash} from "./Common";
 import {customDifficulty, defaultDifficulty, difficulties} from "./Difficulty";
 import {BasicIconFont, Display, ForkAwesomeFont} from "./Display";
 import {Field} from "./Field";
@@ -140,6 +140,7 @@ export class Game {
                 event.preventDefault();
 
                 this.initNewField(this.field?.width, this.field?.height, this.field?.mineCount, this.field?.isSolvable);
+                blurActiveElement();
             }
         );
 
@@ -151,6 +152,7 @@ export class Game {
                 event.preventDefault();
 
                 this.field?.undo();  // Undoes all
+                blurActiveElement();
             }
         );
 
@@ -190,6 +192,7 @@ export class Game {
                 event.preventDefault();
 
                 this.field?.undo(1);
+                blurActiveElement();
             }
         );
 
@@ -201,6 +204,7 @@ export class Game {
                 event.preventDefault();
 
                 this.field?.redo(1);
+                blurActiveElement();
             }
         );
 
@@ -215,6 +219,7 @@ export class Game {
                     this.statistics.hintsRequested++;
                     this.display.hintSquare = (new Solver()).getHint(this.field);
                 }
+                blurActiveElement();
             }
         );
 
@@ -229,6 +234,7 @@ export class Game {
                     this.statistics.solverUsages++;
                     (new Solver()).solve(this.field);
                 }
+                blurActiveElement();
             }
         );
 
@@ -242,6 +248,7 @@ export class Game {
 
                 this.enableMarksInput.checked = preferences.marksEnabled;
                 this.preferencesOverlay.show();
+                blurActiveElement();
             }
         );
         this.preferencesOverlay = new Overlay(
@@ -260,6 +267,7 @@ export class Game {
                 event.preventDefault();
 
                 this.statisticsOverlay.show();
+                blurActiveElement();
             }
         );
         this.statisticsOverlay = new Overlay(

src/main/js/UI.ts

@@ -1,3 +1,6 @@
+import {blurActiveElement} from "./Common";
+
+
 /**
  * An overlay displayed in HTML.
  */
@@ -72,6 +75,7 @@ export class Overlay {
      */
     hide(): void {
         this.overlay.style.visibility = "hidden";
+        blurActiveElement();
     }
 
     /**