From 4ed51cf9f190d5007023b17b0775f63e1057bb59 Mon Sep 17 00:00:00 2001 From: Akhil Kumar Achanta <71771166+ZeusCraft10@users.noreply.github.com> Date: Sun, 31 Aug 2025 14:18:21 -0400 Subject: [PATCH] Fix: Remove incorrect CSS transforms from warning banner This commit resolves a visual bug where the warning banner displayed next to unsafe links on search engine results pages was rendered incorrectly, making the text unreadable. **The Problem:** The warning banner element had CSS `transform` properties that combined `rotate(180deg)` and `scaleX(-1)`. This combination resulted in the banner being flipped both vertically and horizontally, effectively mirroring the text and turning it upside down. **The Solution:** The fix removes the unnecessary and incorrect `transform`, `WebkitTransform`, and `msTransform` properties from the banner's inline styles in `src/js/content.js`. The banner's positioning and appearance are handled by other CSS properties, and these transformations were not needed for its intended function. By removing these lines, the warning banner now displays correctly with legible text, improving the user experience and ensuring the warning is clearly communicated. Closes #49 --- src/js/content.js | 3 --- 1 file changed, 3 deletions(-) diff --git a/src/js/content.js b/src/js/content.js index e84f455..7c9461c 100644 --- a/src/js/content.js +++ b/src/js/content.js @@ -538,9 +538,6 @@ function addWarningBanner(link) { borderRadius: "4px", fontSize: "12px", display: "inline-block", - transform: "rotate(180deg) scaleX(-1) !important", - WebkitTransform: "rotate(180deg) scaleX(-1) !important", - msTransform: "rotate(180deg) scaleX(-1) !important", position: "relative", zIndex: "9999" });