diff --git a/src/views/Ranking/GamesKing/components/topUser.vue b/src/views/Ranking/GamesKing/components/topUser.vue index c066fb8..ba5e6cd 100644 --- a/src/views/Ranking/GamesKing/components/topUser.vue +++ b/src/views/Ranking/GamesKing/components/topUser.vue @@ -85,7 +85,7 @@ -
+
{ .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;