diff --git a/public/style.css b/public/style.css index f5ea163..0e3d355 100644 --- a/public/style.css +++ b/public/style.css @@ -59,6 +59,8 @@ summary { clear:left; margin-right: 4px; overflow:hidden; + min-width: 3px; + min-height: 38px; } .comment .content { line-height: 20px; @@ -138,7 +140,7 @@ summary { } .comment { font-size: 14px; - margin: 0px 0px 5px 0px; + margin: 0px 0px 10px 0px; border: 1px solid #e6e6e6; border-radius: 3px; padding: 10px 10px 0px 7px; @@ -230,7 +232,7 @@ form.savecomment { margin: 0px 0px 10px 20px; } .comment .children { - margin: 5px 0px 10px 15px; + margin: 5px 0px 5px 15px; } .savecomment textarea { margin: 5px 0px; @@ -280,9 +282,8 @@ form.savecomment { .children .morecomments { } .morecomments { - height: 20px; + height: 15px; clear: left; - margin: 0px 0px 10px 0px; font-size: 10px; } .morecomments a { @@ -500,7 +501,7 @@ form.blockpost { } .expando { display: none; - max-width: 870px; + max-width: 900px; margin-top: 5px; position: relative; color: #000; @@ -551,18 +552,7 @@ form.blockpost { text-align: center; } .expando .image { - display: block; - overflow: hidden; - resize: both; max-width: 578px; - margin: 0 auto; - background-repeat: no-repeat; - background-size: contain; - background-position: top left; -} -.expando .image img { - visibility: hidden; - max-width: 100%; } .expando .md { background-color: #fafafa; @@ -570,7 +560,6 @@ form.blockpost { border-radius: 7px; padding: 5px 10px; margin: 5px auto; - max-width: 578px; font-size: 14px; overflow: auto; } diff --git a/public/utils.js b/public/utils.js index c05cb41..d087cca 100644 --- a/public/utils.js +++ b/public/utils.js @@ -30,8 +30,35 @@ function postClick(e) { if (id = parseYoutube(url)) { targ.getElementsByClassName("embed")[0].innerHTML = youtubeIframe(id) } + // TODO set image handler + var images = bdy.getElementsByTagName('img') + for (var i = 0; i < images.length; i++) { + images[i].onmousedown = function(e) { + e.preventDefault() + startCoordinates = [e.clientX, e.clientY] + startSize = [e.target.height, e.target.width] + resizeTarget = e.target + return false + } + } } } +var resizeTarget +var startCoordinates = [0,0] +var startSize = [0,0] +document.onmousemove = function(e) { + if (resizeTarget) { + resizeTarget.style.maxWidth = 'unset'; + let y = startSize[0] + (e.clientY - startCoordinates[1]) * 1.5 + let x = startSize[1] + (e.clientX - startCoordinates[0]) * 1.5 + let ratio = Math.min(y/startSize[0], x/startSize[1]) + resizeTarget.height = startSize[0]*ratio + resizeTarget.width = startSize[1]*ratio + } +} +document.onmouseup = function(e){ + resizeTarget = false; +} function uptil (el, f) { if (el) return f(el) ? el : uptil(el.parentNode, f) } diff --git a/templates/comment.html b/templates/comment.html index ed7fa61..6ca608c 100644 --- a/templates/comment.html +++ b/templates/comment.html @@ -1,6 +1,6 @@
- - - + + {{ end }}