Browse Source

style: 优化回到顶部按钮毛玻璃样式

pull/1/head
Trae AI 2 months ago
parent
commit
5f012a132a
  1. 33
      pages/index/index.wxss

33
pages/index/index.wxss

@ -1359,20 +1359,23 @@ wx-button:not([size=mini]) {
/* 回到顶部按钮 */
.back-to-top-btn {
position: fixed;
right: 30rpx;
bottom: 200rpx;
width: 100rpx;
height: 100rpx;
background: linear-gradient(135deg, #1677ff 0%, #4096ff 100%);
right: 24rpx;
bottom: 180rpx;
width: 96rpx;
height: 96rpx;
background: rgba(255, 255, 255, 0.25);
backdrop-filter: blur(16rpx);
-webkit-backdrop-filter: blur(16rpx);
border-radius: 50%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
box-shadow: 0 4rpx 16rpx rgba(22, 119, 255, 0.4);
box-shadow: 0 6rpx 20rpx rgba(0, 0, 0, 0.15);
border: 2rpx solid rgba(255, 255, 255, 0.4);
opacity: 0;
transform: translateY(20rpx);
transition: all 0.3s ease;
transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
z-index: 999;
pointer-events: none;
}
@ -1384,13 +1387,17 @@ wx-button:not([size=mini]) {
}
.back-to-top-icon {
font-size: 36rpx;
color: white;
font-weight: bold;
font-size: 32rpx;
color: #1677ff;
font-weight: 600;
line-height: 1;
text-shadow: 0 1rpx 2rpx rgba(255, 255, 255, 0.8);
}
.back-to-top-text {
font-size: 18rpx;
color: white;
margin-top: 2rpx;
font-size: 16rpx;
color: #1677ff;
margin-top: 4rpx;
font-weight: 500;
text-shadow: 0 1rpx 2rpx rgba(255, 255, 255, 0.8);
}

Loading…
Cancel
Save