🐛 Fix external article link alignment and add RTL support

CHANGELOG.md

@@ -22,6 +22,8 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 
 - Search link does not appear in header if main menu has no items to display
 - Search only returns results in the primary language when multiple languages are available ([#229](https://github.com/jpanther/congo/issues/229))
+- Arrow on external article links not aligned correctly when title wraps onto multiple lines
+- Arrow on external article links points the wrong direction for RTL languages
 - Scroll to top misaligned with the footer at small viewport heights
 - Link to homepage would be incorrect in some deployments if `baseURL` contained sub-directories in the path
 

assets/css/compiled/main.css

@@ -1776,10 +1776,6 @@ body button {
   margin-top: 1.5rem;
 }
 
-.-mt-2 {
-  margin-top: -0.5rem;
-}
-
 .mr-3 {
   margin-right: 0.75rem;
 }
@@ -2530,6 +2526,10 @@ body button {
   left: -1.5rem;
 }
 
+[dir="ltr"] .ltr\:ml-\[0\.1rem\] {
+  margin-left: 0.1rem;
+}
+
 [dir="ltr"] .ltr\:ml-2 {
   margin-left: 0.5rem;
 }
@@ -2590,6 +2590,10 @@ body button {
   right: -1.5rem;
 }
 
+[dir="rtl"] .rtl\:mr-\[0\.1rem\] {
+  margin-right: 0.1rem;
+}
+
 [dir="rtl"] .rtl\:mr-2 {
   margin-right: 0.5rem;
 }

layouts/partials/article-link.html

@@ -1,5 +1,5 @@
 <article>
-  <h3 class="flex items-center mt-6 text-xl font-semibold">
+  <h3 class="mt-6 text-xl font-semibold">
     {{ with .Params.externalUrl }}
       <a
         class="decoration-primary-500 hover:underline hover:underline-offset-2 text-neutral-800 dark:text-neutral"
@@ -9,10 +9,11 @@
         >{{ $.Title | emojify }}</a
       >
       <span
-        class="-mt-2 text-xs cursor-default text-neutral-400 dark:text-neutral-500"
+        class="absolute mt-0 ltr:ml-[0.1rem] rtl:mr-[0.1rem] text-xs cursor-default text-neutral-400 dark:text-neutral-500"
         title="{{ i18n "list.externalurl_title" }}"
       >
-        &#8599;
+        <span class="rtl:hidden">&#8599;</span>
+        <span class="ltr:hidden">&#8598;</span>
       </span>
     {{ else }}
       <a