Fix bootstrap utility classes on RTL layourt

1 files changed, 175 insertions, 0 deletions

diff --git a/client/src/sass/class-helpers/_custom-bootstrap-helpers.scss b/client/src/sass/class-helpers/_custom-bootstrap-helpers.scss
index b39c4144f..0ecad14f9 100644
--- a/client/src/sass/class-helpers/_custom-bootstrap-helpers.scss
+++ b/client/src/sass/class-helpers/_custom-bootstrap-helpers.scss
@@ -10,3 +10,178 @@
 .fs-7 {
   @include font-size(14px);
 }
+
+// Handle dynamically RTL layouts
+
+.text-start {
+  text-align: start !important;
+}
+
+.text-end {
+  text-align: end !important;
+}
+
+// ---
+
+
+.ms-0 {
+  @include margin-left(0 !important);
+
+  margin-left: inherit !important;
+}
+
+.ms-1 {
+  @include margin-left(0.25rem !important);
+
+  margin-left: inherit !important;
+}
+
+.ms-2 {
+  @include margin-left(0.5rem !important);
+
+  margin-left: inherit !important;
+}
+
+.ms-3 {
+  @include margin-left(1rem !important);
+
+  margin-left: inherit !important;
+}
+
+.ms-4 {
+  @include margin-left(1.5rem !important);
+
+  margin-left: inherit !important;
+}
+
+.ms-5 {
+  @include margin-left(3rem !important);
+
+  margin-left: inherit !important;
+}
+
+.ms-auto {
+  @include margin-left(auto !important);
+
+  margin-left: inherit !important;
+}
+
+// ---
+
+.me-0 {
+  @include margin-right(0 !important);
+
+  margin-right: inherit !important;
+}
+
+.me-1 {
+  @include margin-right(0.25rem !important);
+
+  margin-right: inherit !important;
+}
+
+.me-2 {
+  @include margin-right(0.5rem !important);
+
+  margin-right: inherit !important;
+}
+
+.me-3 {
+  @include margin-right(1rem !important);
+
+  margin-right: inherit !important;
+}
+
+.me-4 {
+  @include margin-right(1.5rem !important);
+
+  margin-right: inherit !important;
+}
+
+.me-5 {
+  @include margin-right(3rem !important);
+
+  margin-right: inherit !important;
+}
+
+.me-auto {
+  @include margin-right(auto !important);
+
+  margin-right: inherit !important;
+}
+
+// ---
+
+.ps-0 {
+  @include padding-left(0 !important);
+
+  padding-left: inherit !important;
+}
+
+.ps-1 {
+  @include padding-left(0.25rem !important);
+
+  padding-left: inherit !important;
+}
+
+.ps-2 {
+  @include padding-left(0.5rem !important);
+
+  padding-left: inherit !important;
+}
+
+.ps-3 {
+  @include padding-left(1rem !important);
+
+  padding-left: inherit !important;
+}
+
+.ps-4 {
+  @include padding-left(1.5rem !important);
+
+  padding-left: inherit !important;
+}
+
+.ps-5 {
+  @include padding-left(3rem !important);
+
+  padding-left: inherit !important;
+}
+
+// ---
+
+.pe-0 {
+  @include padding-right(0 !important);
+
+  padding-right: inherit !important;
+}
+
+.pe-1 {
+  @include padding-right(0.25rem !important);
+
+  padding-right: inherit !important;
+}
+
+.pe-2 {
+  @include padding-right(0.5rem !important);
+
+  padding-right: inherit !important;
+}
+
+.pe-3 {
+  @include padding-right(1rem !important);
+
+  padding-right: inherit !important;
+}
+
+.pe-4 {
+  @include padding-right(1.5rem !important);
+
+  padding-right: inherit !important;
+}
+
+.pe-5 {
+  @include padding-right(3rem !important);
+
+  padding-right: inherit !important;
+}