.itemWrap { margin: 12px 13px 12px; font-size: 14px; .itemWrapTopCard { padding: 12px 15px 20px; border-radius: 10px; background-color: #fff; margin-bottom: 12px; .itemWrapTop { display: flex; flex-direction: row; align-items: center; justify-content: space-between; padding-bottom: 12px; border-bottom: 1px solid #f2f2f2; .itemWrapTopLeft { display: flex; flex-direction: row; align-items: center; .clockWrap { width: 18px; height: 18px; margin-right: 6px; img { width: 100%; height: 100%; } } .leftTimer { font-size: 14px; font-weight: 500; color: #333333; line-height: 20px; } } .itemWrapTopRight { font-size: 12px; color: #777; } } } .itemWrapBottom { padding-top: 15px; display: flex; flex-direction: row; align-items: center; justify-content: space-between; .msgIcon { width: 24px; height: 24px; img { width: 100%; } } .courseInfo { display: flex; flex-direction: row; align-items: center; // padding-bottom: 15px; .headImgs { width: 42px; height: 42px; border-radius: 50%; overflow: hidden; margin-right: 12px; } .infoMsg { .infoMsgMain { font-size: 16px; font-weight: 600; color: #333333; line-height: 22px; } .infoMsgSub { width: 230px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; font-weight: 400; color: #777777; line-height: 17px; } .infoMsgSubTeacher { width: 260px !important; } } } } .attBackInfo { margin-top: 12px; } .attInfo { display: flex; flex-direction: row; align-items: center; justify-content: space-between; .attInfoDot { text-align: left; width: 100%; padding: 12px; .attInfoDotTitle { width: 100%; display: flex; flex-direction: row; margin-bottom: 7px; align-items: center; justify-content: space-between; img { width: 18px; height: 18px; } } .signTime { font-size: 14px; font-weight: 500; color: #333333; line-height: 28px; height: 31px; line-height: 31px; span { border-radius: 10px; font-size: 18px; color: #333; font-weight: 600; } } .attRang { height: 31px; line-height: 31px; display: flex; flex-direction: row; align-items: center; font-size: 14px; .locP { margin-left: 5px; font-size: 12px; font-weight: 500; } } } } .passWrap { background-color: #fff; } .goWrap { background-color: #fff; } .error { color: #f44541; } .pass { color: #4493f6; } .passWrap, .goWrap { display: flex; flex-direction: row; align-items: center; border-radius: 10px; justify-content: space-between; text-align: center; width: 168px; .itemBottomMain { font-size: 30px; font-weight: bold; color: #333333; line-height: 35px; margin-bottom: 2px; } .itemBottomSub { font-size: 14px; font-weight: 400; color: #333333; line-height: 20px; } } } :global { .bottomSheet { .van-action-sheet__description { padding: 0 !important; &::after { border: none !important; } } } } .bottomTitle { padding: 15px 15px 20px; text-align: left; display: flex; flex-direction: row; align-items: center; justify-content: space-between; height: 22px; font-size: 16px; font-family: PingFangSC-Medium, PingFang SC; font-weight: 500; color: #333333; line-height: 22px; .bottomTitleLeft { display: flex; flex-direction: row; align-items: center; span { width: 4px; height: 12px; background: #ff8057; border-radius: 2px; display: inline-block; margin-right: 6px; } } } .bottomConent { padding: 20px 15px 57px; display: flex; flex-direction: row; align-items: center; .bottomImgWrap { width: 47px; height: 47px; margin-bottom: 6px; img { width: 100%; height: 100%; } } .bottomConentLeft, .bottomConentRight { width: 50%; display: flex; flex-direction: column; align-items: center; } }