pm-controls/source/app/controls/components/busy-indicator/busy-indicator-linear/busy-indicator-linear.css

ProModel Controls

@keyframes indeterminate-rotate {
    0%       { transform: rotate(0deg); }
    100%     { transform: rotate(360deg); }
}

.busy-indicator-linear {
  position: relative;
  display: block;
  height: 20px;
  width: 20px;
}

.busy-indicator-linear-container {
  position: absolute;
  overflow: hidden;
  top: 0;
  left: 0;
  animation: indeterminate-rotate 1568.63ms linear infinite;
}

.busy-indicator-linear-path {
    stroke-dashoffset: 200px;
    stroke-dasharray: 37px;
    stroke: #4d90fe;
}

.linear-bar {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 100%;
  height: 5px;
  background-color: rgb(16,108,200);

  -webkit-transition:-webkit-transform .2s linear;
  transition:-webkit-transform .2s linear;
  transition:transform .2s linear;
  transition:transform .2s linear,-webkit-transform .2s linear;
}

.linear-bar-container {
  background-color: rgb(170,209,249);
  display: block;
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 5px;
  -webkit-transform: translate(0,0) scale(1,1);
  transform: translate(0,0) scale(1,1);
}