|
@@ -80,6 +80,7 @@
|
|
|
.enter-btn {
|
|
.enter-btn {
|
|
|
position: relative;
|
|
position: relative;
|
|
|
z-index: 1;
|
|
z-index: 1;
|
|
|
|
|
+ box-sizing: border-box;
|
|
|
width: 88%;
|
|
width: 88%;
|
|
|
min-height: 96rpx;
|
|
min-height: 96rpx;
|
|
|
max-width: 800rpx;
|
|
max-width: 800rpx;
|
|
@@ -99,28 +100,23 @@
|
|
|
text-shadow:
|
|
text-shadow:
|
|
|
0 2rpx 16rpx rgba(255, 255, 255, 0.32),
|
|
0 2rpx 16rpx rgba(255, 255, 255, 0.32),
|
|
|
0 4rpx 24rpx rgba(42, 13, 112, 0.7);
|
|
0 4rpx 24rpx rgba(42, 13, 112, 0.7);
|
|
|
- overflow: visible;
|
|
|
|
|
|
|
+ overflow: hidden;
|
|
|
box-shadow:
|
|
box-shadow:
|
|
|
0 0 0 1rpx rgba(168, 121, 255, 0.22),
|
|
0 0 0 1rpx rgba(168, 121, 255, 0.22),
|
|
|
- 0 0 16rpx rgba(151, 71, 255, 0.42),
|
|
|
|
|
- 0 0 36rpx rgba(82, 70, 255, 0.24),
|
|
|
|
|
- 0 24rpx 56rpx rgba(66, 26, 171, 0.4),
|
|
|
|
|
|
|
+ 0 0 12rpx rgba(151, 71, 255, 0.24),
|
|
|
|
|
+ 0 18rpx 42rpx rgba(66, 26, 171, 0.28),
|
|
|
inset 0 2rpx 0 rgba(255, 255, 255, 0.54),
|
|
inset 0 2rpx 0 rgba(255, 255, 255, 0.54),
|
|
|
- inset 0 -16rpx 36rpx rgba(49, 17, 135, 0.24);
|
|
|
|
|
|
|
+ inset 0 -12rpx 24rpx rgba(49, 17, 135, 0.2);
|
|
|
animation: enter-btn-gradient 5s ease-in-out infinite;
|
|
animation: enter-btn-gradient 5s ease-in-out infinite;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.enter-btn::before {
|
|
.enter-btn::before {
|
|
|
content: '';
|
|
content: '';
|
|
|
position: absolute;
|
|
position: absolute;
|
|
|
- inset: -4rpx;
|
|
|
|
|
- z-index: -1;
|
|
|
|
|
|
|
+ inset: 0;
|
|
|
border-radius: inherit;
|
|
border-radius: inherit;
|
|
|
- background: linear-gradient(100deg, #7b5cff, #d946ef, #537dff, #7b5cff);
|
|
|
|
|
- background-size: 220% 100%;
|
|
|
|
|
- filter: blur(10rpx);
|
|
|
|
|
- opacity: 0.34;
|
|
|
|
|
- animation: enter-btn-halo 4.2s ease-in-out infinite;
|
|
|
|
|
|
|
+ background: linear-gradient(100deg, rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0.02) 28%, rgba(255, 255, 255, 0.12) 100%);
|
|
|
|
|
+ pointer-events: none;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.enter-btn::after {
|
|
.enter-btn::after {
|
|
@@ -132,7 +128,7 @@
|
|
|
height: 42%;
|
|
height: 42%;
|
|
|
border-radius: 999rpx;
|
|
border-radius: 999rpx;
|
|
|
background: linear-gradient(180deg, rgba(255, 255, 255, 0.34), transparent);
|
|
background: linear-gradient(180deg, rgba(255, 255, 255, 0.34), transparent);
|
|
|
- opacity: 0.72;
|
|
|
|
|
|
|
+ pointer-events: none;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.enter-btn::after,
|
|
.enter-btn::after,
|