From 424ad63993d31c857dd964b47ac049ca2749fdde Mon Sep 17 00:00:00 2001
From: Bryan Housel <bryan@mapbox.com>
Date: Fri, 24 Mar 2017 10:02:52 -0400
Subject: [PATCH] Fix rtl for tooltip-illustrations, replace 'done' with next
 icon

---
 css/80_app.css            | 4 ++++
 modules/ui/intro/intro.js | 4 ++--
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/css/80_app.css b/css/80_app.css
index 89cac690b..e2739f364 100644
--- a/css/80_app.css
+++ b/css/80_app.css
@@ -3673,6 +3673,10 @@ img.tile-removing {
     margin-left: -20px;
     margin-top: -10px;
 }
+[dir='rtl'] .tooltip-illustration {
+    margin-left: auto;
+    margin-right: -20px;
+}
 
 .huge-modal-button {
     width: 100%;
diff --git a/modules/ui/intro/intro.js b/modules/ui/intro/intro.js
index cc8122bca..1fd66b087 100644
--- a/modules/ui/intro/intro.js
+++ b/modules/ui/intro/intro.js
@@ -1,5 +1,5 @@
 import * as d3 from 'd3';
-import { t } from '../../util/locale';
+import { t, textDirection } from '../../util/locale';
 import { localNames } from './helper';
 
 import { coreGraph } from '../../core/graph';
@@ -128,7 +128,7 @@ export function uiIntro(context) {
         entered
             .append('span')
             .attr('class', 'status')
-            .text(' - ' + t('intro.done'));
+            .call(svgIcon((textDirection === 'rtl' ? '#icon-backward' : '#icon-forward'), 'inline'));
 
         enter(chapters[0]);