.close { position: absolute; right: 0; } .li { height: 0.5rem; display: flex; align-items: center; color: #000000; font-size: 0.24rem; } .line { margin: 0 0.2rem; height: 0.24rem; border-radius: 0.12rem; background: linear-gradient(to right, #4279e5, #372cc9); } .top { display: flex; padding: 0.48rem 1.8rem 0.25rem 0; font-family: Source Han Sans, Source Han Sans; font-weight: 500; color: #615d5d; font-size: 0.32rem; justify-content: space-around; .left { // width: 50%; display: flex; align-items: center; } .img { width: 1.5rem; margin-right: 0.46rem; } .right { display: flex; align-items: flex-start; flex-direction: column; justify-content: space-around; } .icon { width: 0.2rem; height: 0.2rem; // border-radius: 50%; display: inline-block; background-color: #12ceb3; margin-right: 0.44rem; vertical-align: middle; &.error { background-color: #fe5850; } &.offline { background-color: #9b9b9b; } } } .titleContent { position: relative; display: flex; align-items: center; justify-content: center; height: 2.38rem; .img { width: 1.5rem; margin-right: 0.46rem; } .num { margin-bottom: 0.24rem; font-size: 0.8rem; font-family: DINAlternate-Bold, DINAlternate; font-weight: bold; color: #f5a623; line-height: 0.94rem; } .text { font-size: 0.28rem; color: #4a4a4a; line-height: 0.38rem; } .iconFundFilled { width: 0.37rem; height: 0.41rem; position: absolute; right: 0.2rem; top: 0.2rem; cursor: pointer; background: url('@/assets/iconFundFilled.png') no-repeat; background-size: 100% 100%; } } .itemContent { padding: 0.24rem; margin-bottom: 0.2rem; } .tipContent { .itemContent; display: flex; align-items: center; justify-content: space-between; font-size: 0.28rem; font-family: Source Han Sans, Source Han Sans; color: #615d5d; } .lineContent { display: flex; justify-content: space-between; font-size: 0.28rem; font-weight: 500; color: #4a4a4a; line-height: 0.38rem; } .sparePart { width: 100%; text-align: center; .cardItem { display: flex; padding: 0.36rem; justify-content: space-between; align-items: center; } .btns { margin: 0.24rem 0; .btn { width: 1.5rem; height: 0.6rem; font-size: 0.3rem; color: #4a4a4a; text-align: center; background-image: url('@/assets/deviceManager/deviceBtn1.png'); background-size: 100% 100%; } .active { color: #4a90e2; background-image: url('@/assets/deviceManager/deviceBtn2.png'); background-size: 100% 100%; } } .itemText { padding-left: 0.38rem; justify-content: flex-start; font-size: 0.28rem; color: #4a4a4a; line-height: 0.38rem; height: 0.96rem; } .itemTextActive { color: #4a90e2; } .spareText { font-size: 0.28rem; font-weight: 500; color: #4a4a4a; line-height: 0.38rem; } :global { .ant-collapse > .ant-collapse-item > .ant-collapse-header { padding: 0.36rem; align-items: center; } .ant-collapse-item { margin-bottom: 0.16rem; border-radius: 0.4rem 0 0.4rem 0 !important; background: #ffffff; box-shadow: 0.01rem 0.06rem 0.1rem 0rem rgba(0, 0, 0, 0.1); } .ant-collapse > .ant-collapse-item > .ant-collapse-header .ant-collapse-expand-icon { > span { font-size: 0.28rem; padding-inline-end: 0; padding-inline-start: 0.16rem; } } .ant-list-split .ant-list-item { border-color: #dbdbdb; } } } .main { padding: 0.2rem; } .upload { :global { .ant-upload { float: right; } } } .imgCon { width: 100%; padding-top: 20px; img { display: block; width: 100%; } }