| @ -1,11 +1,155 @@ | |||
| <!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-4.dtd"> | |||
| <html lang="es" | |||
| xmlns="http://www.w3.org/1999/xhtml" | |||
| xmlns:th="http://www.thymeleaf.org"> | |||
| xmlns:th="http://www.thymeleaf.org" | |||
| xmlns:sec="http://www.thymeleaf.org/extras/spring-security"> | |||
| <head th:replace="head/head :: mihead"></head> | |||
| <body> | |||
| Hola mundo | |||
| <img src="img/que-significa-sonar-que-muerde-perro_98.avif"> | |||
| <header th:replace="~{menu/m1 :: usuarios}"></header> | |||
| <div id="espaciado"> | |||
| </div> | |||
| <main class="my-4"> | |||
| <div class="container"> | |||
| <!--Section: Content--> | |||
| <section class="text-center"> | |||
| <h4 class="mb-4"><strong>Pricing</strong></h4> | |||
| <div class="btn-group mb-4" role="group" aria-label="Basic example"> | |||
| <button type="button" class="btn btn-primary active">Monthly billing</button> | |||
| <button type="button" class="btn btn-primary"> | |||
| Annual billign <small>(2 months FREE)</small> | |||
| </button> | |||
| </div> | |||
| <div class="row"> | |||
| <!--Grid column--> | |||
| <div class="col-lg-3 col-md-6 mb-4"> | |||
| <!-- Card --> | |||
| <div class="card"> | |||
| <div class="card-header bg-white py-3"> | |||
| <p class="text-uppercase small mb-2"><strong>Free</strong></p> | |||
| <h5 class="mb-0">Free</h5> | |||
| </div> | |||
| <div class="card-body"> | |||
| <ul class="list-group list-group-flush"> | |||
| <li class="list-group-item">Feature</li> | |||
| <li class="list-group-item">Feature</li> | |||
| <li class="list-group-item">Feature</li> | |||
| </ul> | |||
| </div> | |||
| <div class="card-footer bg-white py-3"> | |||
| <button type="button" class="btn btn-success btn-sm">Get it</button> | |||
| </div> | |||
| </div> | |||
| <!-- Card --> | |||
| </div> | |||
| <!--Grid column--> | |||
| <!--Grid column--> | |||
| <div class="col-lg-3 col-md-6 mb-4"> | |||
| <!-- Card --> | |||
| <div class="card border border-primary"> | |||
| <div class="card-header bg-white py-3"> | |||
| <p class="text-uppercase small mb-2"><strong>Essential</strong></p> | |||
| <h5 class="mb-0">$19/month</h5> | |||
| </div> | |||
| <div class="card-body"> | |||
| <ul class="list-group list-group-flush"> | |||
| <li class="list-group-item">Feature</li> | |||
| <li class="list-group-item">Feature</li> | |||
| <li class="list-group-item">Feature</li> | |||
| <li class="list-group-item">Feature</li> | |||
| </ul> | |||
| </div> | |||
| <div class="card-footer bg-white py-3"> | |||
| <button type="button" class="btn btn-primary btn-sm">Buy now</button> | |||
| </div> | |||
| </div> | |||
| <!-- Card --> | |||
| </div> | |||
| <!--Grid column--> | |||
| <!--Grid column--> | |||
| <div class="col-lg-3 col-md-6 mb-4"> | |||
| <!-- Card --> | |||
| <div class="card"> | |||
| <div class="card-header bg-white py-3"> | |||
| <p class="text-uppercase small mb-2"><strong>Advanced</strong></p> | |||
| <h5 class="mb-0">$49/month</h5> | |||
| </div> | |||
| <div class="card-body"> | |||
| <ul class="list-group list-group-flush"> | |||
| <li class="list-group-item">Feature</li> | |||
| <li class="list-group-item">Feature</li> | |||
| <li class="list-group-item">Feature</li> | |||
| <li class="list-group-item">Feature</li> | |||
| <li class="list-group-item">Feature</li> | |||
| </ul> | |||
| </div> | |||
| <div class="card-footer bg-white py-3"> | |||
| <button type="button" class="btn btn-info btn-sm">Buy now</button> | |||
| </div> | |||
| </div> | |||
| <!-- Card --> | |||
| </div> | |||
| <!--Grid column--> | |||
| <!--Grid column--> | |||
| <div class="col-lg-3 col-md-6 mb-4"> | |||
| <!-- Card --> | |||
| <div class="card"> | |||
| <div class="card-header bg-white py-3"> | |||
| <p class="text-uppercase small mb-2"><strong>Enterprise</strong></p> | |||
| <h5 class="mb-0">$189/month</h5> | |||
| </div> | |||
| <div class="card-body"> | |||
| <ul class="list-group list-group-flush"> | |||
| <li class="list-group-item">Feature</li> | |||
| <li class="list-group-item">Feature</li> | |||
| <li class="list-group-item">Feature</li> | |||
| <li class="list-group-item">Feature</li> | |||
| <li class="list-group-item">Feature</li> | |||
| <li class="list-group-item">Feature</li> | |||
| </ul> | |||
| </div> | |||
| <div class="card-footer bg-white py-3"> | |||
| <button type="button" class="btn btn-info btn-sm">Buy now</button> | |||
| </div> | |||
| </div> | |||
| <!-- Card --> | |||
| </div> | |||
| <!--Grid column--> | |||
| </div> | |||
| </section> | |||
| <!--Section: Content--> | |||
| </div> | |||
| </main> | |||
| <footer th:replace="foot/pie :: pie"></footer> | |||
| </body> | |||
| </html> | |||