s3lph/matemat
s3lph/matemat
1
0
Fork 2
Code Issues Pull requests 2 Projects Releases Packages 2 Wiki Activity Actions

Added some barebones CSS to display the user- and product-list in a somewhat acceptable way.

Browse source
This commit is contained in:
s3lph 2018-07-11 15:32:07 +02:00
parent cf892211be
commit 4ba0165e7c
4 changed files with 43 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

31
static/css/matemat.css Normal file
View file

@ -0,0 +1,31 @@
.thumblist-item {
display: inline-block;
margin: 10px;
padding: 10px;
background: #f0f0f0;
text-decoration: none;
}
.thumblist-item a {
text-decoration: none;
}
.thumblist-item .imgcontainer {
width: 150px;
height: 150px;
position: relative;
}
.thumblist-item .imgcontainer img {
max-width: 150px;
max-height: 150px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.thumblist-title {
display: block;
font-weight: bolder;
}

1
templates/base.html
View file

@ -3,6 +3,7 @@
<head> <head>
{% block head %} {% block head %}
<title>Matemat</title> <title>Matemat</title>
<link rel="stylesheet" href="/css/matemat.css" />
{% endblock %} {% endblock %}
</head> </head>
<body> <body>

11
templates/productlist.html
View file

@ -10,9 +10,9 @@
{% block main %} {% block main %}
Your balance: {{ authuser.balance }} Your balance: {{ authuser.balance }}
<br/>
<a href="/deposit?n=100">Deposit CHF 1</a> <a href="/deposit?n=100">Deposit CHF 1</a><br/>
<a href="/deposit?n=1000">Deposit CHF 10</a> <a href="/deposit?n=1000">Deposit CHF 10</a><br/>
{% for product in products %} {% for product in products %}
<div class="thumblist-item"> <div class="thumblist-item">
@ -25,10 +25,13 @@ Your balance: {{ authuser.balance }}
{{ product.price_non_member }} {{ product.price_non_member }}
{% endif %} {% endif %}
; Stock: {{ product.stock }}</span><br/> ; Stock: {{ product.stock }}</span><br/>
<img height="150" src="/img/thumbnails/products/{{ product.id }}.png" alt="Picture of {{ product.name }}" /> <div class="imgcontainer">
<img src="/img/thumbnails/products/{{ product.id }}.png" alt="Picture of {{ product.name }}" />
</div>
</a> </a>
</div> </div>
{% endfor %} {% endfor %}
<br/>
<a href="/logout">Logout</a> <a href="/logout">Logout</a>
{{ super() }} {{ super() }}

5
templates/userlist.html
View file

@ -10,10 +10,13 @@
<div class="thumblist-item"> <div class="thumblist-item">
<a href="/touchkey?uid={{ user.id }}&username={{ user.name }}"> <a href="/touchkey?uid={{ user.id }}&username={{ user.name }}">
<span class="thumblist-title">{{ user.name }}</span><br/> <span class="thumblist-title">{{ user.name }}</span><br/>
<img height="150" src="/img/thumbnails/users/{{ user.id }}.png" alt="Avatar of {{ user.name }}" /> <div class="imgcontainer">
<img src="/img/thumbnails/users/{{ user.id }}.png" alt="Avatar of {{ user.name }}" />
</div>
</a> </a>
</div> </div>
{% endfor %} {% endfor %}
<br/>
<a href="/login">Password-based login</a> <a href="/login">Password-based login</a>
{{ super() }} {{ super() }}
{% endblock %} {% endblock %}