diff --git a/frontend/pages/square/components/StarGalaxy/PodiumCard.vue b/frontend/pages/square/components/StarGalaxy/PodiumCard.vue index e555fad..e0a64ae 100644 --- a/frontend/pages/square/components/StarGalaxy/PodiumCard.vue +++ b/frontend/pages/square/components/StarGalaxy/PodiumCard.vue @@ -1,14 +1,13 @@ @@ -29,26 +28,6 @@ const props = defineProps({ const emit = defineEmits(["cardClick"]); -// 不同 rank 的标签渐变 -const labelGradients = { - 4: "radial-gradient(ellipse, #FFD700, #FFF6A8 30%, #DAA520 100%)", // 金 - 5: "radial-gradient(ellipse, #C0C0C0, #E8E8E8 50%, #7A7A7A)", // 银 - 6: "radial-gradient(ellipse, #CD7F32, #E8A45C 50%, #A0522D)", // 铜 -}; - -const labelSizes = { - 4: { w: 96, h: 22, font: 13 }, - 5: { w: 78, h: 18, font: 11 }, - 6: { w: 78, h: 18, font: 11 }, -}; - -const labelStyle = { - width: labelSizes[props.rank].w + "rpx", - height: labelSizes[props.rank].h + "rpx", - fontSize: labelSizes[props.rank].font + "rpx", - background: labelGradients[props.rank], -}; - function handleClick() { emit("cardClick", props.item); } @@ -87,6 +66,26 @@ function handleClick() { height: 192rpx; } +/* TOP N 标签(按 rank 区分样式) */ +.podium-4 .top-label { + width: 96rpx; + height: 22rpx; + font-size: 13rpx; + background: radial-gradient(ellipse, #ffd700, #fff6a8 30%, #daa520 100%); +} +.podium-5 .top-label, +.podium-6 .top-label { + width: 78rpx; + height: 18rpx; + font-size: 11rpx; +} +.podium-5 .top-label { + background: radial-gradient(ellipse, #c0c0c0, #e8e8e8 50%, #7a7a7a); +} +.podium-6 .top-label { + background: radial-gradient(ellipse, #cd7f32, #e8a45c 50%, #a0522d); +} + .podium-frame { position: absolute; inset: 0;