Bootstrap Features

Discover 16 Bootstrap Features available in Loopple

Feature 1

Component from Soft UI Design System Builder

<section class="py-4 draggable">
  <div class="container">
    <div class="row">
      <div class="col-lg-6">
        <h3 class="text-gradient text-primary mb-0 mt-2">Read More About Us</h3>
        <h3>The most important</h3>
        <p>Pain is what we go through as we become older. We get insulted by others, lose trust for those others. We get back stabbed by friends. It becomes harder for us to give others a hand.</p>
        <a href="javascript:;" class="text-primary icon-move-right">More about us
          <i class="fas fa-arrow-right text-sm ms-1"></i>
        </a>
      </div>
      <div class="col-lg-6 mt-lg-0 mt-5 ps-lg-0 ps-0">
        <div class="p-3 info-horizontal">
          <div class="icon icon-shape rounded-circle bg-gradient-primary shadow text-center">
            <i class="fas fa-ship opacity-10"></i>
          </div>
          <div class="description ps-3">
            <p class="mb-0">It becomes harder for us to give others a hand. <br> We get our heart broken by people we love.</p>
          </div>
        </div>

        <div class="p-3 info-horizontal">
          <div class="icon icon-shape rounded-circle bg-gradient-primary shadow text-center">
            <i class="fas fa-handshake opacity-10"></i>
          </div>
          <div class="description ps-3">
            <p class="mb-0">As we live, our hearts turn colder. <br>Cause pain is what we go through as we become older.</p>
          </div>
        </div>
        <div class="p-3 info-horizontal">
          <div class="icon icon-shape rounded-circle bg-gradient-primary shadow text-center">
            <i class="fas fa-hourglass opacity-10"></i>
          </div>
          <div class="description ps-3">
            <p class="mb-0">When we lose family over time. <br> What else could rust the heart more over time? Blackgold.</p>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>

Feature 2

Component from Soft UI Design System Builder

<section class="py-4 draggable">
  <div class="container">
    <div class="row">
      <div class="col-md-4 col-10 mx-auto">
        <div class="p-3 text-center">
          <img class="w-50 mb-3" src="https://demos.creative-tim.com/soft-ui-design-system-pro/assets/img/logos/medium-logos/logo-google.svg">
          <p>We get insulted by others, lose trust for those others. We get back here to follow my dreams</p>
          <a href="javascript:;" class="icon-move-right text-dark text-sm">Read more
            <i class="fas fa-arrow-right text-xs ms-1"></i>
          </a>
        </div>
      </div>
      <div class="col-md-4 col-10 mx-auto">
        <div class="p-3 text-center">
          <img class="w-50 mb-3" src="https://demos.creative-tim.com/soft-ui-design-system-pro/assets/img/logos/medium-logos/logo-vodafone.svg">
          <p>We get insulted by others, lose trust for those others. We get back here to follow my dreams</p>
          <a href="javascript:;" class="icon-move-right text-dark text-sm">Read more
            <i class="fas fa-arrow-right text-xs ms-1"></i>
          </a>
        </div>
      </div>
      <div class="col-md-4 col-10 mx-auto">
        <div class="p-3 text-center">
          <img class="w-50 mb-3" src="https://demos.creative-tim.com/soft-ui-design-system-pro/assets/img/logos/medium-logos/logo-coinbase.svg">
          <p>We get insulted by others, lose trust for those others. We get back here to follow my dreams</p>
          <a href="javascript:;" class="icon-move-right text-dark text-sm">Read more
            <i class="fas fa-arrow-right text-xs ms-1"></i>
          </a>
        </div>
      </div>
    </div>
  </div>
</section>