diff --git a/src/snek/templates/web.html b/src/snek/templates/web.html
index 1046d2e..a862d21 100644
--- a/src/snek/templates/web.html
+++ b/src/snek/templates/web.html
@@ -314,6 +314,36 @@
}
});
+ messagesContainer.addEventListener('click', (e) => {
+ if(e.target.tagName != 'IMG')
+ return
+ const img = e.target
+ const overlay = document.createElement('div');
+ overlay.style.position = 'fixed';
+ overlay.style.top = 0;
+ overlay.style.left = 0;
+ overlay.style.width = '100%';
+ overlay.style.height = '100%';
+ overlay.style.backgroundColor = 'rgba(0,0,0,0.9)';
+ overlay.style.display = 'flex';
+ overlay.style.justifyContent = 'center';
+ overlay.style.alignItems = 'center';
+ overlay.style.zIndex = 9999;
+
+ const fullImg = document.createElement('img');
+ fullImg.src = img.src;
+ fullImg.alt = img.alt;
+ fullImg.style.maxWidth = '90%';
+ fullImg.style.maxHeight = '90%';
+
+ overlay.appendChild(fullImg);
+
+ document.body.appendChild(overlay);
+
+ overlay.addEventListener('click', () => {
+ document.body.removeChild(overlay);
+ });
+ });
initInputField(getInputField());
updateLayout(true);