From ccdb5ef051bfcc9e96f4b0ce98a32735eb48d1c4 Mon Sep 17 00:00:00 2001 From: r Date: Tue, 14 Apr 2020 09:32:53 +0000 Subject: [PATCH] Fix UI issues - Increase media preview size - Fix z-index of more-actions poup - Add left and top position for reply hover popup --- static/fluoride.js | 10 ++++++++++ static/style.css | 9 +++++---- 2 files changed, 15 insertions(+), 4 deletions(-) diff --git a/static/fluoride.js b/static/fluoride.js index 0ee3f30..700d980 100644 --- a/static/fluoride.js +++ b/static/fluoride.js @@ -134,6 +134,11 @@ function handleReplyToLink(div) { } else { var copy = status.cloneNode(true); copy.id = "reply-to-popup"; + var ract = event.target.getBoundingClientRect(); + if (ract.top > window.innerHeight / 2) { + copy.style.bottom = (window.innerHeight - + window.scrollY - ract.top) + 'px'; + } event.target.parentElement.appendChild(copy); } } @@ -161,6 +166,11 @@ function handleReplyLink(div) { } else { var copy = status.cloneNode(true); copy.id = "reply-popup"; + var ract = event.target.getBoundingClientRect(); + if (ract.left > window.innerWidth / 2) { + copy.style.right = (window.innerWidth - + ract.right - 12) + 'px';; + } event.target.parentElement.appendChild(copy); } } diff --git a/static/style.css b/static/style.css index 2a1b6bb..838a3c4 100644 --- a/static/style.css +++ b/static/style.css @@ -30,8 +30,8 @@ .status-content img, .status-image, .status-video { - max-height: 180px; - max-width: 220px; + max-height: 240px; + max-width: 280px; width: auto; vertical-align: bottom; } @@ -413,7 +413,7 @@ a:hover, border: 1px solid #aaaaaa; padding: 4px 8px; z-index: 3; - margin: 0 8px 0 8px; + margin: 0; } #reply-to-popup { @@ -422,7 +422,7 @@ a:hover, border: 1px solid #aaaaaa; padding: 4px 8px; z-index: 3; - margin: 0 8px 0 8px; + margin: 0; } .search-form { @@ -432,6 +432,7 @@ a:hover, .more-container { position: relative; display: inline-block; + z-index: 1; } .more-content {