From 37b741fc51484bfe64c30259ca203c46abf02bbe Mon Sep 17 00:00:00 2001
From: Candice Pang <Candice.Pang@D2L.com>
Date: Mon, 4 Jan 2021 12:24:59 -0800
Subject: [PATCH 1/2] Enabled immersive nav view to handle RTL

---
 d2l-navigation-immersive.js | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/d2l-navigation-immersive.js b/d2l-navigation-immersive.js
index dc197eb5..25c9d195 100644
--- a/d2l-navigation-immersive.js
+++ b/d2l-navigation-immersive.js
@@ -7,6 +7,7 @@ import './d2l-navigation-link-back.js';
 import { navigationSharedStyle } from './d2l-navigation-shared-styles.js';
 import { dom } from '@polymer/polymer/lib/legacy/polymer.dom.js';
 import { PolymerElement, html } from '@polymer/polymer/polymer-element.js';
+import { mixinBehaviors } from '@polymer/polymer/lib/legacy/class.js';
 
 /**
 `d2l-navigation-immersive`
@@ -14,7 +15,7 @@ Polymer-based web component for the immersive navigation component
 
 @demo demo/navigation-immersive.html
 */
-class D2LNavigationImmsersive extends PolymerElement {
+class D2LNavigationImmsersive extends mixinBehaviors([D2L.PolymerBehaviors.FocusableBehavior], PolymerElement) {
 
 	static get properties() {
 		return {
@@ -118,6 +119,11 @@ class D2LNavigationImmsersive extends PolymerElement {
 				border-right: none;
 			}
 
+			:host(:dir(rtl)) .d2l-navigation-immersive-middle.d2l-navigation-immersive-middle-no-right-border {
+				border-left: none;
+				border-right: 1px solid var(--d2l-color-gypsum);
+			}
+
 			div.d2l-navigation-immersive-middle-observer,
 			div.d2l-navigation-immersive-right-observer {
 				height: auto;

From b4e44dfbd9a22a8cd3b7e4ea34800a5aa8d4efc2 Mon Sep 17 00:00:00 2001
From: Dave Lockhart <dlockhart@users.noreply.github.com>
Date: Mon, 4 Jan 2021 17:00:54 -0500
Subject: [PATCH 2/2] switch to DirMixin

---
 d2l-navigation-immersive.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/d2l-navigation-immersive.js b/d2l-navigation-immersive.js
index 25c9d195..344368a3 100644
--- a/d2l-navigation-immersive.js
+++ b/d2l-navigation-immersive.js
@@ -7,7 +7,7 @@ import './d2l-navigation-link-back.js';
 import { navigationSharedStyle } from './d2l-navigation-shared-styles.js';
 import { dom } from '@polymer/polymer/lib/legacy/polymer.dom.js';
 import { PolymerElement, html } from '@polymer/polymer/polymer-element.js';
-import { mixinBehaviors } from '@polymer/polymer/lib/legacy/class.js';
+import { DirMixin } from '@polymer/polymer/lib/mixins/dir-mixin.js';
 
 /**
 `d2l-navigation-immersive`
@@ -15,7 +15,7 @@ Polymer-based web component for the immersive navigation component
 
 @demo demo/navigation-immersive.html
 */
-class D2LNavigationImmsersive extends mixinBehaviors([D2L.PolymerBehaviors.FocusableBehavior], PolymerElement) {
+class D2LNavigationImmsersive extends DirMixin(PolymerElement) {
 
 	static get properties() {
 		return {