Модуль отображает процесс загрузки страницы в процентах и с помощью прогрессера
Подключение модуля
[HTML] для всех HTML-страниц, где нужно использовать прелоадер, добавляем подключение файла html/_preloader.htm
@@include('html/_preloader.htm',{})
Сделать это нужно внизу файла перед подключением @@include(‘html/_js.htm’,{}), можно использовать снипет
prl
[CSS] для редактирования стилей прелоадера нужно зайти в файл html/_preloader.htm и редактировать стили для классов прелоадера:
<style>
/* Главный блок */
.fls-preloader{
pointer-events: none;
z-index: -1;
position: fixed;
width: 100%;
height: 100%;
top: 0;
left: 0;
display: flex;
justify-content:center;
align-items: center;
}
/* Блок с элементами */
.fls-preloader__body{
padding: 0.93rem;
max-width: 31.25rem;
display: flex;
flex-direction: column;
}
/* Блок со счетчиком */
.fls-preloader__counter{
font-size: 10rem;
}
/* Прогресс бар */
.fls-preloader__line{}
/* Лінія прогресбару */
.fls-preloader__line span{
display: inline-block;
height: 0.8rem;
background-color: #7A956B;
}
</style>