From dd5f95d7341f9c0432b3533a6589d2710a854678 Mon Sep 17 00:00:00 2001 From: zheng020 Date: Wed, 10 Jun 2026 16:01:29 +0800 Subject: [PATCH] fix(stargalaxy): set slot-specific static transform to prevent 9-item overlap fallback --- .../components/StarGalaxy/ScatteredRanks.vue | 17 ++++++++++++++++- 1 file changed, 16 insertions(+), 1 deletion(-) diff --git a/frontend/pages/square/components/StarGalaxy/ScatteredRanks.vue b/frontend/pages/square/components/StarGalaxy/ScatteredRanks.vue index edc226d..1951168 100644 --- a/frontend/pages/square/components/StarGalaxy/ScatteredRanks.vue +++ b/frontend/pages/square/components/StarGalaxy/ScatteredRanks.vue @@ -54,12 +54,27 @@ const emit = defineEmits(['cardClick']) const BASE_X = 164 const BASE_Y = 530 +// Each item's static fallback position = position at its slot in the orbit keyframe cycle. +// When animation runs, the keyframe overrides these. When animation doesn't run (e.g. prefers-reduced-motion), +// items stay at their slot positions instead of stacking at (BASE_X, BASE_Y). +const SLOT_TRANSFORMS = [ + 'translate(0, 0) scale(1.15)', // slot 0: TOP 4 (front center) + 'translate(84px, -13px) scale(1.05)', // slot 1: TOP 5 + 'translate(157px, -43px) scale(0.95)', // slot 2: TOP 6 + 'translate(113px, -83px) scale(0.85)', // slot 3: TOP 7 + 'translate(45px, -107px) scale(0.75)', // slot 4: TOP 8 + 'translate(-45px, -107px) scale(0.75)', // slot 5: TOP 9 + 'translate(-113px, -83px) scale(0.85)', // slot 6: TOP 10 + 'translate(-156px, -43px) scale(0.95)', // slot 7: TOP 11 + 'translate(-84px, -13px) scale(1.05)', // slot 8: TOP 12 +] + function ringItemStyle(p) { return { left: BASE_X + 'rpx', top: BASE_Y + 'rpx', zIndex: p.zIndex, - transform: `scale(${p.scale})`, + transform: SLOT_TRANSFORMS[p.rank - 4], animationDelay: RING_DELAYS[p.rank - 4] + 's', } }