Files
marmeladenladen/components/homepage.html
2022-05-01 19:02:52 +02:00

182 lines
10 KiB
HTML

<div id="marmeladenLadencarousel" class="carousel slide" data-bs-ride="carousel">
<ol class="carousel-indicators">
<li data-bs-target="#marmeladenLadencarousel" data-bs-slide-to="0" class="active"></li>
<li data-bs-target="#marmeladenLadencarousel" data-bs-slide-to="1"></li>
<li data-bs-target="#marmeladenLadencarousel" data-bs-slide-to="2"></li>
</ol>
<div class="carousel-inner">
<div class="carousel-item active">
<div class="container">
<div class="row p-5">
<div class="mx-auto col-md-8 col-lg-6 order-lg-last">
<img class="img-fluid rounded-circle shadow" src="../res/img/jam.jpg" alt="">
</div>
<div class="col-lg-6 mb-0 d-flex align-items-center">
<div class="text-align-left align-self-center">
<h1 class="h1 text-success">MarmeladenLaden</h1>
<h3 class="h2">Aliquip ex ea commodo consequat</h3>
<p>
Occaecat velit enim pariatur mollit et aliquip in nulla Lorem tempor nisi laboris
proident ad id amet tempor sint eu sunt esse duis incididunt exercitation eiusmod veniam
fugiat non aliqua ullamco eiusmod eiusmod est adipisicing
in est commodo consectetur enim dolore ea non id aliquip aliqua dolore nostrud cillum ea
cillum ipsum dolore enim sunt fugiat qui eu sint laborum do veniam nulla et cillum minim
consectetur eiusmod et mollit aliquip sit occaecat
consectetur duis cillum officia pariatur officia ad pariatur ullamco excepteur cupidatat
reprehenderit tempor qui cillum reprehenderit sit qui veniam proident est officia
proident aute sunt consectetur ullamco.
</p>
</div>
</div>
</div>
</div>
</div>
<div class="carousel-item">
<div class="container">
<div class="row p-5">
<div class="mx-auto col-md-8 col-lg-6 order-lg-last">
<img class="img-fluid rounded-circle shadow" src="../res/img/berries.jpg" alt="">
</div>
<div class="col-lg-6 mb-0 d-flex align-items-center">
<div class="text-align-left">
<h1 class="h1">Proident occaecat</h1>
<h3 class="h2">Aliquip ex ea commodo consequat</h3>
<p>
Occaecat velit enim pariatur mollit et aliquip in nulla Lorem tempor nisi laboris
proident ad id amet tempor sint eu sunt esse duis incididunt exercitation eiusmod veniam
fugiat non aliqua ullamco eiusmod eiusmod est adipisicing
in est commodo consectetur enim dolore ea non id aliquip aliqua dolore nostrud cillum ea
cillum ipsum dolore enim sunt fugiat qui eu sint laborum do veniam nulla et cillum minim
consectetur eiusmod et mollit aliquip sit occaecat
consectetur duis cillum officia pariatur officia ad pariatur ullamco excepteur cupidatat
reprehenderit tempor qui cillum reprehenderit sit qui veniam proident est officia
proident aute sunt consectetur ullamco.
</p>
</div>
</div>
</div>
</div>
</div>
<div class="carousel-item">
<div class="container">
<div class="row p-5">
<div class="mx-auto col-md-8 col-lg-6 order-lg-last">
<img class="img-fluid rounded-circle shadow" src="../res/img/cottage.jpg" alt="">
</div>
<div class="col-lg-6 mb-0 d-flex align-items-center">
<div class="text-align-left">
<h1 class="h1">Repr in voluptate</h1>
<h3 class="h2">Ullamco laboris nisi ut </h3>
<p>
Occaecat velit enim pariatur mollit et aliquip in nulla Lorem tempor nisi laboris
proident ad id amet tempor sint eu sunt esse duis incididunt exercitation eiusmod veniam
fugiat non aliqua ullamco eiusmod eiusmod est adipisicing
in est commodo consectetur enim dolore ea non id aliquip aliqua dolore nostrud cillum ea
cillum ipsum dolore enim sunt fugiat qui eu sint laborum do veniam nulla et cillum minim
consectetur eiusmod et mollit aliquip sit occaecat
consectetur duis cillum officia pariatur officia ad pariatur ullamco excepteur cupidatat
reprehenderit tempor qui cillum reprehenderit sit qui veniam proident est officia
proident aute sunt consectetur ullamco.
</p>
</div>
</div>
</div>
</div>
</div>
</div>
<a class="carousel-control-prev text-decoration-none w-auto ps-3" href="#marmeladenLadencarousel" role="button"
data-bs-slide="prev">
<i class="fas fa-chevron-left"></i>
</a>
<a class="carousel-control-next text-decoration-none w-auto pe-3" href="#marmeladenLadencarousel" role="button"
data-bs-slide="next">
<i class="fas fa-chevron-right"></i>
</a>
</div>
<section class="bg-light">
<div class="container py-5">
<div class="row text-center py-3">
<div class="col-lg-6 m-auto">
<h1 class="h1">Featured Product</h1>
<p>
Reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident.
</p>
</div>
</div>
<div class="row">
<div class="col-12 col-md-4 mb-4">
<div class="card h-100">
<a href="shop-single.html">
<img src="./assets/img/feature_prod_01.jpg" class="card-img-top" alt="...">
</a>
<div class="card-body">
<ul class="list-unstyled d-flex justify-content-between">
<li>
<i class="text-warning fa fa-star"></i>
<i class="text-warning fa fa-star"></i>
<i class="text-warning fa fa-star"></i>
<i class="text-muted fa fa-star"></i>
<i class="text-muted fa fa-star"></i>
</li>
<li class="text-muted text-right">$240.00</li>
</ul>
<a href="shop-single.html" class="h2 text-decoration-none text-dark">Gym Weight</a>
<p class="card-text">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sunt in culpa qui officia deserunt.
</p>
<p class="text-muted">Reviews (24)</p>
</div>
</div>
</div>
<div class="col-12 col-md-4 mb-4">
<div class="card h-100">
<a href="shop-single.html">
<img src="./assets/img/feature_prod_02.jpg" class="card-img-top" alt="...">
</a>
<div class="card-body">
<ul class="list-unstyled d-flex justify-content-between">
<li>
<i class="text-warning fa fa-star"></i>
<i class="text-warning fa fa-star"></i>
<i class="text-warning fa fa-star"></i>
<i class="text-muted fa fa-star"></i>
<i class="text-muted fa fa-star"></i>
</li>
<li class="text-muted text-right">$480.00</li>
</ul>
<a href="shop-single.html" class="h2 text-decoration-none text-dark">Cloud Nike Shoes</a>
<p class="card-text">
Aenean gravida dignissim finibus. Nullam ipsum diam, posuere vitae pharetra sed, commodo ullamcorper.
</p>
<p class="text-muted">Reviews (48)</p>
</div>
</div>
</div>
<div class="col-12 col-md-4 mb-4">
<div class="card h-100">
<a href="shop-single.html">
<img src="./assets/img/feature_prod_03.jpg" class="card-img-top" alt="...">
</a>
<div class="card-body">
<ul class="list-unstyled d-flex justify-content-between">
<li>
<i class="text-warning fa fa-star"></i>
<i class="text-warning fa fa-star"></i>
<i class="text-warning fa fa-star"></i>
<i class="text-warning fa fa-star"></i>
<i class="text-warning fa fa-star"></i>
</li>
<li class="text-muted text-right">$360.00</li>
</ul>
<a href="shop-single.html" class="h2 text-decoration-none text-dark">Summer Addides Shoes</a>
<p class="card-text">
Curabitur ac mi sit amet diam luctus porta. Phasellus pulvinar sagittis diam, et scelerisque ipsum lobortis nec.
</p>
<p class="text-muted">Reviews (74)</p>
</div>
</div>
</div>
</div>
</div>
</section>