/* pages/msg/push/index.wxss */ scroll-view { background-color: #f5f5f5; box-sizing: border-box; } .filter { margin: 0 10rpx; height: 80rpx; display: flex; flex-direction: row; background-color: white; border-radius: 10rpx; } .filter picker { flex: 1; height: 100%; display: flex; align-items: center; } .item { background-color: #ffffff; margin: 32rpx 20rpx 20rpx 20rpx; padding: 20rpx; position: relative; border-radius: 10rpx; z-index: 2; } .item .header { margin-top: 16rpx; } .item .header .single { width: 8rpx; height: 36rpx; background: #4882EE; border-radius: 4rpx; margin-right: 10rpx; } .item .header .title { font-size: 30rpx; font-weight: bold; color: #222222; } .item .put { width: 100%; background: #F5F7FC; border-radius: 12rpx; min-height: 72rpx; padding: 15rpx; margin-top: 16rpx; color: #333333; font-size: 28rpx; } .item .cloud { width: 40rpx; height: 40rpx; margin-left: 20rpx; } .item .file::before { display: block; content: ' '; width: 20rpx; height: 20rpx; margin-right: 20rpx; border-radius: 50%; background-color: var(--blue); } .item .file { padding: 15rpx 0; border-bottom: 1rpx dashed #f5f5f5; } .item .people { display: inline-flex; width: calc((100vw - 100rpx) / 4); margin-top: 20rpx; } .item .people .avatar { width: 88rpx; height: 88rpx; border-radius: 50%; background-color: #f5f5f5; } .item .people .name { font-size: 28rpx; font-weight: bold; color: #222222; } .option { position: fixed; bottom: calc(constant(safe-area-inset-bottom) + 30rpx); bottom: calc(env(safe-area-inset-bottom) + 30rpx); left: 0; right: 0; margin-top: 30rpx; padding: 16rpx 32rpx; background: #FFFFFF; box-shadow: 0rpx 0rpx 12rpx 2rpx #DDECF3; z-index: 10; } .option .btn { padding: 14rpx; display: flex; align-items: center; justify-content: center; background: #409CFF; color: #FFFFFF; border-radius: 12rpx; } .option .btn:active { opacity: 0.8; } .space { height: calc(constant(safe-area-inset-bottom) + 150rpx); height: calc(env(safe-area-inset-bottom) + 150rpx); }