alyssa
/
bloat
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Fix UI issues 

- Increase media preview size
- Fix z-index of more-actions poup
- Add left and top position for reply hover popup
This commit is contained in:
r 2020-04-14 09:32:53 +00:00
parent 402c976ec8
commit ccdb5ef051
2 changed files with 15 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
static/fluoride.js
View File

@ -134,6 +134,11 @@ function handleReplyToLink(div) {
} else { } else {
var copy = status.cloneNode(true); var copy = status.cloneNode(true);
copy.id = "reply-to-popup"; 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); event.target.parentElement.appendChild(copy);
} }
} }
@ -161,6 +166,11 @@ function handleReplyLink(div) {
} else { } else {
var copy = status.cloneNode(true); var copy = status.cloneNode(true);
copy.id = "reply-popup"; 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); event.target.parentElement.appendChild(copy);
} }
} }

9
static/style.css
View File

@ -30,8 +30,8 @@
.status-content img, .status-content img,
.status-image, .status-image,
.status-video { .status-video {
max-height: 180px; max-height: 240px;
max-width: 220px; max-width: 280px;
width: auto; width: auto;
vertical-align: bottom; vertical-align: bottom;
} }
@ -413,7 +413,7 @@ a:hover,
border: 1px solid #aaaaaa; border: 1px solid #aaaaaa;
padding: 4px 8px; padding: 4px 8px;
z-index: 3; z-index: 3;
margin: 0 8px 0 8px; margin: 0;
} }
#reply-to-popup { #reply-to-popup {
@ -422,7 +422,7 @@ a:hover,
border: 1px solid #aaaaaa; border: 1px solid #aaaaaa;
padding: 4px 8px; padding: 4px 8px;
z-index: 3; z-index: 3;
margin: 0 8px 0 8px; margin: 0;
} }
.search-form { .search-form {
@ -432,6 +432,7 @@ a:hover,
.more-container { .more-container {
position: relative; position: relative;
display: inline-block; display: inline-block;
z-index: 1;
} }
.more-content { .more-content {