Bug 1285528 - [RTL] Collapse/Expand pane button is not properly displayed. r=ntim
authorgasolin <gasolin@gmail.com>
Tue, 26 Jul 2016 16:22:30 +0800
changeset 306859 f5875c1a1fbdb09f7bd586ef9cde06afec36a1ea
parent 306858 80206c1833893617b0413beb27fa85415701603d
child 306860 7771811dec587c7bba6c92061a7046772524cb90
push id20137
push userryanvm@gmail.com
push dateThu, 28 Jul 2016 02:20:00 +0000
treeherderfx-team@f5875c1a1fbd [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersntim
bugs1285528
milestone50.0a1
Bug 1285528 - [RTL] Collapse/Expand pane button is not properly displayed. r=ntim MozReview-Commit-ID: KITju7vmqW6
devtools/client/shared/components/sidebar-toggle.css
--- a/devtools/client/shared/components/sidebar-toggle.css
+++ b/devtools/client/shared/components/sidebar-toggle.css
@@ -2,23 +2,31 @@
 /* This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 .sidebar-toggle {
   display: block;
 }
 
-.sidebar-toggle::before {
+.sidebar-toggle:-moz-locale-dir(ltr)::before,
+.sidebar-toggle.pane-collapsed:-moz-locale-dir(rtl)::before {
   background-image: var(--theme-pane-collapse-image);
 }
 
-.sidebar-toggle.pane-collapsed::before {
+.sidebar-toggle.pane-collapsed:-moz-locale-dir(ltr)::before,
+.sidebar-toggle:-moz-locale-dir(rtl)::before {
   background-image: var(--theme-pane-expand-image);
 }
 
 /* Rotate button icon 90deg if the toolbox container is
   in vertical mode (sidebar displayed under the main panel) */
 @media (max-width: 700px) {
-  .sidebar-toggle::before {
+  .sidebar-toggle:-moz-locale-dir(ltr)::before {
     transform: rotate(90deg);
   }
+
+  /* Since RTL swaps the used images, we need to flip them
+     the other way round */
+  .sidebar-toggle:-moz-locale-dir(rtl)::before {
+    transform: rotate(-90deg);
+  }
 }