ng-zorro-antd
Version:
An enterprise-class UI components based on Ant Design and Angular
1 lines • 4.34 kB
CSS
.ant-check-list{position:fixed;right:32px;bottom:32px;z-index:999;font-size:14px;cursor:pointer}.ant-check-list .ant-check-list-button{display:flex;gap:8px;align-items:center;justify-content:center;min-width:110px;height:40px;border-radius:20px}.ant-check-list .ant-check-list-icon{font-size:24px;line-height:24px}.ant-check-list .ant-check-list-description{font-size:14px}.ant-check-list-content{display:block;width:303px}.ant-check-list-content .ant-check-list-header{display:flex;align-items:center;justify-content:space-between;padding:12px 12px 16px}.ant-check-list-content .ant-check-list-header .ant-check-list-header-title{font-weight:500;font-size:20px}.ant-check-list-content .ant-check-list-header .ant-check-list-header-extra{cursor:pointer}.ant-check-list-content .ant-check-list-header-finish{width:304px;padding-top:12px;text-align:center}.ant-check-list-content .ant-check-list-header-finish .ant-check-list-header-finish-icon{width:64px;height:64px;color:#1890ff;font-size:64px}.ant-check-list-content .ant-check-list-header-finish .ant-check-list-header-finish-title{margin-top:8px;margin-bottom:8px;font-weight:500;font-size:16px}.ant-check-list-content .ant-check-list-progressBar{display:flex;justify-content:space-between;margin:12px 16px;margin-top:0}.ant-check-list-content .ant-check-list-progressBar .ant-check-list-progressBar-progress{flex:auto}.ant-check-list-content .ant-check-list-steps-content{max-height:250px;overflow-y:scroll}.ant-check-list-content .ant-check-list-steps{display:flex;align-items:center;justify-content:space-between;height:52px;padding-right:12px;padding-left:12px;border-radius:6px;cursor:pointer}.ant-check-list-content .ant-check-list-steps .ant-check-list-steps-item{display:flex;gap:12px;align-items:center;justify-content:center;width:calc(100% - 22px);font-weight:400}.ant-check-list-content .ant-check-list-steps .ant-check-list-steps-item .ant-check-list-steps-item-circle{display:flex;flex:0 0 28px;align-items:center;justify-content:center;width:28px;height:28px;font-weight:600;background-color:#fff;border:1px solid #d9d9d9;border-radius:50%;user-select:none}.ant-check-list-content .ant-check-list-steps .ant-check-list-steps-item .ant-check-list-steps-item-circle .ant-check-list-steps-number{color:#1890ff;font-size:16px}.ant-check-list-content .ant-check-list-steps .ant-check-list-steps-item .ant-check-list-steps-item-circle .ant-check-list-steps-checkoutlined{color:#fff;font-size:14px}.ant-check-list-content .ant-check-list-steps .ant-check-list-steps-item .ant-check-list-steps-item-description{flex:1;overflow:hidden;line-height:2;white-space:nowrap;text-overflow:ellipsis}.ant-check-list-content .ant-check-list-steps .ant-check-list-steps-item-arrows{flex:0 0 22px;width:38px;height:38px;color:#1890ff;font-size:22px}.ant-check-list-content .ant-check-list-checked .ant-check-list-steps-item .ant-check-list-steps-item-circle{background-color:#1890ff;border:none}.ant-check-list-content .ant-check-list-checked .ant-check-list-steps-item .ant-check-list-steps-item-description{font-weight:500;text-decoration:line-through;text-decoration-thickness:2px;text-decoration-color:rgba(0,0,0,0.85);opacity:.85}.ant-check-list-content .ant-check-list-highlight{background-color:#e6f7ff}.ant-check-list-content .ant-check-list-highlight .ant-check-list-steps-item .ant-check-list-steps-item-circle{border:1px solid #1890ff}.ant-check-list-content .ant-check-list-highlight .ant-check-list-steps-item .ant-check-list-steps-item-circle .ant-check-list-steps-number{color:#1890ff}.ant-check-list-content .ant-check-list-highlight .ant-check-list-steps-item .ant-check-list-steps-item-description{font-weight:600}.ant-check-list-content .ant-check-list-footer{padding:12px 12px 0;color:rgba(0,0,0,.45);font-size:14px;text-decoration:underline;cursor:pointer}.ant-check-list-content .ant-check-list-close-check{display:flex;flex-direction:column;padding:12px}.ant-check-list-content .ant-check-list-close-check .ant-check-list-close-check-title{margin-bottom:24px;font-weight:500;font-size:16px}.ant-check-list-content .ant-check-list-close-check .ant-check-list-close-check-action{display:flex;flex-direction:row;gap:8px;margin-bottom:16px}.ant-check-list-content .ant-check-list-close-check .ant-check-list-close-check-other{color:rgba(0,0,0,.45);font-size:14px;cursor:pointer}