diff options
| -rw-r--r-- | static/fluoride.js | 20 | ||||
| -rw-r--r-- | static/style.css | 17 | ||||
| -rw-r--r-- | templates/status.tmpl | 12 |
3 files changed, 21 insertions, 28 deletions
diff --git a/static/fluoride.js b/static/fluoride.js index e055b6d..c1eb06f 100644 --- a/static/fluoride.js +++ b/static/fluoride.js @@ -132,13 +132,13 @@ function isInView(el) { return false; } -function handleReplyToLink(div) { - if (!div) +function handleReplyToLink(a) { + if (!a) return; - var id = div.firstElementChild.getAttribute("href"); + var id = a.getAttribute("href"); if (!id || id[0] != "#") return; - div.firstElementChild.onmouseenter = function(event) { + a.onmouseenter = function(event) { var id = event.target.getAttribute("href"); var status = document.querySelector(id); if (!status) @@ -156,7 +156,7 @@ function handleReplyToLink(div) { event.target.parentElement.appendChild(copy); } } - div.firstElementChild.onmouseleave = function(event) { + a.onmouseleave = function(event) { var popup = document.getElementById("reply-to-popup"); if (popup) { event.target.parentElement.removeChild(popup); @@ -168,8 +168,8 @@ function handleReplyToLink(div) { } } -function handleReplyLink(div) { - div.firstElementChild.onmouseenter = function(event) { +function handleReplyLink(a) { + a.onmouseenter = function(event) { var id = event.target.getAttribute("href"); var status = document.querySelector(id); if (!status) @@ -187,7 +187,7 @@ function handleReplyLink(div) { event.target.parentElement.appendChild(copy); } } - div.firstElementChild.onmouseleave = function(event) { + a.onmouseleave = function(event) { var popup = document.getElementById("reply-popup"); if (popup) { event.target.parentElement.removeChild(popup); @@ -219,10 +219,10 @@ document.addEventListener("DOMContentLoaded", function() { var retweetForm = s.querySelector(".status-retweet"); handleRetweetForm(id, retweetForm); - var replyToLink = s.querySelector(".status-reply-to"); + var replyToLink = s.querySelector(".status-reply-to-link"); handleReplyToLink(replyToLink); - var replyLinks = s.querySelectorAll(".status-reply"); + var replyLinks = s.querySelectorAll(".status-reply-link"); for (var j = 0; j < replyLinks.length; j++) { handleReplyLink(replyLinks[j]); } diff --git a/static/style.css b/static/style.css index 9d4c94c..095b46e 100644 --- a/static/style.css +++ b/static/style.css @@ -41,7 +41,6 @@ max-width: 280px; vertical-align: bottom; object-fit: contain; - margin-bottom: 5px; } .status-media-container { @@ -49,6 +48,11 @@ overflow: auto; } +.status-media-container>a { + margin-bottom: 5px; + display: inline-block; +} + .status-profile-img-container { margin-right: 8px; display: inline-block; @@ -187,16 +191,12 @@ margin-left: 8px; } -.status-reply-to { - display: inline-block; -} - .status-reply-to-link { font-size: 10pt } .status-reply-container { - word-break: break-all; + overflow-wrap: break-word; } .status-reply-container .fa { @@ -209,10 +209,6 @@ font-size: 10pt; } -.status-reply { - display: inline-block; -} - .status-reply-link { font-size: 10pt; } @@ -256,6 +252,7 @@ } .user-profile-decription { + overflow-wrap: break-word; margin: 8px 0; } diff --git a/templates/status.tmpl b/templates/status.tmpl index 432c9a6..4cdb459 100644 --- a/templates/status.tmpl +++ b/templates/status.tmpl @@ -70,19 +70,15 @@ </div> <div class="status-reply-container"> {{if .InReplyToID}} - <div class="status-reply-to"> - <a class="status-reply-to-link" href="{{if not .ShowReplies}}/thread/{{.InReplyToID}}{{end}}#status-{{.InReplyToID}}"> - in reply to {{if .IDNumbers}}#{{index .IDNumbers .InReplyToID}}{{end}} {{if .Pleroma.InReplyToAccountAcct}}@{{.Pleroma.InReplyToAccountAcct}}{{else if not .IDNumbers}}{{.InReplyToID}}{{end}} - </a> - </div> + <a class="status-reply-to-link" href="{{if not .ShowReplies}}/thread/{{.InReplyToID}}{{end}}#status-{{.InReplyToID}}"> + in reply to {{if .IDNumbers}}#{{index .IDNumbers .InReplyToID}}{{end}} {{if .Pleroma.InReplyToAccountAcct}}@{{.Pleroma.InReplyToAccountAcct}}{{else if not .IDNumbers}}{{.InReplyToID}}{{end}} + </a> {{if index .IDReplies .ID}} <span class="status-reply-info-divider"> - </span> {{end}} {{end}} {{if .ShowReplies}} {{if index .IDReplies .ID}} <span class="status-reply-text"> replies: </span> {{end}} {{range index .IDReplies .ID}} - <div class="status-reply"> - <a class="status-reply-link" href="#status-{{.ID}}">#{{.Number}}</a> - </div> + <a class="status-reply-link" href="#status-{{.ID}}">#{{.Number}}</a> {{end}} {{end}} </div> |