Mephiles / torntools_extension

A browser extension for Torn.com
GNU General Public License v3.0
106 stars 60 forks source link

fix: disable align-left on Cloudflare challenge pages #777

Closed sportshead closed 6 months ago

sportshead commented 6 months ago

Adds an override to features/align-left/ttAlignLeft.css to fix Cloudflare challenge widgets appearing at the top of the page.

Before: cloudflare challenge widget at top

After: cloudflare challenge widget at center

Sashank999 commented 6 months ago

Thanks for bringing this up. I initially thought this was only a behaviour of Chrome DevTools which I use for mobile and tablet layout testing.

The main cause of this is the justify-content: flex-start !important; in ttAlignLeft.css. This caused the challenge box to go out of page when an additional -80px margin is already added by CF. I stick to old methods and I usually avoid using :has() in CSS. A solution for this is to check the document title for the challenge which I implemented in b2f567cd8 .

As a way to reproduce this, you can open Chrome DevTools and turn on mobile layout emulation for iPhone 14 Pro Max. This triggers CF challenge maybe due to a UA string mismatch(my UA is Chrome on Windows unaltered).

This PR will be closed.