@import "~@/asset/style/var";

.liner-progress {
    position: relative;
    height: 4px;
    display: block;
    width: 100%;
    margin: 0;
    overflow: hidden;

    .liner-progress-background {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        background-color: $--color-primary;
        opacity: .3;
    }

    .linear-progress-indeterminate {
        position: absolute;
        top: 0;
        bottom: 0;
        width: 40%;
        background-color: $--color-primary;
        animation: linear-progress-animate .84s cubic-bezier(.445, .05, .55, .95) infinite;
    }

    @keyframes linear-progress-animate {
        0% {
            left: -40%;
        }
        100% {
            left: 100%;
        }
    }
}