From 637c43a1257b182aaf90acbfefa22ef22910ed5d Mon Sep 17 00:00:00 2001
From: ZhenShuo Leo <98386542+ZhenShuo2021@users.noreply.github.com>
Date: Sat, 2 Aug 2025 17:59:27 +0800
Subject: [PATCH] fix(rtl): cardViewScreenWidth broken on rtl site

---
 assets/css/compiled/main.css                             | 6 +++---
 layouts/_default/list.html                               | 4 ++--
 layouts/_default/term.html                               | 4 ++--
 layouts/partials/recent-articles/cardview-fullwidth.html | 2 +-
 4 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/assets/css/compiled/main.css b/assets/css/compiled/main.css
index c32f9757..723d0333 100644
--- a/assets/css/compiled/main.css
+++ b/assets/css/compiled/main.css
@@ -494,6 +494,9 @@ body.zen-mode-enable {
   .-start-6 {
     inset-inline-start: calc(var(--spacing) * -6);
   }
+  .start-\[calc\(max\(-50vw\,-800px\)\+50\%\)\] {
+    inset-inline-start: calc(max(-50vw, -800px) + 50%);
+  }
   .top-0 {
     top: calc(var(--spacing) * 0);
   }
@@ -521,9 +524,6 @@ body.zen-mode-enable {
   .left-1\/2 {
     left: calc(1/2 * 100%);
   }
-  .left-\[calc\(max\(-50vw\,-800px\)\+50\%\)\] {
-    left: calc(max(-50vw, -800px) + 50%);
-  }
   .-z-10 {
     z-index: calc(10 * -1);
   }
diff --git a/layouts/_default/list.html b/layouts/_default/list.html
index 0d0ba8c5..1d4723e5 100644
--- a/layouts/_default/list.html
+++ b/layouts/_default/list.html
@@ -88,7 +88,7 @@
       {{ if $groupByYear }}
         {{ range (.Paginate (.Pages.GroupByDate "2006")).PageGroups }}
           {{ if $cardViewScreenWidth }}
-            <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%)]">
               <h2 class="mt-12 mb-3 text-2xl font-bold text-neutral-700 first:mt-8 dark:text-neutral-300">
                 {{ .Key }}
               </h2>
@@ -113,7 +113,7 @@
       {{/* else: not groupByYear */}}
       {{ else }}
         {{ if $cardViewScreenWidth }}
-          <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">
               {{ if not $orderByWeight }}
                 {{ range (.Paginate (.Pages.GroupByDate "2006")).PageGroups }}
diff --git a/layouts/_default/term.html b/layouts/_default/term.html
index 3506a66e..fc8a9c9b 100644
--- a/layouts/_default/term.html
+++ b/layouts/_default/term.html
@@ -86,7 +86,7 @@
       {{ if $groupByYear }}
 
         {{ range (.Paginate (.Pages.GroupByDate "2006")).PageGroups }}
-          <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%)]">
             <h2 class="mt-12 mb-3 text-2xl font-bold text-neutral-700 first:mt-8 dark:text-neutral-300">
               {{ .Key }}
             </h2>
@@ -100,7 +100,7 @@
 
       {{ else }}
 
-        <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 (.Paginate (.Pages.GroupByDate "2006")).PageGroups }}
               {{ range .Pages }}
diff --git a/layouts/partials/recent-articles/cardview-fullwidth.html b/layouts/partials/recent-articles/cardview-fullwidth.html
index 5df00190..c0fd48b5 100644
--- a/layouts/partials/recent-articles/cardview-fullwidth.html
+++ b/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