feat(游戏王榜单): 阿语区名称贡献值设置向右滚动

src/views/Ranking/GamesKing/components/topUser.vue

@@ -85,7 +85,7 @@
             </div>
 
             <!-- 第二套内容，间隔30px -->
-            <div class="scroll-content" style="margin-left: 30px">
+            <div class="scroll-content">
               <div
                 style="color: #fff; font-weight: 700; white-space: nowrap"
                 :class="textSizeClass"
@@ -271,8 +271,6 @@ const isTopOne = computed(() => {
 .scroll-wrapper {
   display: flex;
   width: fit-content;
-  animation: scroll-left 5s linear infinite;
-  will-change: transform;
 }
 
 .scroll-content {
@@ -290,6 +288,34 @@ const isTopOne = computed(() => {
   }
 }
 
+@keyframes scroll-right {
+  0% {
+    transform: translateX(0);
+  }
+  100% {
+    transform: translateX(calc(50%));
+  }
+}
+
+[dir='ltr'] .scroll-content {
+  margin-left: 30px;
+}
+
+[dir='rtl'] .scroll-content {
+  margin-left: auto;
+  margin-right: 30px;
+}
+
+[dir='ltr'] .scroll-wrapper {
+  animation: scroll-left 5s linear infinite;
+  will-change: transform;
+}
+
+[dir='rtl'] .scroll-wrapper {
+  animation: scroll-right 5s linear infinite;
+  will-change: transform;
+}
+
 @media screen and (max-width: 360px) {
   * {
     font-size: 10px;