feat: 新增星河的
This commit is contained in:
parent
90803234ba
commit
61d39e2c1e
@ -39,7 +39,8 @@ function handleClick() {
|
|||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
// 宽高交给各 .podium-N 自由控制(不设默认值)
|
width: 60vw;
|
||||||
|
height: 320rpx;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* TOP 1: 中央大卡(最大) */
|
/* TOP 1: 中央大卡(最大) */
|
||||||
@ -47,8 +48,6 @@ function handleClick() {
|
|||||||
top: 400rpx;
|
top: 400rpx;
|
||||||
left: 50%;
|
left: 50%;
|
||||||
transform: translateX(-50%);
|
transform: translateX(-50%);
|
||||||
width: 240rpx;
|
|
||||||
height: 320rpx;
|
|
||||||
&::before {
|
&::before {
|
||||||
content: "";
|
content: "";
|
||||||
position: absolute;
|
position: absolute;
|
||||||
@ -76,8 +75,6 @@ function handleClick() {
|
|||||||
.podium-2 {
|
.podium-2 {
|
||||||
top: 184rpx;
|
top: 184rpx;
|
||||||
left: -96rpx;
|
left: -96rpx;
|
||||||
width: 200rpx;
|
|
||||||
height: 280rpx;
|
|
||||||
&::before {
|
&::before {
|
||||||
content: "";
|
content: "";
|
||||||
position: absolute;
|
position: absolute;
|
||||||
@ -104,8 +101,6 @@ function handleClick() {
|
|||||||
.podium-3 {
|
.podium-3 {
|
||||||
top: 152rpx;
|
top: 152rpx;
|
||||||
right: -96rpx;
|
right: -96rpx;
|
||||||
width: 220rpx;
|
|
||||||
height: 260rpx;
|
|
||||||
&::before {
|
&::before {
|
||||||
content: "";
|
content: "";
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
|||||||
@ -28,8 +28,8 @@
|
|||||||
@click="handleClick(items[i])"
|
@click="handleClick(items[i])"
|
||||||
>
|
>
|
||||||
<!-- 相框(最底层) -->
|
<!-- 相框(最底层) -->
|
||||||
<image class="ring-frame" :src="ringFrameSrc(p.rank)" mode="aspectFit" />
|
|
||||||
<view class="top-label">{{ formatLabel(p.rank) }}</view>
|
<view class="top-label">{{ formatLabel(p.rank) }}</view>
|
||||||
|
<image class="ring-frame" :src="ringFrameSrc(p.rank)" mode="aspectFit" />
|
||||||
<image
|
<image
|
||||||
class="cover-image"
|
class="cover-image"
|
||||||
:src="items[i]?.cover_url || items[i]?.cover_image || ''"
|
:src="items[i]?.cover_url || items[i]?.cover_image || ''"
|
||||||
@ -124,7 +124,7 @@ function handleClick(item) {
|
|||||||
pointer-events: auto;
|
pointer-events: auto;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
/* display: flex; */
|
/* display: flex; */
|
||||||
flex-direction: column;
|
/* flex-direction: column; */
|
||||||
animation: orbit 36s linear infinite;
|
animation: orbit 36s linear infinite;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -166,6 +166,8 @@ function handleClick(item) {
|
|||||||
height: 100%;
|
height: 100%;
|
||||||
border-radius: 5rpx;
|
border-radius: 5rpx;
|
||||||
z-index: 1; /* between frame and label */
|
z-index: 1; /* between frame and label */
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user