From 1d5987a13e749ddf29c2304a1e11672023061737 Mon Sep 17 00:00:00 2001
From: Ivo Valkov <ivos.valkov@gmail.com>
Date: Fri, 21 Apr 2023 16:18:47 +0300
Subject: [PATCH] fix(actionsheet): incorrect positioning in rtl mode

---
 packages/default/scss/action-sheet/_layout.scss | 13 +++++++++++--
 packages/fluent/scss/action-sheet/_layout.scss  | 13 +++++++++++--
 2 files changed, 22 insertions(+), 4 deletions(-)

diff --git a/packages/default/scss/action-sheet/_layout.scss b/packages/default/scss/action-sheet/_layout.scss
index a960f466988..cf4570f3291 100644
--- a/packages/default/scss/action-sheet/_layout.scss
+++ b/packages/default/scss/action-sheet/_layout.scss
@@ -189,7 +189,7 @@
         border-width: if( $kendo-actionsheet-border-width, $kendo-actionsheet-border-width, null );
         border-top-width: if( $kendo-actionsheet-border-width, 0, null );
         top: 0;
-        left: 50%;
+        inset-inline-start: 50%;
         transform: translateX( -50% );
     }
     .k-actionsheet-bottom {
@@ -197,7 +197,7 @@
         border-width: if( $kendo-actionsheet-border-width, $kendo-actionsheet-border-width, null );
         border-bottom-width: if( $kendo-actionsheet-border-width, 0, null );
         bottom: 0;
-        left: 50%;
+        inset-inline-start: 50%;
         transform: translateX( -50% );
     }
     .k-actionsheet-left {
@@ -356,6 +356,15 @@
         }
     }
 
+    // RTL
+    .k-rtl,
+    [dir="rtl"] {
+        .k-actionsheet-top,
+        .k-actionsheet-bottom {
+            transform: translateX( 50% );
+        }
+    }
+
 }
 
 
diff --git a/packages/fluent/scss/action-sheet/_layout.scss b/packages/fluent/scss/action-sheet/_layout.scss
index cc07fa356e3..3c747b08417 100644
--- a/packages/fluent/scss/action-sheet/_layout.scss
+++ b/packages/fluent/scss/action-sheet/_layout.scss
@@ -218,7 +218,7 @@
         border-width: var( --kendo-actionsheet-border-width, #{$kendo-actionsheet-border-width} );
         border-top-width: 0;
         top: 0;
-        left: 50%;
+        inset-inline-start: 50%;
         transform: translateX( -50% );
     }
 
@@ -227,7 +227,7 @@
         border-width: var( --kendo-actionsheet-border-width, #{$kendo-actionsheet-border-width} );
         border-bottom-width: 0;
         bottom: 0;
-        left: 50%;
+        inset-inline-start: 50%;
         transform: translateX( -50% );
     }
 
@@ -363,6 +363,15 @@
             flex-flow: column nowrap;
         }
     }
+
+    // RTL
+    .k-rtl,
+    [dir="rtl"] {
+        .k-actionsheet-top,
+        .k-actionsheet-bottom {
+            transform: translateX( 50% );
+        }
+    }
 }
 
 @mixin kendo-action-sheet--layout-jq() {