aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--css/style.css6
-rw-r--r--render.js19
2 files changed, 23 insertions, 2 deletions
diff --git a/css/style.css b/css/style.css
index 1683032..7593324 100644
--- a/css/style.css
+++ b/css/style.css
@@ -231,7 +231,11 @@ form.search {
.profileAvatar { width: 75px; vertical-align: top; border-radius: 5px; object-fit: cover; margin-right: .25em; margin-bottom: .25em;}
.avatar { width: 25px; height: 25px; vertical-align: middle; object-fit: cover; border-radius: 5px; margin-right: .2em; }
-.image { width: 75px; height: 75px; object-fit: cover; margin-right: .2em; border-radius: 5px;}
+.image { width: 75px; height: 75px; object-fit: cover; margin-right: .2em; border-radius: 5px; cursor: pointer;}
+
+#viewer {position: fixed; left: 2em; top: 3em; background: white; padding: .5em; border: 1px solid #ddd; border-radius: 5px;}
+
+#viewer img { border-radius: 5px; margin-left: auto; margin-right: auto; cursor: pointer;}
button {
display: inline-block;
diff --git a/render.js b/render.js
index 5070a5f..d85d04b 100644
--- a/render.js
+++ b/render.js
@@ -105,7 +105,24 @@ function render (msg, keys, preview) {
}
if (nextPost.imaged == msg.key) {
- message.insertBefore(h('img', {src: nextPost.image, classList: 'image'}), message.childNodes[message.childNodes.length - 1])
+
+ var img = h('img', {
+ src: nextPost.image,
+ classList: 'image',
+ onclick: function () {
+ var viewimg = h('div', {id: 'viewer', onclick: function () {
+ var viewer = document.getElementById('viewer')
+ viewer.parentNode.removeChild(viewer)
+ }}, [
+ h('img', {
+ src: nextPost.image
+ })
+ ])
+ document.body.appendChild(viewimg)
+ }
+ })
+
+ message.insertBefore(img, message.childNodes[message.childNodes.length - 1])
}
})
}