Сергей delphinpro

function getData() {
  //...
  return new Promise((resolve, reject) => {
    xhr.onreadystatechange = function () {
        if (xhr.readyState != 4) reject(xhr.statusText);
        if (xhr.status != 200) {
          reject(xhr.statusText);
        } else {
          resolve(xhr.responseText);
        }
    };
    xhr.send();
  });
}

// use

getData()
  .then(function(response){
    console.log('Its OK', response);
  })
  .catch(function(errorText){
    console.log('Error:', errorText);
  });

$base-delay: 100ms;
@for $i from 0 through 400 {
  .item#{$i} {
    animation-delay: $base-delay + $i;
    animation-name: myanimation
  }
}
@keyframes myanimation { .... }

.spinner { display: none; }
body:not(.app-mounted) .spinner {
  display: block;
}

new Vue({
  …
  mounted(){
    this.$nextTick(()=>document.body.classList.add('app-mounted'));
  }
});

<template>
	<b-button
		variant="outline-warning"
		class="d-block text-white text-uppercase"
		:disabled="btnLoading"
	>
		<span v-text="buttonText"></span>
		<i class="fas fa-spinner fa-spin" v-if="btnLoading"></i>
	</b-button>
</template>
<script>
...
		data() {
			return {
                tabIndex: 0,
                firstServer: {},
                product: {},

                order: {
                    nickname: '',
                    productId: ''
                },

                btnLoading: false
            }
        },
		
		computed: {
			buttonText() {
				return this.btnLoading
					? 'Подождите'
					: `Купить за ${ this.product.original_price } руб.`;
			}
		}
...
</script>

Фон менял сам!

/*box-shadow: 0 0 4px 2px #ffffffe6;*/
/*background: #ffffffe6;*/
box-shadow: 0 0 4px 2px rgba(255, 255, 255, 0.9);
background: rgba(255, 255, 255, 0.9);

$count: 10;
$baseWidth: 121px;

$sum: ($baseWidth + $baseWidth * $count) / 2 * $count;

gulp.task(
  'sometask',      // название задачи
  ['anothertask'], // выполнить перед задачей
  function(){}     // сама задача
)

gulp.task(
  'sometask',     // название задачи
  gulp.series(    // последовательно выполнить
    'anothertask',  // другие задачи
     function(){}   // и саму задачу
  )
)

gulp.task(
  'sometask',     // название задачи
  gulp.series('anothertask'),  // выполнить другие задачи
  function(){}   // и саму задачу
)

if ($(this).scrollTop() >= window.clientHeight * 0.03) {

}

if ($(this).scrollTop() >= document.documentElement.clientHeight * 0.03) {

}
// или 
if ($(this).scrollTop() >= window.innerHeight * 0.03) {

}

gulp.task('build', gulp.parallel('clean', 'nunjucks', 'sass', 'scripts', 'css-libs', 'img'), function(cb) {
  var buildHtml = gulp.src('app/*.html')
  .pipe(gulp.dest('dist'))
  .on('end', function(){
    cb();// сигналим о завершении
  })

gulp.task('clean', function(cb) {
  del('dist').then( (paths) => {
    cb(); // сигналим о завершении
  }); 
});

gulp.series(
  'clean',
   gulp.parallel(все остальное)
)

.myslider:not(.owl-loaded) {
  height: 300px;
  overflow-y: scroll;
}