Bugs and Suggestions for Metabunk.org

Bug: Image scaling in replies

In https://www.metabunk.org/threads/russia-and-ukraine-current-events.12289/post-271506
The images in my reply are not scaled to fit the panel, but in the post I'm responding to they are. I think the two should have the same behaviour (and find scaled preferable).

Mendel's HTML and my HTML for the <table> that contains the images are *identical*, so it doesn't seem to be a problem with what's generated, so I guess it's a CSS selector issue where we differ. I can sniff more...
yeah, it's when the table is nested in a quote that the scaling fails.
I generally manually scale back attachments to thumbnail size when I quote.
 
yeah, it's when the table is nested in a quote that the scaling fails.
I generally manually scale back attachments to thumbnail size when I quote.
I might just take the approach of trimming out images when replying unless absolutely necessary, which would be very rare.
I did have a quick sniff around at the CSS, didn't find anything obvious, and then I got more invasive (removing classes from the tags to try to make the contexts more similar) and crashed my browser!
 
I'm dyslexic so readability is always a top priority for me. Some of these threads are very long and difficult to extract key data from without scanning back and forth over multiple pages. Is it possible to have an (optional) side bar to a thread that keeps key information, such as dates, locations, names, times, etc always visible? It might also reduce the amount of repetition.
 
Thus website is extremely slow. U usually go and do something else when a page us loading. Like browse another website...
 
Well, I am having that problem right now, and it is confined to Metabunk
I have had occasional episodes of slow - very slow - response from Metabunk. Usually clears in a few minutes. Also the same issue with other sites. Not occurring often or long enough duration to cause frustration. I've never attempted to try monitoring/data collection or any of the network tools to see if I can trace the blockage.
 
Yes. It works better.

Pull up, or install, web developer tools that let you inspect the network activity involved in a page load. Which parts are stalling or slow?
Xscreenshot.4.png
 
Last edited:
@FatPhil I am on android
ouch. you interact with mb on your phone? you should have added that pertinent data in our original comment to @Mick West to give him some idea of what he needs to check.

add: if you browse other websites while waiting for a load...doesnt that make the load go slower? (i dont browse the web on my phone, so i'm wondering)
 
I'm mostly on Android; no probs here. I wouldn't even have time to open a new tab before the metabunk page came up.
 
Loaded instantly. And I actually have pretty terrible internet right now.
Probably because they were cached. I use Cloudflare which generally speeds things up. If people are having issues, I normally suggest flushing the cache, clearing cookies, and trying another browser.
 
When there are images in posts, and those posts happen to be scrolled to a position such that the Home/Forums/... floating menu bar is "on top" of those images, clicking on the menu sends the click to the image instead, as if the image was above the menu, despite being rendered behind it.

E.g. here I clicked on "what's new" whilst the inspetor was enabled (alas the screenshot tool unrenders the cursor, so you can't verify that), and it activated the image element behind the menu item instead.

There seems to be an easy fix - the style for the .file--linked element includes "z-index: 100", which both seems to explain the annoying "on top" behaviour, and also, when disabled, makes the problem go away. I can't imagine why any diddling with z-indexes should be needed at all, so perhaps it can just be culled?
Xscreenshot.9.png


Edit - I'd note that this bug is particularly annoying when the <A> element has nothing visible inside its bounding box, because all the visible bits have scrolled out of sight - in which case you don't even know that you might be clicking on something that's not the menu.
 
Suggestion: in long threads it can be difficult to find the beginning of each particular claim or piece of evidence. But each individual comment is identified by number. Could that number be appended to quotations, or perhaps to a summary table of points raised during a discussion? I know, there's an up-arrow to the sources to which a reply is made, but sometimes that's a long, long chain to find the initial claim.
 
your screenshot shows an attachment to a post that is not referenced in the post
(scroll up from https://www.metabunk.org/posts/281472/ )
If the two attachments my browser shows as part of the post above the one you reference are not supposed to be there, that's another bug.
This is clearly in the page source I've been sent by the server:

<section class="message-attachments">
<h4 class="block-textHeader">Attachments</h4>
<ul class="attachmentList">
<li class="file file--linked">
<a class="u-anchorTarget" id="attachment-51538"></a>
<a class="file-preview" href="/attachments/imrs-webp.51538/" target="_blank">
<span class="file-typeIcon">
<i class="fa--xf far fa-file" aria-hidden="true"></i>
</span>
</a>
<div class="file-content">
<div class="file-info">
<span class="file-name" title="imrs.webp">imrs.webp</span>
<div class="file-meta">
23.4 KB
&middot; Views: 166
</div>
</div>
</div>
</li>
<li class="file file--linked">
<a class="u-anchorTarget" id="attachment-51539"></a>
<a class="file-preview" href="/attachments/imrs-1-webp.51539/" target="_blank">
<span class="file-typeIcon">
<i class="fa--xf far fa-file" aria-hidden="true"></i>
</span>
</a>
<div class="file-content">
<div class="file-info">
<span class="file-name" title="imrs-1.webp">imrs-1.webp</span>
<div class="file-meta">
198.7 KB
&middot; Views: 167
</div>
</div>
</div>
</li>
</ul>
</section>

Which kinda implies the things I see are intended to be there.

can't reproduce, works as intended (Android, Samsung Internet)
Does it still work if the CSS is amended as suggested so that it also works for me?
 
If the two attachments my browser shows as part of the post above the one you reference are not supposed to be there, that's another bug.
They are supposed to be there, but I found your description ("When there are images in posts") ambiguous and misleading, so I clarified it. "when there are files attached to posts" would be another accurate way to describe it.

I'm not set up to edit my css here.
 
E.g. here I clicked on "what's new" whilst the inspetor was enabled (alas the screenshot tool unrenders the cursor, so you can't verify that), and it activated the image element behind the menu item instead.

There seems to be an easy fix - the style for the .file--linked element includes "z-index: 100", which both seems to explain the annoying "on top" behaviour, and also, when disabled, makes the problem go away. I can't imagine why any diddling with z-indexes should be needed at all, so perhaps it can just be culled?
I can reproduce it (you have to scroll so the text link for the attachment is under the menu bar, not just the attachment image).

(Notes mostly for my reference)
The CSS is generated in Xenforo via attachments.less, lines 224 and 362
JavaScript:
    .file--linked &:after
    {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: @zIndex-1;
    }

Deleting that line 362 does indeed seem to fix it, and I don't see any obvious side effects. That's the only place zIndex is used in that template, so perhaps it's just a bit of leftover (cut-and-paste) code. I also deleted line 224

So, should be fixed. Hopefully did not break anything.
 
VERIFIED

Thanks Mick!

Argh - spoke too soon. Now I'm unable to click on the <a> that precedes the .file-content <div>, as the <div> steals the click. Presumably that's why the <a> was pushed up in the Z stack. To be honest, the .file-content <div> seems to have no right to have the all-smothering box that it does, as all it contains it the .file-info <div>, which has a much more sensible bounding box. However, it's 2am, and I'm not in CSS diagnosing mode presently.

<table>s were better...
 
Sure. I'm wondering, can the <div> not just be moved inside the <a>? If you want clicking on the region that the div takes up to activate the a instead, why not have it as part of the a?
I didn't program it, so after breaking it once, I think I'll just leave it alone.
 
There's a subforum called "Elections" whose description is "investigating and debunking disinformation regarding the 2020 US elections.

Screen Shot 2022-10-27 at 18.43.10.png


Is that description a bit out of date now? Could it be expanded to other US elections or elections in general? Or maybe even politics?
 
Back
Top