order and api and more
This commit is contained in:
@ -24,35 +24,36 @@ body {
|
||||
height: 100%;
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
padding: 2mm;
|
||||
padding: 1mm;
|
||||
page-break-after: always;
|
||||
}
|
||||
|
||||
/* Main address centered */
|
||||
.address {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 85mm;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 88mm;
|
||||
height: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.recipient-name {
|
||||
font-size: 10pt;
|
||||
font-weight: bold;
|
||||
font-size: 12pt;
|
||||
margin-bottom: 1mm;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.address-line {
|
||||
font-size: 9pt;
|
||||
line-height: 1.2;
|
||||
font-size: 11pt;
|
||||
line-height: 1.1;
|
||||
margin-bottom: 0.5mm;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.city-line {
|
||||
font-size: 9pt;
|
||||
font-weight: bold;
|
||||
font-size: 11pt;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
</style>
|
||||
@ -61,8 +62,7 @@ body {
|
||||
<div class="label-container">
|
||||
<div class="address">
|
||||
<div class="recipient-name">{{ recipient_name }}</div>
|
||||
<div class="address-line">{{ address_line1 }}</div>
|
||||
{% if address_line2 %}<div class="address-line">{{ address_line2 }}</div>{% endif %}
|
||||
<div class="address-line">{{ address_line1 }}{% if address_line2 %} {{ address_line2 }}{% endif %}</div>
|
||||
<div class="city-line">{{ city }}, {{ state }} {{ zip_code }}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -80,15 +80,16 @@ tr:hover {
|
||||
width: 150px;
|
||||
}
|
||||
|
||||
.condition {
|
||||
width: 80px;
|
||||
}
|
||||
|
||||
.rarity {
|
||||
width: 30px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.card-number {
|
||||
width: 50px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.product-name {
|
||||
width: 200px;
|
||||
}
|
||||
@ -114,20 +115,20 @@ tbody tr:hover {
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="product-name">Product Name</th>
|
||||
<th class="condition">Condition</th>
|
||||
<th class="quantity">Qty</th>
|
||||
<th class="set">Set</th>
|
||||
<th class="rarity">Rarity</th>
|
||||
<th class="card-number">Card #</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for item in items %}
|
||||
<tr class="{{ 'foil' if 'Foil' in item.condition else '' }} {{ 'multiple' if item.quantity|int > 1 else '' }}">
|
||||
<td class="product-name">{{ item.product_name }}</td>
|
||||
<td class="condition">{{ item.condition }}</td>
|
||||
<td class="quantity">{{ item.quantity }}</td>
|
||||
<td class="set">{{ item.set }}</td>
|
||||
<td class="rarity">{{ item.rarity }}</td>
|
||||
<td class="card-number">{{ item.card_number }}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
|
64
app/data/assets/templates/set_label.html
Normal file
64
app/data/assets/templates/set_label.html
Normal file
@ -0,0 +1,64 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<style>
|
||||
@page {
|
||||
size: 90mm 29mm;
|
||||
margin: 0;
|
||||
}
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: Arial, sans-serif;
|
||||
}
|
||||
.label {
|
||||
width: 90mm;
|
||||
height: 29mm;
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
padding: 1mm 2mm;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.icon {
|
||||
width: 12mm;
|
||||
height: 12mm;
|
||||
margin-right: 3mm;
|
||||
margin-top: 1mm;
|
||||
}
|
||||
.info {
|
||||
flex: 1;
|
||||
padding-top: 1mm;
|
||||
}
|
||||
.name {
|
||||
font-size: 12pt;
|
||||
font-weight: bold;
|
||||
margin-bottom: 2mm;
|
||||
color: #000;
|
||||
}
|
||||
.code {
|
||||
font-size: 11pt;
|
||||
font-weight: bold;
|
||||
margin-bottom: 2mm;
|
||||
color: #000;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.date {
|
||||
font-size: 10pt;
|
||||
color: #000;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="label">
|
||||
{% if icon_b64 %}
|
||||
<img class="icon" src="data:image/svg+xml;base64,{{ icon_b64 }}" alt="{{ name }} icon">
|
||||
{% endif %}
|
||||
<div class="info">
|
||||
<div class="name">{{ name }}</div>
|
||||
<div class="code">{{ code }}</div>
|
||||
<div class="date">{{ date.strftime('%B %Y') }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
Reference in New Issue
Block a user