Charlotte Moore

I am an ambitious adventurer, but apart from that, pretty simple person.

5k followers

HTML
JS

              
                <!-- Author Section -->
                <div id="SVGwave1BottomSMShape" class="svg-preloader position-relative text-center gradient-overlay-half-info-v1 bg-img-hero overflow-hidden space-top-2 space-top-md-3" style="background-image: url(../../assets/img/1920x800/img10.jpg);">
                  <div class="row justify-content-md-center">
                    <div class="col-md-8 col-lg-7 col-xl-5">
                      <!-- Info -->
                      <div class="mb-4">
                        <h1 class="display-4 text-white font-weight-normal mb-3">Charlotte Moore</h1>

                        <ul class="list-inline">
                          <li class="list-inline-item">
                            <a class="text-white-70" href="#">
                              <span class="fas fa-map-marker-alt"></span>
                              California
                            </a>
                          </li>
                          <li class="list-inline-item">
                            <a class="text-white-70" href="#">
                              <span class="fas fa-globe"></span>
                              mooreismine.com
                            </a>
                          </li>
                        </ul>

                        <p class="text-white">I am an ambitious adventurer, but apart from that, pretty simple person.</p>
                      </div>
                      <!-- End Info -->

                      <!-- Followers -->
                      <div class="d-flex justify-content-center align-items-center mb-7">
                        <!-- Followers List -->
                        <ul class="list-inline mr-2 mb-0">
                          <li class="list-inline-item mr-0">
                            <div class="u-sm-avatar u-sm-avatar--bordered rounded-circle">
                              <img class="img-fluid rounded-circle" src="../../assets/img/32x32/img1.jpg" alt="Image Description">
                            </div>
                          </li>
                          <li class="list-inline-item ml-n3 mr-0">
                            <div class="u-sm-avatar u-sm-avatar--bordered rounded-circle">
                              <img class="img-fluid rounded-circle" src="../../assets/img/32x32/img3.jpg" alt="Image Description">
                            </div>
                          </li>
                          <li class="list-inline-item ml-n3 mr-0">
                            <div class="u-sm-avatar u-sm-avatar--bordered rounded-circle">
                              <img class="img-fluid rounded-circle" src="../../assets/img/32x32/img2.jpg" alt="Image Description">
                            </div>
                          </li>
                          <li class="list-inline-item ml-n3 mr-0">
                            <div class="u-sm-avatar u-sm-avatar--bordered rounded-circle">
                              <img class="img-fluid rounded-circle" src="../../assets/img/32x32/img4.jpg" alt="Image Description">
                            </div>
                          </li>
                          <li class="list-inline-item ml-n3 mr-0">
                            <div class="u-sm-avatar u-sm-avatar--bordered rounded-circle">
                              <img class="img-fluid rounded-circle" src="../../assets/img/32x32/img5.jpg" alt="Image Description">
                            </div>
                          </li>
                        </ul>
                        <!-- End Followers List -->

                        <div class="mr-3">
                          <small class="text-white-70">5k followers</small>
                        </div>

                        <button type="button" class="btn btn-xs text-primary font-weight-semi-bold btn-white transition-3d-hover">
                          <span class="fas fa-user-plus mr-2"></span>
                          Follow
                        </button>
                      </div>
                      <!-- End Followers -->

                      <!-- Avatar -->
                      <div class="u-xl-avatar u-xl-avatar--bordered rounded-circle mx-auto">
                        <img class="img-fluid rounded-circle" src="../../assets/img/160x160/img1.jpg" alt="Image Description">
                      </div>
                      <!-- End Avatar -->
                    </div>
                  </div>

                  <!-- SVG Background -->
                  <figure class="position-absolute right-0 bottom-0 left-0 z-index-n1">
                    <img class="js-svg-injector" src="../../assets/svg/components/wave-1-bottom-sm.svg" alt="Image Description"
                         data-parent="#SVGwave1BottomSMShape">
                  </figure>
                  <!-- End SVG Background -->
                </div>
                <!-- End Author Section -->

              
                <!-- JS Implementing Plugins -->
                <script src="../../assets/vendor/svg-injector/dist/svg-injector.min.js"></script>

                <!-- JS Front -->
                <script src="../../assets/js/components/hs.svg-injector.js"></script>

                <!-- JS Plugins Init. -->
                <script>
                  $(document).on('ready', function () {
                    // initialization of svg injector module
                    $.HSCore.components.HSSVGIngector.init('.js-svg-injector');
                  });
                </script>