@farris/ui-vue/designer/approval-logs/index.css

Farris Vue, a Farris Design based Vue3 component library.

.fv-approval-logs-design{position:relative}.fv-approval-logs-design .task-log-body{padding:0 14px;white-space:nowrap}.fv-approval-logs-design .log-node{position:relative;padding:0 0 14px 10px;margin:0;font-size:14px;list-style:none}.fv-approval-logs-design .log-node-name{overflow:hidden;text-overflow:ellipsis;font-size:14px;color:#2d2f33}.fv-approval-logs-design .log-node-main-content{display:flex;flex-direction:column;margin-top:8px}.fv-approval-logs-design .log-node-main-content-first{display:flex;flex-grow:1;overflow:hidden}.fv-approval-logs-design .log-timeline-item-tail{position:absolute;left:6.5px;height:100%;border-left:1px solid #ebecee}.fv-approval-logs-design .timeline-item-head{position:absolute;width:14px;height:14px;border-radius:100px;left:0}.fv-approval-logs-design .timeline-item-head-blue{background-color:#388fff;border:3px solid #bdd9ff}.fv-approval-logs-design .log-item-content{position:relative;margin:0 0 0 12px;border-radius:4px}.fv-approval-logs-design .log-item-content-header{display:flex;align-items:baseline}.fv-approval-logs-design .log-avatar-right{display:flex;flex-direction:column;justify-content:center;flex-grow:1;flex-shrink:1;overflow:hidden}.fv-approval-logs-design .log-operator{display:flex;align-items:center;overflow:hidden}.fv-approval-logs-design .log-operator-name{font-size:13px;color:#4297fa;text-align:left;overflow:hidden;text-overflow:ellipsis}.fv-approval-logs-design .log-operator-and-action{display:flex;align-items:center;justify-content:space-between;padding-bottom:4px}.fv-approval-logs-design .log-operator-avatar{padding-right:6px}.fv-approval-logs-design .log-operator-avatar-img{height:30px;width:30px;border-radius:50%;overflow:hidden;background-image:linear-gradient(148deg,#50b0fd 16%,#3a90ff);color:#fff;display:flex;justify-content:center;padding-top:8px}.fv-approval-logs-design .log-operator-avatar-img i{font-size:26px}.fv-approval-logs-design .log-action-name{font-size:12px;color:#fff;border-radius:10px;padding:1px 14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fv-approval-logs-design .log-action-name-submit{background-image:linear-gradient(-45deg,#6ac1ff,#3b91ff);box-shadow:0 2px 4px #3b91ff33}.fv-approval-logs-design .log-action-name-todo{background-image:linear-gradient(134deg,#ff9b13,#f6d365)}.fv-approval-logs-design .log-message-and-times{background:#f5f8fc;border-radius:3px;padding:8px;margin-top:4px;font-size:12px;color:#848c9a}.fv-approval-logs-design .log-log-time{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.fv-approval-logs-design .log-start-time{font-size:12px;color:#848c9a;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fv-approval-logs-design .log-task-read{display:flex;align-items:center;font-size:12px;color:#00000073;padding:4px 0;margin-top:8px;box-shadow:inset 0 1px #e9ecf3}.fv-approval-logs-design .log-task-read-img{width:14px;height:14px;background-image:url("data:image/svg+xml,%3Csvg width='14' height='14' viewBox='0 0 14 14' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdefs%3E%3Cpath id='a' d='M0 0h14v14H0z'/%3E%3C/defs%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cmask id='b' fill='%23fff'%3E%3Cuse xlink:href='%23a'/%3E%3C/mask%3E%3Cg mask='url(%23b)'%3E%3Cpath d='M1 7.387V12h12V7.387a1 1 0 0 0-1.316-.948L7 8 2.316 6.439A1 1 0 0 0 1 7.387z' fill='%23D0D8F1'/%3E%3Cpath d='M7.447 1.224l4.724 2.361A1.5 1.5 0 0 1 13 4.927V11.5a1.5 1.5 0 0 1-1.5 1.5h-9A1.5 1.5 0 0 1 1 11.5V4.927a1.5 1.5 0 0 1 .83-1.342l4.723-2.361a1 1 0 0 1 .894 0zM12 6.538L7.557 8.316a1.5 1.5 0 0 1-.959.052l-.155-.052L2 6.538V11.5a.5.5 0 0 0 .41.492L2.5 12h9a.5.5 0 0 0 .492-.41L12 11.5V6.538zm-5-4.42L2.276 4.48a.5.5 0 0 0-.267.354L2 4.927V5.5c.033 0 .066.003.1.01l.086.026 4.628 1.851a.5.5 0 0 0 .28.027l.092-.027 4.628-1.851a.499.499 0 0 1 .187-.036L12 4.927a.5.5 0 0 0-.197-.398l-.08-.05L7 2.119z' fill='%23B8C0D0' fill-rule='nonzero'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat}.fv-approval-logs-design .log-task-read-text{padding:0 8px}.fv-approval-logs-design--small-screen .task-log-body{padding:16px;line-height:18px}.fv-approval-logs-design--small-screen .log-node{padding:0 0 0 8px}.fv-approval-logs-design--small-screen .log-node-name{font-family:PingFangSC-Medium;padding-bottom:12px;color:#333;line-height:18px;font-weight:500}.fv-approval-logs-design--small-screen .log-node-main-content{flex-direction:row;padding-bottom:20px;margin-top:0}.fv-approval-logs-design--small-screen .log-timeline-item-tail{left:unset;border-color:#ddd}.fv-approval-logs-design--small-screen .timeline-item-head{width:16px;height:16px}.fv-approval-logs-design--small-screen .timeline-item-head-blue{border-width:4px}.fv-approval-logs-design--small-screen .log-item-content{margin:0 0 0 18px}.fv-approval-logs-design--small-screen .log-operator-name{font-size:14px;color:#333;line-height:17px;font-weight:400}.fv-approval-logs-design--small-screen .log-operator-avatar{padding-right:10px}.fv-approval-logs-design--small-screen .log-operator-avatar-img{height:32px;width:32px}.fv-approval-logs-design--small-screen .log-avatar-right{padding-top:4px}.fv-approval-logs-design--small-screen .log-action-name{font-family:PingFangSC-Medium;font-size:14px;border-radius:0;padding:0;background-image:none;background-color:transparent;box-shadow:none}.fv-approval-logs-design--small-screen .log-action-name-submit{color:#3a90ff}.fv-approval-logs-design--small-screen .log-action-name-todo{color:#f59c24}.fv-approval-logs-design--small-screen .log-message-and-times{background:#f7f8fb;border-radius:4px;color:#888;margin-top:8px}.fv-approval-logs-design--small-screen .log-log-time{margin-bottom:2px}.fv-approval-logs-design--small-screen .log-start-time,.fv-approval-logs-design--small-screen .log-log-time,.fv-approval-logs-design--small-screen .log-terminal{font-family:PingFangSC-Regular;font-size:12px;color:#999;line-height:16px;font-weight:400}.fv-approval-logs-design--small-screen .log-start-time{line-height:15px;margin-top:2px}.fv-approval-logs-design--small-screen .log-task-read{color:#999;padding:6px 0;border-top:1px solid #dee5f3;box-shadow:none}.fv-approval-logs-design--small-screen .log-task-read-img{height:6px;width:6px;background-image:none;background-color:#5acbcd;border-radius:50%;margin-right:6px}.fv-approval-logs-design--small-screen .log-task-read-text{padding-left:0;padding-right:6px}.fv-approval-logs{position:relative;overflow:auto;height:100%}.fv-approval-logs .log-no-data{margin-top:0}