Yarninator/toddler_shop_frontend
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Implemented bootstrap grid

Browse source
This commit is contained in:
Yarne Coppens 2024-08-05 17:51:55 +02:00
parent 3304a162ef
commit c478e40ade
1 changed files with 52 additions and 35 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

107
index.html
View file

@ -18,59 +18,76 @@
<img class="product_image"> <img class="product_image">
<div class="container text-center product_placeholder">
<div class="row row-cols-5">
<div class="col product_col">
<div class="card" style="width: 10rem; height: 15rem;">
<img src="" class="card-img-top product_image" alt="">
<div class="card-body">
<h5 class="card-title product_price"></h5>
</div>
</div>
</div>
<div class="col product_col">
<div class="card" style="width: 10rem; height: 15rem;">
<img src="" class="card-img-top product_image" alt="">
<div class="card-body">
<h5 class="card-title product_price"></h5>
</div>
</div>
</div>
<div class="col product_col">
<div class="card" style="width: 10rem; height: 15rem;">
<img src="" class="card-img-top product_image" alt="">
<div class="card-body">
<h5 class="card-title product_price"></h5>
</div>
</div>
</div>
<div class="col product_col">
<div class="card" style="width: 10rem; height: 15rem;">
<img src="" class="card-img-top product_image" alt="">
<div class="card-body">
<h5 class="card-title product_price"></h5>
</div>
</div>
</div>
<div class="col product_col">
<div class="card" style="width: 10rem; height: 15rem;">
<img src="" class="card-img-top product_image" alt="">
<div class="card-body">
<h5 class="card-title product_price"></h5>
</div>
</div>
</div>
</div>
<div class="row row-cols-5">
<div class="col">
<div class="card" style="width: 10rem; height: 7rem;">
<div class="container text-center product_placeholder"> <div class="container text-center product_placeholder">
<div class="row"> <div class="row">
<div class="col product_col"> <div class="col">
<div class="card" style="width: 18rem;"> <img src="http://127.0.0.1:8000/icons/cart" height="100rem" width="100rem" class="card-img-top" alt="">
<img src="http://127.0.0.1:8000/icons/pizza" class="card-img-top product_image">
<div class="card-body">
<h5 class="card-title product_price">Card title</h5>
</div> </div>
</div> <div class="col">
</div> <h5 class="card-title" id="totalprice">&euro; 0</h5>
<div class="col product_col">
<div class="card" style="width: 18rem;">
<img src="http://127.0.0.1:8000/icons/banana" class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">Card title</h5>
</div>
</div>
</div>
<div class="col product_col">
<div class="card" style="width: 18rem;">
<img src="..." class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">Card title</h5>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="col">
<p id="totalprice">&euro; 0</p> <div class="card" style="width: 10rem; height: 7rem;">
<img src="http://127.0.0.1:8000/icons/cash" height="100rem" width="100rem" class="card-img-top" alt="">
<button class="button is-success"> </div>
<i> </div>
<svg width="90" height="90"> <div class="col">
<image class="product_image" xlink:href="http://127.0.0.1:8000/icons/cart" width="50" height="50"/> <div class="card" style="width: 10rem; height: 7rem;">
</svg> <img src="http://127.0.0.1:8000/icons/creditcard" height="100rem" width="100rem" class="card-img-top" alt="">
</i> </div>
</button> </div>
<button class="button is-success"> </div>
<i> </div>
<svg width="90" height="90">
<image class="product_image" xlink:href="http://127.0.0.1:8000/icons/creditcard" width="50" height="50"/>
</svg>
</i>
</button>
<button class="button is-success">
<i>
<svg width="90" height="90">
<image class="product_image" xlink:href="http://127.0.0.1:8000/icons/cash" width="50" height="50"/>
</svg>
</i>
</button>
</body> </body>