diff --git a/src/engine/entities/FunctionBox.ts b/src/engine/entities/FunctionBox.ts
index b7015f2..e51eb2b 100644
--- a/src/engine/entities/FunctionBox.ts
+++ b/src/engine/entities/FunctionBox.ts
@@ -1,4 +1,10 @@
-import { IMAGES, SPRITE_SPECS, SpriteSpec, Sprites } from "../config";
+import {
+  IMAGES,
+  Miscellaneous,
+  SPRITE_SPECS,
+  SpriteSpec,
+  Sprites,
+} from "../config";
 import { Entity, EntityNames } from ".";
 import {
   BoundingBox,
@@ -77,7 +83,14 @@ export class FunctionBox extends Entity {
         return;
       }
       modalOpen = true;
-      openModal(this.code);
+      openModal(
+        `<div style="text-align:center"><p>${this.code}</p> <br> <button id="close">Close</button></div>`,
+      );
+
+      document.getElementById("close")!.addEventListener("click", () => {
+        closeModal();
+        document.getElementById(Miscellaneous.CANVAS_ID)!.focus();
+      });
     };
 
     this.addComponent(new Interactable(interaction));
diff --git a/src/typeshims/rainbowbrackets.d.ts b/src/typeshims/rainbowbrackets.d.ts
new file mode 100644
index 0000000..ac9a2ff
--- /dev/null
+++ b/src/typeshims/rainbowbrackets.d.ts
@@ -0,0 +1 @@
+declare module 'rainbowbrackets';