iolovolio/components/homeTemplate/homeTemplate.html

<div class="component-homeTemplate">
  <div class="banner">
    <div class="container logo-container">
      <img class="logo" src="/images/logo.png">
    </div>
    <button class="scroll icon-angle-down"></button>
  </div>

  <div class="products">
    <div class="container">
      <div class="row py-4">
        <div class="col-5 d-none d-md-flex">
          <img class="main-image" src="/images/homeProducts.png">
        </div>
        <div class="col-12 col-md-7">
          <div class="slider">
            <?php
              $q = mysqli_query($conn, "SELECT * FROM products");
              while($r = mysqli_fetch_array($q)){
            ?>
            <div class="slide">
              <div class="row">
                <div class="col-12 col-md-7">
                  <img class="image" src="<?= '/images/products/'.$r['id'].'.png';?>">
                </div>
                <div class="col-12 col-md-5">
                  <div class="description">
                    <span class="title"><?= $r['name'];?></span>
                    <span class="subtitle"><?= $r['description'];?></span>
                    <a class="link" href="/acquistare/<?= $r['id'];?>/<?= $r['name'];?>">
                      <span class="icon icon-buy"></span>
                      <span class="label">acquista</span>
                    </a>
                  </div>
                </div>
              </div>
            </div>
            <?php
              }
          ?>
          </div>
        </div>
      </div>
    </div>
  </div>


  <div class="bio">
    <div class="container">
      <div class="row no-gutters py-4">
        <div class="col-12 col-md-5 d-flex">
          <img class="main-image" src="/images/homeDescription.png">
        </div>
        <div class="col-12 col-sm-8 col-md-7 mx-auto d-flex">
          <div class="description">
            <img class="logo" src="/images/logoHeader.png">
            <span class="d-block text-left">
            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla lobortis diam turpis, in pulvinar augue cursus ut. Donec in felis et metus semper condimentum vel id sem. Duis vestibulum purus ut dui suscipit, sit amet sodales lacus auctor. Praesent et bibendum massa.
            <br><br>
            Duis bibendum rutrum augue, et sollicitudin risus tempor at. Fusce eget varius diam. Suspendisse molestie odio est, vel egestas diam aliquet et. Quisque blandit turpis magna, id cursus nisi luctus ac.
            </span>

            <a class="goto button button-transparent" href="/conoscere">Leggi di più</a>
        </div>
      </div>
    </div>
  </div>

  <?php
    @include('components/content/content-recount-index.php');
  ?>

  <a class="goto button button-transparent" href="/raccontare">Leggi di più</a>
</div>