Merge pull request #2393 from ZhenShuo2021/fix/rtl-layout-issues

🐛 Fix(rtl): multiple layout issues

layouts/partials/article-link/_shortcode.html

@@ -71,7 +71,7 @@
 
 
   <div class="{{ $articleInnerClasses }}">
-    <div class="items-center text-left text-xl font-semibold">
+    <div class="items-center text-start text-xl font-semibold">
       {{ with $target.Params.externalUrl }}
         <div>
           <div

layouts/partials/article-link/simple.html

@@ -68,7 +68,7 @@
 
 
   <div class="{{ $articleInnerClasses }}">
-    <div class="items-center text-left text-xl font-semibold">
+    <div class="items-center text-start text-xl font-semibold">
       {{ with .Params.externalUrl }}
         <div
           class="group-hover-card-title decoration-primary-500 dark:text-neutral text-xl font-bold text-neutral-800 group-hover:underline group-hover:underline-offset-2">

layouts/partials/article-meta/basic.html

@@ -71,7 +71,7 @@
 
     {{/* Output draft label */}}
     {{ if and (eq $scope "single") (and .Draft .Site.Params.article.showDraftLabel) }}
-      <span class="pl-2">{{ partial "badge.html" (i18n "article.draft" | emojify) }}</span>
+      <span class="ps-2">{{ partial "badge.html" (i18n "article.draft" | emojify) }}</span>
     {{ end }}
   </div>
 
@@ -81,7 +81,9 @@
         {{ if (eq $taxonomy "authors") }}
           {{ if (gt (len ($context.GetTerms $taxonomy)) 0) }}
             {{ range $i, $a := $context.GetTerms $taxonomy }}
-              {{ if not (eq $i 0) }},&nbsp;{{ end }}
+              {{ if not (eq $i 0) }}
+                ,&nbsp;
+              {{ end }}
               <a href="{{ $a.RelPermalink }}" class="relative">{{ $a.LinkTitle }}</a>
             {{ end }}
           {{ end }}
@@ -97,9 +99,9 @@
         {{ if and (not (eq $taxonomy "authors")) (not (eq $taxonomy "series")) }}
           {{ if (gt (len ($context.GetTerms $taxonomy)) 0) }}
             {{ range $context.GetTerms $taxonomy }}
-              <a class="relative mt-[0.5rem] mr-2" href="{{ .RelPermalink }}"
-                >{{ partial "badge.html" .LinkTitle }}</a
-              >
+              <a class="relative mt-[0.5rem] me-2" href="{{ .RelPermalink }}">
+                {{ partial "badge.html" .LinkTitle }}
+              </a>
             {{ end }}
           {{ end }}
         {{ end }}
@@ -111,9 +113,9 @@
   {{ if .Params.showCategoryOnly | default (.Site.Params.article.showCategoryOnly | default false) }}
     <div class="flex flex-row flex-wrap items-center">
       {{ range (.GetTerms "categories") }}
-        <a class="relative mt-[0.5rem] mr-2" href="{{ .RelPermalink }}"
-          >{{ partial "badge.html" .LinkTitle }}</a
-        >
+        <a class="relative mt-[0.5rem] me-2" href="{{ .RelPermalink }}">
+          {{ partial "badge.html" .LinkTitle }}
+        </a>
       {{ end }}
     </div>
   {{ end }}

layouts/partials/home/card.html

@@ -13,7 +13,7 @@
         </article>
       </div>
       <div class="mt-6 sm:mt-16 lg:mt-0 mx-auto max-w-xl px-4 sm:px-6 lg:mx-0 lg:max-w-none lg:py-16 lg:px-0">
-        <div class="-mr-48 md:-mr-16 lg:relative lg:m-0 lg:h-full lg:px-0 w-full">
+        <div class="-me-48 md:-me-16 lg:relative lg:m-0 lg:h-full lg:px-0 w-full">
           {{ $homepageImage := "" }}
           {{ with .Site.Params.defaultBackgroundImage }}
             {{ if or (strings.HasPrefix . "http:") (strings.HasPrefix . "https:") }}
@@ -31,7 +31,7 @@
           {{ end }}
           {{ if $homepageImage }}
             <img
-              class="w-full rounded-xl shadow-xl lg:absolute lg:left-0 lg:h-full lg:w-auto lg:max-w-none"
+              class="w-full rounded-xl shadow-xl lg:absolute lg:h-full lg:w-auto lg:max-w-none"
               src="{{ $homepageImage.RelPermalink }}">
           {{ end }}
         </div>

layouts/partials/recent-articles/cardview-fullwidth.html

@@ -2,7 +2,7 @@
 {{ $recentArticles = .Site.Params.homepage.showRecentItems }}
 
 
-<div class="relative w-screen max-w-[1600px] px-[30px] left-[calc(max(-50vw,-800px)+50%)]">
+<div class="relative w-screen max-w-[1600px] px-[30px] start-[calc(max(-50vw,-800px)+50%)]">
   <section class="w-full grid gap-4 sm:grid-cols-2 md:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5">
     {{ range first $recentArticles (.Paginate (where .Site.RegularPages "Type" "in"
       .Site.Params.mainSections)).Pages