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

Massively improved styling of product pages

Browse Source
This commit is contained in:
Luke Else 2024-02-08 20:38:35 +00:00
parent b1ee09e35a
commit c55fdde3fc
3 changed files with 30 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
static/css/style.css
View File

@ -20,24 +20,24 @@ html {
background-color: var(--bg); background-color: var(--bg);
color: var(--fg); color: var(--fg);
font-size: 160%; font-size: 160%;
font-family: 'Courier New', Courier, 'Inter'; font-weight: lighter;
font-family: 'InterVariable', 'Courier New', Courier, 'Inter';
height: 100%; height: 100%;
} }
body { body {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 1rem;
margin: 0; margin: 0;
height: 100%; height: 100%;
} }
.navbar { .navbar {
flex: 0 1 auto; flex: 0 1 auto;
padding: 30px; padding: 5px 30px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 1rem; gap: .3rem;
} }
/* Navbar styling*/ /* Navbar styling*/
@ -163,7 +163,7 @@ a:active {
} }
.category { .category {
margin: .5rem 0rem; margin: 0;
padding: 0rem 1rem; padding: 0rem 1rem;
border-left: .125rem solid var(--fg); border-left: .125rem solid var(--fg);
} }
@ -178,7 +178,6 @@ a:active {
justify-content: flex-start; justify-content: flex-start;
align-items: center; align-items: center;
width: 100%; width: 100%;
gap: 1rem;
flex-direction: column; flex-direction: column;
flex-grow: 1; flex-grow: 1;
height: 1%; height: 1%;

11
templates/content.html
View File

@ -1,7 +1,8 @@
<link rel="stylesheet" href="{{ url_for('static', filename='css/products.css') }}"> <link rel="stylesheet" href="{{ url_for('static', filename='css/products.css') }}">
<div class="product-container"> {% if products != None %}
{% if products != None %} <p>Showing results for {{products|count}} products</p>
<div class="product-container">
{% for product in products %} {% for product in products %}
<a href="/products/{{product.id}}" class="product product-link"> <a href="/products/{{product.id}}" class="product product-link">
<div class="product-title">{{product.name}}</div> <div class="product-title">{{product.name}}</div>
@ -16,5 +17,7 @@
<input type="submit" class="product-add-to-cart" value="Add to Cart" /> <input type="submit" class="product-add-to-cart" value="Add to Cart" />
</a> </a>
{% endfor %} {% endfor %}
{% endif %} </div>
</div> {% else %}
<p>Sorry... We have nothing to show here!</p>
{% endif %}

2
templates/header.html
View File

@ -15,7 +15,6 @@
</div> </div>
</nav> </nav>
<centre>
{% if user != None and user.role == "Seller" %} {% if user != None and user.role == "Seller" %}
<div class="categories"> <div class="categories">
{# List all available seller tools #} {# List all available seller tools #}
@ -35,7 +34,6 @@
{% endif %} {% endif %}
{% endfor %} {% endfor %}
</div> </div>
</centre>
</div> </div>
{% with messages = get_flashed_messages(with_categories=true)%} {% with messages = get_flashed_messages(with_categories=true)%}