Bug 1340206 - Disable transform to avoid blurry RTL URL bar. r=Gijs
authorJ. Ryan Stinnett <jryans@gmail.com>
Fri, 24 Feb 2017 19:10:33 -0600
changeset 374566 42ddfa8072f309be87065547b6525c515fd14e30
parent 374565 f7b0f3b271228e2f33e0f6ce641060862012f07d
child 374567 d64711bdb426e8dda8a2a0f54f17e410290c451e
push id10863
push userjlorenzo@mozilla.com
push dateMon, 06 Mar 2017 23:02:23 +0000
treeherdermozilla-aurora@0931190cd725 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersGijs
bugs1340206
milestone54.0a1
Bug 1340206 - Disable transform to avoid blurry RTL URL bar. r=Gijs With Compact Themes and RTL locales, the URL bar becomes blurry on hover. This seems to be triggered by the combination: ``` transform: scaleX(-1); clip-path: none; ``` The transform is was only applied to position the clip-path correctly, so it's actually not needed by Compact Themes. MozReview-Commit-ID: KKQt6h6VzT7
browser/themes/shared/compacttheme.inc.css
--- a/browser/themes/shared/compacttheme.inc.css
+++ b/browser/themes/shared/compacttheme.inc.css
@@ -207,16 +207,25 @@ toolbar[brighttext] #downloads-indicator
 }
 
 window:not([chromehidden~="toolbar"]) #urlbar-wrapper {
   overflow: -moz-hidden-unscrollable;
   clip-path: none;
   margin-inline-start: 0;
 }
 
+window:not([chromehidden~="toolbar"]) #urlbar-wrapper:-moz-locale-dir(rtl),
+window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar:-moz-locale-dir(rtl) {
+  /* Resolves text blurring issue when hovering, see bug 1340206 */
+  transform: none;
+  /* For some reason, this property must be specified here, even though the same
+     value is set in the previous rule set. o_O */
+  margin-inline-start: 0;
+}
+
 #urlbar-zoom-button:-moz-lwtheme-brighttext:hover {
   background-color: rgba(255,255,255,.2);
 }
 
 #urlbar-zoom-button:-moz-lwtheme-brighttext:hover:active {
   background-color: rgba(255,255,255,.3);
 }