/**index.wxss**/ .wx-swiper-dots .wx-swiper-dot { width: 40rpx; height: 10rpx; border-radius: 4rpx; } .wx-swiper-dots.wx-swiper-dots-horizontal { bottom: 80rpx; width: 90%; text-align: left; } .title-text { color: #ffffff; font-size: 32rpx; } .top { width: 100vw; height: 380rpx; position: relative; } .top .img { width: 100vw; height: 450rpx; position: absolute; z-index: -1; } .top .avatar { width: 100rpx; height: 100rpx; border-radius: 50%; background-color: #ffffff; margin: 0 32rpx; margin-top: 80rpx; } .top .name { color: white; font-size: 38rpx; margin-right: 20rpx; margin-top: 80rpx; } .top .duty { display: flex; align-items: center; justify-content: center; margin-top: 80rpx; padding: 0 20rpx; font-size: 30rpx; color: #FFC054; border-radius: 40rpx; border: 2rpx solid #FFAF54; } .top .point { color: white; font-size: 32rpx; margin-right: 20rpx; margin-top: 10rpx; opacity: 0.9; } /* 背景 */ .item-bg { padding: 0 32rpx; margin: 0 20rpx; margin-top: 20rpx; box-shadow: 0rpx 2rpx 2rpx 0rpx #E5E5E5; border-radius: 12rpx; } .item-msg { height: 90rpx; margin-top: -10rpx; display: flex; align-items: center; } .item-msg .img { width: 52rpx; height: 60rpx; margin-right: 32rpx; } .item-msg .txt { flex: 1; font-size: 28rpx; padding-right: 32rpx; color: #777777; } .swiper-msg { margin-top: -80rpx; height: 400rpx; padding: 0; } .swiper-msg .item { width: 100%; height: 100%; border-radius: 12rpx; position: relative; } .swiper-msg .img { width: 100%; height: 100%; } .swiper-msg .item .title { background-color: rgba(0, 0, 0, 0.5); position: absolute; bottom: 0; z-index: 1; left: 0; right: 0; color: white; padding: 15rpx 20rpx; font-size: 28rpx; } .item-bg .title { padding-top: 20rpx; } .item-bg .title .tab { background-color: #f5f5f5; border-radius: 10rpx; } .item-bg .title .tab text { padding: 5rpx 25rpx; font-size: 26rpx; display: flex; align-items: center; justify-content: center; } .item-bg .title .tab .checked { background-color: rgba(116, 180, 240, 1); color: white; } .item-bg .title .tab .left { border-radius: 10rpx 0 0 10rpx; } .item-bg .title .tab .center {} .item-bg .title .tab .right { border-radius: 0 10rpx 10rpx 0; } .item-bg .title .icon { width: 24rpx; height: 24rpx; margin-right: 20rpx; } .item-bg .title .txt { font-size: 32rpx; font-weight: bold; color: #222222; } /* 工作台 */ .item-wrapper { display: flex; flex-wrap: wrap; align-items: center; margin-top: 30rpx; } .item-row { width: calc((100vw - 108rpx) / 4); margin-bottom: 30rpx; } .item-row text { font-size: 28rpx; color: #333333; } .item-row image { width: 80rpx; height: 80rpx; margin-bottom: 18rpx; } /* 统计 */ .item-bg .filter { margin: 0 -32rpx; margin-top: 20rpx; height: 65rpx; border-radius: 12rpx; background: #CEE2FF; border: 2rpx solid rgba(0, 0, 0, 0); position: relative; overflow: hidden; } .item-bg .lab { font-size: 32rpx; flex: 1; display: flex; align-items: center; justify-content: center; z-index: 1; color: #222222; } .item-bg .lab-checked { color: #1E8FFF; } .item-bg .filter-img { position: absolute; width: 360rpx; height: 100%; transition: all .5s; } .item-bg .filter-checked { -webkit-transform: scaleX(-1); transform: scaleX(-1); } .item-bg .tips { font-size: 28rpx; color: #666666; } .item-bg .val { margin-top: 20rpx; font-size: 46rpx; font-weight: bold; color: #333333; } .item-bg .line-static { width: 1rpx; height: 107rpx; background-color: #f5f5f5; } .item-bg .check-static { margin: 0 -32rpx; padding-bottom: 20rpx; border-bottom: 1rpx solid #f5f5f5; } .legend .single { width: 24rpx; height: 8rpx; border-radius: 4rpx; } .legend .single::before { content: ''; } .legend .label { font-size: 28rpx; color: #666666; } .legend .value { font-size: 32rpx; color: #333333; margin-top: 8rpx; } .item-bg .charts { width: 280rpx; height: 280rpx; margin-right: 30rpx; margin-top: 30rpx; } /* 学习专栏 */ .item-bg .more { font-size: 28rpx; color: #777777; } .item-bg .study-l { position: relative; width: 262rpx; height: 154rpx; background-color: #f5f5f5; border-radius: 10rpx; margin: 15rpx 0; border-bottom: 1rpx solid #f5f5f5; } .item-bg .study-l .img { width: 100%; height: 100%; } .item-bg .study-l .tags { position: absolute; top: 0; width: fit-content; font-size: 24rpx; color: white; padding: 3rpx 15rpx; border-radius: 10rpx 0 25rpx 0; background-color: rgba(116, 180, 240, 0.8); } .item-bg .study-l .tags-min { position: absolute; bottom: 0; font-size: 24rpx; color: #FFFFFF; padding: 3rpx 10rpx; width: 100%; display: flex; align-items: center; justify-content: center; border-radius: 0 0 10rpx 10rpx; background: rgba(1, 1, 1, 0.2); } .item-bg .study-r { flex: 1; margin-left: 24rpx; } .item-bg .study-r .title { font-size: 28rpx; font-weight: bold; color: #333333; } .item-bg .study-r .time { font-size: 22rpx; color: #545454; } textarea { font-size: 30rpx; text-align: left; width: 100%; min-height: 40vh; padding: 16rpx 16rpx 0 16rpx; }