/* pages/activity/index.wxss */ page { background: #F2F2F2; /* 节假日花样 */ /* background: #CEEDDB; */ } .types { /* justify-content: space-between; */ background: #fff; display: flex; color: #666; width: 697rpx; overflow-x: scroll; border-bottom: 1rpx solid #d8d8d8; font-size: 0; padding-top: 30rpx; height: 180rpx; position: relative; -webkit-overflow-scrolling: auto; } /*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/ .types::-webkit-scrollbar { width: 750rpx; height: 6rpx; background-color: hsl(0, 0%, 100%); } /*定义滑块 内阴影+圆角*/ .types::-webkit-scrollbar-thumb { border-radius: 6rpx; background-color: #0B898E; border-radius: 3rpx; } .types::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 3rpx rgba(0, 0, 0, 0.3); box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.1); border-radius: 3rpx; background-color:#ccc; } .type-item { height: 150rpx; width: 100rpx; text-align: center; line-height: 27rpx; color: #333; font-size: 24rpx; margin-right: 70rpx; } .type-item:nth-child(1){ margin-left: 30rpx; } .type-item image { display: block; margin-bottom: 23rpx; width: 100rpx; height: 100rpx; } .date-box { height: 140rpx; background: rgba(255, 255, 255, 1); display: flex; justify-content: space-between; align-items: center; } .yulan { flex-shrink: 0; width: 60rpx; text-align: right; background: #fff; border-radius: 0px 30rpx 30rpx 0px; color: #333333; white-space: nowrap; font-size: 26rpx; display: flex; flex-direction: column; } .yulan.active { color: #0B898E; } .date-item { font-size: 26rpx; color: #999; text-align: center; display: flex; flex-direction: column; justify-content: center; width: 79rpx; height:100%; } .date-item.active { font-weight:500; color: #0B898E; background: rgba(11, 137, 142, .1); } .calendar-img { width: 70rpx; padding-left: 10rpx; height: 80rpx; display: flex; align-items: center; justify-content: flex-start; background: #fff; border-radius: 30rpx 0px 0px 30rpx; } .calendar-img image { width: 50rpx; height: 50rpx; display: block; } .calendar-img.active { } .top-fixed-activity { background: #f7f7f7; z-index: 1; } .top-fixed-box { background: #FFF; width: 697rpx; margin: 0 auto; border-radius: 20rpx 20rpx 0 0; margin-top: 20rpx; position: relative; background-image: url("https://static.ticket.sz-trip.com/uploads/20250421/63b9ec7a1192790eed3e5dcf915212c0.png"); background-size: 100% 100%; } .activity-list { width: 697rpx; /* padding: 0 24rpx; */ background: #0B898E; min-height:1300rpx; margin: 0 auto; } .acitivity-search-box { display: flex; margin:20rpx 30rpx; margin-bottom: 0; justify-content: space-between; align-items: center; padding-top: 30rpx; } .acitivity-search-box .picker { margin-right: 30rpx; height: 60rpx; display: flex; align-items: center; color: #0B898E; } .acitivity-search-box .picker image { display: block; width: 16rpx; flex-shrink: 0; margin-left: 10rpx; } .m-picker { display: flex; color: #0B898E; } .sjx{ width: 0; height: 0; border-top: 9rpx solid #fff; border-right: 9rpx solid transparent; border-left: 9rpx solid transparent; border-bottom: 9rpx solid transparent; margin-top:16rpx; margin-left: 8rpx; } .m-sort{ width: 130rpx; text-align: center; } .activity-search-bg { width: 422rpx; height: 56rpx; border-radius: 28rpx; background: #f6f6f6; display: flex; align-items: center; } .activity-search-bg .iconfont { color: #B6B6B6; font-size: 28rpx; flex-shrink: 0; margin: 0 20rpx; } .activity-search-bg input { flex: 1; font-size: 27rpx; } .activity-item { display: flex; align-items: center; justify-content: space-between; padding: 10rpx 22rpx; /* padding: 27rpx 22rpx; */ position: relative; } .end-mask { position: absolute; /* 产品需求24/5/20 已结束就是盖在图片上,按此需求调整 */ left: 22rpx; /* right: 30rpx; */ /* top: 27rpx; */ text-align: center; width: 320rpx; height: 220rpx; line-height: 220rpx; z-index: 1; background:rgba(0, 0, 0, 0.5); color:#fff; border-radius: 10rpx; } .activity-item-out { box-shadow: -1rpx 1rpx 16rpx 0px rgba(6, 0, 1, 0.1); border-radius: 10rpx; margin: 27rpx 16rpx; background: white; } .activity-item image { width: 320rpx; height: 220rpx; border-radius: 10rpx; flex-shrink: 0; overflow: hidden; } .activity-item-out .new-tip { padding: 0 20rpx; line-height: 49rpx; color: #999; font-size: 23rpx; border-top: 1rpx solid #D8D8D8; } .activity-info { display: flex; flex-direction: column; justify-content: space-between; /* font-size: 23rpx; color: #999; */ flex: 1; min-height: 220rpx; /* margin-right: 28rpx; */ font-size: 24rpx; color: #666; } .activity-title { font-weight: 500; font-size: 31rpx; line-height: 45rpx; color: #000; /* color: #333; */ } .movie-types { display: flex; justify-content: space-between; padding: 30rpx 14rpx; background: #0B898E; } .movie-type { width: 330rpx; height: 60rpx; display: flex; align-items: center; justify-content: center; border-radius: 10rpx; color: #fff; border: 2rpx solid; box-sizing: border-box; text-align: center; font-size: 30rpx; } .movie-type.active { background: #fff; color: #0B898E; } .sort-box { display: flex; justify-content: space-between; margin: 20rpx 0 50rpx 0; background: #0B898E; color: #D8D8D8; font-size: 26rpx; padding: 0 60rpx 0 70rpx; } .sort-box view.active { color: #fff; } .my-search-box { flex: 1; display: flex; margin: 0; align-items: center; border-radius: 30rpx; height: 60rpx; /* background: #ededed; */ background-color: rgba(204,204,204, .3); margin-bottom: 0; font-size: 26rpx; z-index: 9; } .my-search-box .iconfont { width: 65rpx; text-align: center; font-size: 32rpx; flex-shrink: 0; } .my-search-box input { flex: 1; } .my-search-box .search-btn { text-align: center; width: 110rpx; flex-shrink: 0; line-height: 40rpx; border-left: 1rpx solid #ccc; color: #0B898E; /* 节假日花样 */ /* color: #DE4126; */ color: #DE4126; } .new-top-search-box { display: flex; justify-content: space-between; } .btn{ flex-shrink: 0; color: #fff; background: #f55; font-size: 26rpx; padding: 6rpx 20rpx; border-radius: 40rpx; margin-left: 10rpx; } .types-box { /* margin-top: 31rpx; */ font-size: 28rpx; color: #000; font-weight: 500; display: flex; overflow-x: scroll; padding: 31rpx 30rpx 30rpx; position: relative; z-index: 9; align-items: center; } .types-item { /* border: 1px solid #999999; */ border-radius: 27rpx; height: 53rpx; padding: 0 25rpx; display: inline-block; line-height: 53rpx; margin-right: 13rpx; flex-shrink: 0; border: 1px solid #FFC987; } .types-item-active { /* padding: 0 79rpx; */ padding: 0 25rpx; height: 57rpx; /* 节假日花样 */ /* height: 91.33rpx; */ line-height: 57rpx; display: inline-block; /* background: #0B898E; */ color: #FFFFFF; border-radius: 27rpx; margin-right: 13rpx; flex-shrink: 0; /* 节假日花样 */ /* background-image: url("https://static.ticket.sz-trip.com/uploads/20240606/f4ff3a7f81b4be3508592f656e207497.png"); */ background-size: 100% 100%; /* margin-top: -15rpx; */ text-align: center; min-width: 177.33rpx; box-sizing: border-box; color: #DA4939; text-shadow: -1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white, 1px 1px 0 white; background-image: url("https://static.ticket.sz-trip.com/uploads/20250421/48ce52adb4044d6b91bbce05047695a5.png"); } /* 不显示滚动条 */ .types-box::-webkit-scrollbar { display: none; } .bg-pic { width: 203.33rpx; height: 163.33rpx; position: absolute; right: 0; z-index: 2; }