feat: add RTL Bootstrap stylesheet support in head.html

Author: zakariaf

_includes/head.html

@@ -73,6 +73,10 @@
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css">
   {% endunless %}
 
+  {% if dir and dir contains 'rtl' %}
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.rtl.min.css" integrity="sha384-MdqCcafa5BLgxBDJ3d/4D292geNL64JyRtSGjEszRUQX9rhL1QkcnId+OT7Yw+D+" crossorigin="anonymous">
+  {% endif %}
+
   <!-- Theme style -->
   <link rel="stylesheet" href="{{ '/assets/css/:THEME.css' | replace: ':THEME', site.theme | relative_url }}">
 

_sass/base/_rtl.scss

@@ -474,108 +474,6 @@ html[dir='rtl'] {
     }
   }
 
-  /* Fix for Bootstrap components */
-  .me-auto {
-    margin-right: 0 !important;
-    margin-left: auto !important;
-  }
-
-  .me-sm-4 {
-    @include bp.sm {
-      margin-right: 0 !important;
-      margin-left: 1.5rem !important;
-    }
-  }
-
-  .ms-1 {
-    margin-left: 0 !important;
-    margin-right: 0.25rem !important;
-  }
-
-  .ms-2 {
-    margin-left: 0 !important;
-    margin-right: 0.5rem !important;
-  }
-
-  .ms-3 {
-    margin-left: 0 !important;
-    margin-right: 1rem !important;
-  }
-
-  .ms-4 {
-    margin-left: 0 !important;
-    margin-right: 1.5rem !important;
-  }
-
-  .ms-lg-0 {
-    @include bp.lg {
-      margin-left: 0 !important;
-      margin-right: 0 !important;
-    }
-  }
-
-  .me-1 {
-    margin-right: 0 !important;
-    margin-left: 0.25rem !important;
-  }
-
-  .me-2 {
-    margin-right: 0 !important;
-    margin-left: 0.5rem !important;
-  }
-
-  .me-3 {
-    margin-right: 0 !important;
-    margin-left: 1rem !important;
-  }
-
-  .pe-1 {
-    padding-right: 0 !important;
-    padding-left: 0.25rem !important;
-  }
-
-  .pe-2 {
-    padding-right: 0 !important;
-    padding-left: 0.5rem !important;
-  }
-
-  .pe-4 {
-    padding-right: 0 !important;
-    padding-left: 1.5rem !important;
-  }
-
-  .ps-0 {
-    padding-left: 0 !important;
-    padding-right: 0 !important;
-  }
-
-  .ps-2 {
-    padding-left: 0 !important;
-    padding-right: 0.5rem !important;
-  }
-
-  .ps-3 {
-    padding-left: 0 !important;
-    padding-right: 1rem !important;
-  }
-
-  .ps-4 {
-    padding-left: 0 !important;
-    padding-right: 1.5rem !important;
-  }
-
-  .ms-auto {
-    margin-left: 0 !important;
-    margin-right: auto !important;
-  }
-
-  .px-md-3 {
-    @include bp.md {
-      padding-right: 1rem !important;
-      padding-left: 1rem !important;
-    }
-  }
-
   /* Text alignment in RTL */
   .text-start {
     text-align: right !important;