diff --git a/web/css/main.css b/web/css/main.css
index 0c6c476b..1aaeb592 100644
--- a/web/css/main.css
+++ b/web/css/main.css
@@ -49,7 +49,6 @@ body {
#help-overlay {
width: 100%;
height: 100%;
- display: none;
position: absolute;
top: 0;
}
@@ -66,7 +65,6 @@ body {
#help-overlay-detail {
width: 100%;
height: 100%;
- display: block;
position: absolute;
background-image: url('/static/img/help_overlay.png');
diff --git a/web/css/ui.css b/web/css/ui.css
index 4f385b4f..8c806fca 100644
--- a/web/css/ui.css
+++ b/web/css/ui.css
@@ -1,6 +1,6 @@
.hidden {
- display: none;
+ visibility: hidden;
}
.modal-window {
diff --git a/web/index.html b/web/index.html
index 60daf856..0a4e5cd4 100644
--- a/web/index.html
+++ b/web/index.html
@@ -84,9 +84,9 @@
Oh my god
-
-
-
+
{{if .Recording.Enabled}}
diff --git a/web/js/controller.js b/web/js/controller.js
index e4b70086..bed12db7 100644
--- a/web/js/controller.js
+++ b/web/js/controller.js
@@ -97,7 +97,8 @@
gui.toggle(keyButtons[KEY.SAVE], show || isGameScreen);
gui.toggle(keyButtons[KEY.LOAD], show || isGameScreen);
- gui.toggle(helpOverlay, show);
+ gui.toggle(helpOverlay, show)
+ Array.from(helpOverlay.children).forEach((node) => gui.toggle(node, show))
this.shown = show;
diff --git a/web/js/gui/gui.js b/web/js/gui/gui.js
index e1d8c0c9..361fe72b 100644
--- a/web/js/gui/gui.js
+++ b/web/js/gui/gui.js
@@ -141,11 +141,11 @@ const gui = (() => {
}
const show = (el) => {
- el.style.removeProperty('visibility');
+ el.classList.remove('hidden');
}
const hide = (el) => {
- el.style.visibility = 'hidden';
+ el.classList.add('hidden');
}
const toggle = (el, what) => {