feat: add RTL support to about page (#366)

Author: userquin

app/pages/about.vue

@@ -213,7 +213,7 @@ const { data: contributors, status: contributorsStatus } = useFetch<GitHubContri
               class="group flex flex-col gap-3 p-4 rounded-lg bg-bg-subtle hover:bg-bg-elevated border border-border hover:border-border-hover transition-all duration-200"
             >
               <div class="flex items-center gap-2">
-                <span class="i-carbon-logo-github w-5 h-5 text-fg" aria-hidden="true" />
+                <span class="i-carbon:logo-github w-5 h-5 text-fg" aria-hidden="true" />
                 <span class="font-medium text-fg">{{
                   $t('about.get_involved.contribute.title')
                 }}</span>
@@ -225,7 +225,7 @@ const { data: contributors, status: contributorsStatus } = useFetch<GitHubContri
                 class="text-sm text-fg-muted group-hover:text-fg inline-flex items-center gap-1 mt-auto"
               >
                 {{ $t('about.get_involved.contribute.cta') }}
-                <span class="i-carbon-arrow-right w-3 h-3" aria-hidden="true" />
+                <span class="i-carbon:arrow-right rtl-flip w-3 h-3" aria-hidden="true" />
               </span>
             </a>
 
@@ -237,7 +237,7 @@ const { data: contributors, status: contributorsStatus } = useFetch<GitHubContri
               class="group flex flex-col gap-3 p-4 rounded-lg bg-bg-subtle hover:bg-bg-elevated border border-border hover:border-border-hover transition-all duration-200"
             >
               <div class="flex items-center gap-2">
-                <span class="i-carbon-chat w-5 h-5 text-fg" aria-hidden="true" />
+                <span class="i-carbon:chat w-5 h-5 text-fg" aria-hidden="true" />
                 <span class="font-medium text-fg">{{
                   $t('about.get_involved.community.title')
                 }}</span>
@@ -249,7 +249,7 @@ const { data: contributors, status: contributorsStatus } = useFetch<GitHubContri
                 class="text-sm text-fg-muted group-hover:text-fg inline-flex items-center gap-1 mt-auto"
               >
                 {{ $t('about.get_involved.community.cta') }}
-                <span class="i-carbon-arrow-right w-3 h-3" aria-hidden="true" />
+                <span class="i-carbon:arrow-right rtl-flip w-3 h-3" aria-hidden="true" />
               </span>
             </a>
 
@@ -261,7 +261,7 @@ const { data: contributors, status: contributorsStatus } = useFetch<GitHubContri
               class="group flex flex-col gap-3 p-4 rounded-lg bg-bg-subtle hover:bg-bg-elevated border border-border hover:border-border-hover transition-all duration-200"
             >
               <div class="flex items-center gap-2">
-                <span class="i-simple-icons-bluesky w-5 h-5 text-fg" aria-hidden="true" />
+                <span class="i-simple-icons:bluesky w-5 h-5 text-fg" aria-hidden="true" />
                 <span class="font-medium text-fg">{{ $t('about.get_involved.follow.title') }}</span>
               </div>
               <p class="text-sm text-fg-muted leading-relaxed">
@@ -271,7 +271,7 @@ const { data: contributors, status: contributorsStatus } = useFetch<GitHubContri
                 class="text-sm text-fg-muted group-hover:text-fg inline-flex items-center gap-1 mt-auto"
               >
                 {{ $t('about.get_involved.follow.cta') }}
-                <span class="i-carbon-arrow-right w-3 h-3" aria-hidden="true" />
+                <span class="i-carbon:arrow-right rtl-flip w-3 h-3" aria-hidden="true" />
               </span>
             </a>
           </div>
@@ -283,7 +283,7 @@ const { data: contributors, status: contributorsStatus } = useFetch<GitHubContri
           to="/"
           class="inline-flex items-center gap-2 font-mono text-sm text-fg-muted hover:text-fg transition-[color] duration-200 rounded focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-fg/50"
         >
-          <span class="i-carbon-arrow-left w-4 h-4" aria-hidden="true" />
+          <span class="i-carbon:arrow-left rtl-flip w-4 h-4" aria-hidden="true" />
           {{ $t('about.back_home') }}
         </NuxtLink>
       </footer>