hookehuyr

style(ActivitiesCover): 更新主题颜色和调整页面高度

将硬编码的颜色值替换为主题颜色变量,并调整页面高度计算方式
更新按钮阴影和渐变颜色以匹配新的主题色
......@@ -11,8 +11,8 @@
top: 0;
left: 0;
width: 100vw;
// height: calc(100vh - 260rpx); // 减去底部区域的高度,确保背景图不被遮挡
height: calc(100vh); // 减去底部区域的高度,确保背景图不被遮挡
height: calc(100vh - 150rpx); // 减去底部区域的高度,确保背景图不被遮挡
// height: calc(100vh); // 减去底部区域的高度,确保背景图不被遮挡
object-fit: cover;
object-position: top center;
z-index: 1;
......@@ -129,26 +129,26 @@
border-radius: 44rpx;
font-size: 32rpx;
font-weight: 600;
box-shadow: 0 8rpx 32rpx rgba(59, 130, 246, 0.5), 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
box-shadow: 0 8rpx 32rpx rgba(84, 171, 174, 0.5), 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
backdrop-filter: blur(15rpx);
-webkit-backdrop-filter: blur(15rpx);
border: 1rpx solid rgba(255, 255, 255, 0.2);
&:active {
transform: translateY(2rpx);
box-shadow: 0 4rpx 16rpx rgba(59, 130, 246, 0.4), 0 2rpx 8rpx rgba(0, 0, 0, 0.2);
box-shadow: 0 4rpx 16rpx rgba(84, 171, 174, 0.4), 0 2rpx 8rpx rgba(0, 0, 0, 0.2);
}
&.nut-button--primary {
background: linear-gradient(135deg, rgba(24, 144, 255, 0.95) 0%, rgba(9, 109, 217, 0.95) 100%);
background: linear-gradient(135deg, rgba(84, 171, 174, 0.95) 0%, rgba(74, 151, 154, 0.95) 100%);
border: 1rpx solid rgba(255, 255, 255, 0.3);
box-shadow: 0 8rpx 32rpx rgba(24, 144, 255, 0.4), 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
box-shadow: 0 8rpx 32rpx rgba(84, 171, 174, 0.4), 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
color: white;
text-shadow: 0 1rpx 2rpx rgba(0, 0, 0, 0.2);
&:active {
transform: translateY(2rpx);
box-shadow: 0 4rpx 16rpx rgba(24, 144, 255, 0.3), 0 2rpx 8rpx rgba(0, 0, 0, 0.2);
box-shadow: 0 4rpx 16rpx rgba(84, 171, 174, 0.3), 0 2rpx 8rpx rgba(0, 0, 0, 0.2);
}
}
}
......
<!--
* @Date: 2022-09-19 14:11:06
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2025-09-15 15:21:47
* @LastEditTime: 2025-09-15 16:20:15
* @FilePath: /lls_program/src/pages/ActivitiesCover/index.vue
* @Description: 活动海报页面 - 展示活动信息并处理定位授权
-->
......@@ -46,7 +46,7 @@
type="primary"
size="large"
class="join-button"
color="#3B82F6"
:color="THEME_COLORS.PRIMARY"
:loading="isJoining"
@click="checkFamilyStatusAndJoinActivity"
>
......