luke-else/WMGZON
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Made each product a link to its own product page

Browse Source
This commit is contained in:
Luke Else 2024-01-18 19:40:02 +00:00
parent 43b85c9b23
commit bd3481c2cc
2 changed files with 25 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
static/css/products.css
View File

@ -1,5 +1,28 @@
/* Product Information*/ /* Product Information*/
.product-link:after {
content: '';
position: absolute;
bottom: 0;
left: 15%;
width: 0%;
border-bottom: 2px solid var(--fg);
transition: 0.4s;
}
.product-link:hover:after {
width: 70%;
color: var(--hover);
}
.product-link:hover {
color: var(--hover);
}
.product-link:active {
color: var(--header);
}
.product-container { .product-container {
width: 95%; width: 95%;
background-color: var(--bg-grad-3); background-color: var(--bg-grad-3);

4
templates/content.html
View File

@ -3,7 +3,7 @@
<div class="product-container"> <div class="product-container">
{% if products != None %} {% if products != None %}
{% for product in products %} {% for product in products %}
<div class="product"> <a href="/products/{{product.id}}" class="product product-link">
<div class="product-title">{{product.name}}</div> <div class="product-title">{{product.name}}</div>
<div class="product-information"> <div class="product-information">
<div class="product-image"> <div class="product-image">
@ -15,7 +15,7 @@
</div> </div>
</div> </div>
<div class="product-add-to-cart"></div> <div class="product-add-to-cart"></div>
</div> </a>
{% endfor %} {% endfor %}
{% endif %} {% endif %}
</div> </div>