Contents

.c-progress {
  --progress-bar-color: #fff;
  --progress-bar-background-color: var(--color-default);

  display: block;
  overflow: hidden;
  color: var(--progress-bar-color);
  text-align: center;
  background-color: var(--color-background);
  border: 0;
  border-radius: var(--border-radius);

  &.c-progress--rounded {
    border-radius: var(--border-radius-rounded);
  }

  &.c-progress--timer {
    --border-radius: 0;
    height: 3px;

    .c-progress__bar[role='progressbar'] {
      width: 0;
      animation-name: slide;
      animation-duration: 10s;
      animation-timing-function: linear;
      animation-iteration-count: infinite;
      animation-fill-mode: forwards;
    }

    @keyframes slide {
      from {
        width: 0;
      }

      95% {
        width: 100%;
        opacity: 1;
      }

      100% {
        width: 100%;
        opacity: 0;
      }
    }
  }

  .c-progress__bar[role='progressbar'] {
    display: block;
    float: left;
    height: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    background-color: var(--progress-bar-background-color);
    border-radius: 0;

    &::after {
      color: transparent !important;
      content: '-';
    }

    &.c-progress__bar--brand {
      --progress-bar-background-color: var(--color-brand);
    }

    &.c-progress__bar--info {
      --progress-bar-background-color: var(--color-info);
    }

    &.c-progress__bar--warning {
      --progress-bar-color: #000;
      --progress-bar-background-color: var(--color-warning);
    }

    &.c-progress__bar--success {
      --progress-bar-background-color: var(--color-success);
    }

    &.c-progress__bar--error {
      --progress-bar-background-color: var(--color-error);
    }
  }
}

Version data entries

3 entries across 3 versions & 1 rubygems

Version	Path
activeadmin_blaze_theme-0.7.0	app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.progress.scss
activeadmin_blaze_theme-0.6.2	app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.progress.scss
activeadmin_blaze_theme-0.6.0	app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.progress.scss