/* packageE/stationNotice/stationNotice.wxss */ page { padding-bottom: 50px; } view, text { box-sizing: border-box; } .tool { height: 65rpx; display: flex; align-items: center; background: #fff; color: #999; padding-left: 31rpx; padding-right: 34rpx; } .tool .icon-massage_clean { margin-left: 26rpx; font-size: 20rpx; width: 25rpx; height: 25rpx; display: flex; } .tool .icon-massage_set { width: 28rpx; height: 28rpx; display: flex; align-items: center; } .emptyTool { background: transparent; justify-content: flex-end; } .items { padding-left: 25rpx; background: #fff; } .items .item { width: 100%; display: flex; border-bottom: 1rpx solid #f4f4f4; transition: 0.5s; } .items .item:active { background: #eee; } .items .item .face { padding: 0.344rem 0.688rem 0.938rem 0.688rem; } .items .item .face .img { width: 2.875rem; height: 2.875rem; background-image: linear-gradient(-43deg, #2dadff 0%, #aadaff 100%), linear-gradient(#dfdfdf, #dfdfdf); background-blend-mode: normal, normal; display: flex; align-items: center; justify-content: center; border-radius: 50%; } .items .item .face .iconfont { font-size: 1.5rem; color: #fff; } .items .item .content { flex: 1; width: 0; display: flex; flex-direction: column; justify-content: space-evenly; padding-right: 1.188rem; } .items .item .content .c1 { display: flex; } .items .item .content .c1 .name { flex: 1; letter-spacing: 0.075rem; color: #333; font-size: 1rem; } .items .item .content .c1 .time { letter-spacing: 0.056rem; color: #999; font-size: 0.75rem; } .items .item .content .c2 { display: flex; } .items .item .content .c2 .desc { flex: 1; padding-right: 0.25rem; font-size: 0.875rem; letter-spacing: 0.066rem; color: #999; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .items .item .content .c2 .count { background-color: #f42a2a; border-radius: 0.5rem; padding: 0 0.219rem; height: 1rem; line-height: 1rem; color: #fff; font-size: 0.75rem; } .weekList { padding: 0 0.781rem; } .weekList .week { height: 2.781rem; letter-spacing: 0.025rem; color: #000; font-size: 1rem; padding-left: 0.188rem; padding-top: 0.93rem; } .weekList .weekItem { width: 100%; background: #fff; display: flex; flex-direction: column; padding-left: 0.594rem; padding-top: 0.719rem; border-radius: 0.25rem; transition: 0.5s; margin-bottom: 0.5rem; } .weekList .weekItem:active { background: #eee; } .weekList .weekItem .wrapper { display: flex; padding-bottom: 0.813rem; border-bottom: 0.031rem solid #f4f4f4; } .weekList .weekItem .wrapper .face { width: 2rem; } .weekList .weekItem .wrapper .face .img { width: 36rpx; height: 36rpx; /* background-image: linear-gradient(-43deg, #2dadff 0%, #aadaff 100%), linear-gradient(#dfdfdf, #dfdfdf); */ background-blend-mode: normal, normal; display: flex; align-items: center; justify-content: center; border-radius: 50%; position: relative; } .weekList .weekItem .wrapper .face .iconfont { font-size: 18rpx; color: #fff; display: flex; align-items: center; } .weekList .weekItem .wrapper .face .unread { width: 0.313rem; height: 0.313rem; background-color: #f42a2a; border-radius: 50%; position: absolute; top: 0; right: 0; } .weekList .weekItem .wrapper .content { padding-right: 0.563rem; flex: 1; } .weekList .weekItem .wrapper .content .head { display: flex; align-items: flex-end; } .weekList .weekItem .wrapper .content .head .name { flex: 1; color: #000; font-size: 1rem; } .weekList .weekItem .wrapper .content .head .time { font-size: 0.75rem; letter-spacing: 0.019rem; color: #666; } .weekList .weekItem .wrapper .content .c1 { margin-top: 0.719rem; } .weekList .weekItem .wrapper .content .ca { font-size: 0.75rem; line-height: 1.25rem; letter-spacing: 0.019rem; color: #666; } .weekList .weekItem .wrapper .content .anchor { display: flex; padding: 1rem 0 0.531rem 0; } .weekList .weekItem .wrapper .content .anchor .face { width: 4rem; } .weekList .weekItem .wrapper .content .anchor .face image { width: 4rem; height: 4rem; background-color: #999; } .weekList .weekItem .wrapper .content .anchor .desc { height: 4rem; padding-left: 0.531rem; flex: 1; display: flex; flex-direction: column; justify-content: space-between; } .weekList .weekItem .wrapper .content .anchor .des .name { letter-spacing: 0.019rem; color: #000; font-size: 0.75rem; /* text-overflow: -o-ellipsis-lastline; */ overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; } .weekList .weekItem .wrapper .content .anchor .des .tips { letter-spacing: 0.019rem; font-size: 0.75rem; color: #f42a2a; } .weekList .weekItem .botm { height: 1.938rem; display: flex; justify-content: space-between; align-items: center; letter-spacing: 0.022rem; color: #666; font-size: 0.875rem; } .empty { height: calc(100vh - 12rem); display: flex; flex-direction: column; justify-content: center; align-items: center; } .empty .img img { width: 15.344rem; height: 11.688rem; } .empty .text { text-align: center; margin-top: 1.125rem; font-size: 1rem; letter-spacing: 0.075rem; color: #c8c8c8; } .items .item .face .img1, .weekList .img1 { background-image: linear-gradient(-43deg, #2dadff 0%, #aadaff 100%), linear-gradient(#dfdfdf, #dfdfdf); } .items .item .face .img2, .weekList .img2 { background-image: linear-gradient(-43deg, #ffb228 0%, #ffdd89 100%), linear-gradient(#dfdfdf, #dfdfdf); } .items .item .face .img3, .weekList .img3 { background-image: linear-gradient(-43deg, #36d6a6 0%, #7ce5de 100%), linear-gradient(#dfdfdf, #dfdfdf); } .items .item .face .img4, .weekList .img4 { background-image: linear-gradient(-43deg, #418dfe 0%, #53a3fd 50%, #65b8fb 100%), linear-gradient(#dfdfdf, #dfdfdf); } .items .item .face .img5, .weekList .img5 { background-image: linear-gradient(-43deg, #ff250f 0%, #ff7d7f 100%), linear-gradient(#dfdfdf, #dfdfdf); } .items .item .face .img6, .weekList .img6 { background-image: linear-gradient(-43deg, #2983f8 0%, #2498f2 50%, #1eadeb 100%), linear-gradient(#dfdfdf, #dfdfdf); } .items .item .face .img7, .weekList .img7 { background-image: linear-gradient(-43deg, #7667fe 0%, #8376fe 50%, #9084fd 100%), linear-gradient(#dfdfdf, #dfdfdf); } .items .item .face .img8, .weekList .img8 { background-image: linear-gradient(-43deg, #fd5355 0%, #ff96a2 100%), linear-gradient(#dfdfdf, #dfdfdf); }