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

11
templates/content.html
View File

@ -1,7 +1,8 @@
<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 %}
<a href="/products/{{product.id}}" class="product product-link">
<div class="product-title">{{product.name}}</div>
@ -16,5 +17,7 @@
<input type="submit" class="product-add-to-cart" value="Add to Cart" />
</a>
{% endfor %}
{% endif %}
</div>
</div>
{% else %}
<p>Sorry... We have nothing to show here!</p>
{% endif %}

38
templates/header.html
View File

@ -14,28 +14,26 @@
{% endif %}
</div>
</nav>
<centre>
{% if user != None and user.role == "Seller" %}
<div class="categories">
{# List all available seller tools #}
<a href="{{url_for('main.products.display_add_product')}}" class="category">Create Products</a>
<a href="{{url_for('main.products.display_own_products')}}" class="category">View My Products</a>
<a href="{{url_for('main.stats.index')}}" class="category">View Seller Stats</a>
</div>
{% endif %}
{% if user != None and user.role == "Seller" %}
<div class="categories">
{# List all categories and ensure the selected one is highlighted #}
{% for c in categories %}
{% if category == c.name %}
<a style="color: cyan" href="{{url_for('main.products.category', category=c.name)}}" class="category">{{c.name}}</a>
{% else %}
<a href="{{url_for('main.products.category', category=c.name)}}" class="category">{{c.name}}</a>
{% endif %}
{% endfor %}
{# List all available seller tools #}
<a href="{{url_for('main.products.display_add_product')}}" class="category">Create Products</a>
<a href="{{url_for('main.products.display_own_products')}}" class="category">View My Products</a>
<a href="{{url_for('main.stats.index')}}" class="category">View Seller Stats</a>
</div>
</centre>
{% endif %}
<div class="categories">
{# List all categories and ensure the selected one is highlighted #}
{% for c in categories %}
{% if category == c.name %}
<a style="color: cyan" href="{{url_for('main.products.category', category=c.name)}}" class="category">{{c.name}}</a>
{% else %}
<a href="{{url_for('main.products.category', category=c.name)}}" class="category">{{c.name}}</a>
{% endif %}
{% endfor %}
</div>
</div>
{% with messages = get_flashed_messages(with_categories=true)%}