From 2c30f66c11645040fb1316aa287a6245e8c680ec Mon Sep 17 00:00:00 2001
From: chrisgarrity <chrisg@media.mit.edu>
Date: Wed, 1 Aug 2018 12:05:46 -0400
Subject: [PATCH] RTL tabs
Correct margins for tabs, tab icons.
---
src/components/gui/gui.css | 29 +++++++++++++++++++++++++----
1 file changed, 25 insertions(+), 4 deletions(-)
diff --git a/src/components/gui/gui.css b/src/components/gui/gui.css
index 7747f4c6a..87b75b837 100644
--- a/src/components/gui/gui.css
+++ b/src/components/gui/gui.css
@@ -63,7 +63,6 @@
flex-grow: 1;
height: 80%;
margin-bottom: 0;
- margin-left: -0.5rem;
border-radius: 1rem 1rem 0 0;
border: 1px solid $ui-black-transparent;
@@ -82,9 +81,24 @@
white-space: nowrap;
}
+[dir="ltr"] .tab {
+ margin-left: -0.5rem;
+}
+
+[dir="rtl"] .tab {
+ margin-right: -0.5rem;
+}
+
+[dir="ltr"] .tab:nth-of-type(1) {
+ margin-left: 0;
+}
+
+[dir="rtl"] .tab:nth-of-type(1) {
+ margin-right: 0;
+}
+
/* Use z-indices to force left-on-top for tabs */
.tab:nth-of-type(1) {
- margin-left: 0;
z-index: 3;
}
.tab:nth-of-type(2) {
@@ -106,11 +120,18 @@
}
.tab img {
- margin-right: 0.125rem;
width: 1.375rem;
filter: grayscale(100%);
}
+[dir="ltr"] .tab img {
+ margin-right: 0.125rem;
+}
+
+[dir="rtl"] .tab img {
+ margin-left: 0.125rem;
+}
+
.tab.is-selected img {
filter: none;
}
@@ -191,7 +212,7 @@
padding-right: $space;
min-height: 0; /* this makes it work in Firefox */
-
+
/*
For making the sprite-selector a scrollable pane
@todo: Not working in Safari
--
GitLab