fix(rtl): updates searchbar, fab and toggle icon positioning in rtl (#…

…18325)

- fixes tab badge (in Chrome)
- fixes searchbar buttons
- fixes fab positioning
- fixes toggle

references #17012

core/src/themes/ionic.functions.string.scss

@@ -93,6 +93,7 @@
 // --> :host-context([dir=rtl])
 //
 // @include add-root-selector("[dir=rtl]", ":host(.fixed)")
+// --> :host-context([dir=rtl]):host(.fixed)
 // --> :host-context([dir=rtl]).fixed
 //
 // @include add-root-selector("[dir=rtl]", ":host(.tab-layout-icon-hide) ::slotted(ion-badge)")
@@ -112,6 +113,9 @@
     // If the selector contains :host( it means it is targeting a class on the host
     // element so we need to change how we target it
     @if str-contains($selector, ":host(") {
+      $shadow-element: str-replace($selector, ":host(", ":host-context(#{$addHostSelector}):host(");
+      $list: append($list, $shadow-element, comma);
+
       $new-element: ();
       $elements: str-split($selector, " ");
 

core/src/themes/ionic.mixins.scss

@@ -286,6 +286,9 @@
       right: $end;
     }
     @include rtl() {
+      left: unset;
+      right: unset;
+
       left: $end;
       right: $start;
     }