Starbelly documentation

Thank you for purchasing!

App HTML marcup



<!DOCTYPE html>
      <html lang="zxx">

      <head>
        ...
      </head>

      <body>
        <!-- app wrapper -->
        <div class="sb-app">
          <!-- preloader -->
          <div class="sb-preloader">
            ...
          </div>
          <!-- preloader end -->
          <!-- click effect -->
          <div class="sb-click-effect"></div>
          <!-- loader -->
          <div class="sb-load"></div>
          <!-- top bar -->
          <div class="sb-top-bar-frame">
            <div class="sb-top-bar-bg"></div>
            <div class="container">
              <div class="sb-top-bar">
                <a href="home-2.html" class="sb-logo-frame">
                  ...
                </a>
                <!-- menu -->
                <div class="sb-right-side">
                  <nav id="sb-dynamic-menu" class="sb-menu-transition">
                    <ul class="sb-navigation">
                      ...
                    </ul>
                  </nav>
                  <div class="sb-buttons-frame">
                    ...
                  </div>
                </div>
              </div>
            </div>
            <!-- info bar -->
            <div class="sb-info-bar">
              ...
            </div>
            <!-- info bar end -->
            <!-- minicart -->
            <div class="sb-minicart">
              ...
            </div>
            <!-- minicart end -->
          </div>
          <!-- top bar end -->

          <!-- dynamic content -->
          <div id="sb-dynamic-content" class="sb-transition-fade">

            <!-- banner -->
            <section class="sb-banner">
              ...
            </section>
            <!-- banner end -->

            <!-- CONTENT HERE -->

            <!-- footer -->
            <footer>
              ...
            </footer>
            <!-- footer end -->

          </div>
          <!-- dynamic content end -->

          <!-- discount popup -->
          <div class="sb-popup-frame">
            ...
          </div>
          <!-- discount popup end -->

        </div>
        <!-- app wrapper end -->

        ...

      </body>

      </html>


CSS assets

Plugins


Starbelly scss


Starbelly css



<head>
        ...
        <!-- font awesome css -->
        <link rel="stylesheet" href="css/plugins/font-awesome.min.css">
        <!-- bootstrap css -->
        <link rel="stylesheet" href="css/plugins/bootstrap.min.css">
        <!-- swiper css -->
        <link rel="stylesheet" href="css/plugins/swiper.min.css">
        <!-- mapbox css -->
        <link href="css/plugins/mapbox-style.css" rel='stylesheet'>
        <!-- fancybox css -->
        <link rel="stylesheet" href="css/plugins/fancybox.min.css">
        <!-- starbelly css -->
        <link rel="stylesheet" href="css/style.css">
        ...
      </head>


Js assets

Plugins


Starbelly assets



<body>
        ...
        <!-- jquery js -->
        <script src="js/plugins/jquery.min.js"></script>
        <!-- smooth scroll js -->
        <script src="js/plugins/smooth-scroll.js"></script>
        <!-- swup js -->
        <script src="js/plugins/swup.min.js"></script>
        <!-- swiper js -->
        <script src="js/plugins/swiper.min.js"></script>
        <!-- isotope js -->
        <script src="js/plugins/isotope.js"></script>
        <!-- sticky -->
        <script src="js/plugins/sticky.js"></script>
        <!-- mapbox js -->
        <script src="js/plugins/mapbox.min.js"></script>
        <!-- fancybox js -->
        <script src="js/plugins/fancybox.min.js"></script>
        <!-- starbelly js -->
        <script src="js/main.js"></script>
      </body>


Fonts


Icons