@5minds/node-red-dashboard-2-processcube-process-progress-bar
Version:
A ui component for showing progress bars tracking a process
48 lines (43 loc) • 837 B
CSS
.progressBarWrapper {
display: grid;
align-items: center;
gap: 8px;
padding: 40px;
border-radius: 8px;
border: 2px solid #F6F5FA;
background: #FFF;
margin-left: 92px;
margin-right: 92px;
margin-bottom: 32px;
}
.progressBarWrapper .progressBarStep {
display: flex;
align-items: center;
gap: 8px;
padding: 16px;
}
.progressBarWrapper .currentStep {
border-radius: 15px;
border: 4px solid #8899C9;
}
.progressBarWrapper .finishedStep {
border-radius: 15px;
background: #8899C9;
color: #FFF;
}
.progressBarWrapper hr {
border-radius: 2px;
border: none;
height: 4px;
background: #4A4759;
}
.progressBarWrapper .coloredConnection {
background: #8899C9;
}
.progressBarWrapper span {
font-size: 21px;
font-style: normal;
font-weight: 400;
line-height: normal;
white-space: nowrap;
}