@c8y/style/styles/_loading-bar.less

Styles for Cumulocity IoT applications

.loading-bar {
  position: relative;
  overflow: visible;
  margin-top: 0;
  height: 0;
  &:before {
    position: absolute;
    left: 0;
    display: none;
    min-width: 32px;
    width: 5%;
    height: 2px;
    background: @component-brand-primary;
    content: '';
  }
  &.active {
    animation: loading 1.5s ease-in-out alternate infinite;
    &::before {
      display: block;
    }
  }
}

@keyframes loading {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(95%);
  }
}