Rhye

# Preloader

If you don't need the website preloader, just remove its markup from all the pages.

# Markup: Preloader

<!-- PAGE PRELOADER -->
<div class="preloader text-center" id="js-preloader" data-arts-theme-text="light">
  <div class="preloader__content">
    <!-- header -->
    <div class="preloader__header mt-auto">
      ...
    </div>
    <!-- - header -->
    <!-- counter -->
    <div class="preloader__counter h4">
      ...
    <!-- - counter -->
    <!-- circle holder -->
    <div class="preloader__circle"></div>
    <!-- - circle holder -->
  </div>
</div>
<!-- - PAGE PRELOADER -->

# Markup: Loading Spinner

The spinner is being shown during the AJAX transition. This is an analogue of a mouse loading cursor which we don't have on touch devices. It has d-lg-none class which hides it on desktops.

You can customize it as you'd like or safely remove its markup from all the pages if you don't need it.

<!-- Loading Spinner -->
<svg class="spinner d-lg-none" id="js-spinner" width="65px" height="65px" viewBox="0 0 66 66" xmlns="http://www.w3.org/2000/svg">
  <circle class="spinner__path" fill="none" stroke-width="6" stroke-linecap="round" cx="33" cy="33" r="30"></circle>
</svg>
<!-- - Loading Spinner -->

← Header →