75 lines
1.5 KiB
Plaintext
75 lines
1.5 KiB
Plaintext
{% extends "base" %} {% block head %}
|
|
<title>Receipt: ${{ amount }} at {{ vendor }}</title>
|
|
<style>
|
|
@media screen and (min-width: 900px) {
|
|
article {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.attributes {
|
|
margin-right: 1em;
|
|
}
|
|
|
|
.photo {
|
|
flex-grow: 1;
|
|
}
|
|
|
|
.photo img {
|
|
max-width: 100%;
|
|
}
|
|
|
|
.photo iframe {
|
|
width: 100%;
|
|
aspect-ratio: 8.5 / 11;
|
|
}
|
|
}
|
|
</style>
|
|
{% endblock %} {% block main %}
|
|
<h1>Receipt</h1>
|
|
<nav>
|
|
<sl-button href="/receipts">
|
|
<sl-icon slot="prefix" name="chevron-left"></sl-icon>Receipts
|
|
</sl-button>
|
|
</nav>
|
|
<article>
|
|
<div class="attributes">
|
|
<p>
|
|
<sl-input
|
|
label="Date"
|
|
value='{{ date | date(format="%A %_d %B %Y") }}'
|
|
readonly
|
|
></sl-input>
|
|
</p>
|
|
<p>
|
|
<sl-input label="Vendor" value="{{ vendor }}" readonly></sl-input>
|
|
</p>
|
|
<p>
|
|
<sl-input
|
|
type="number"
|
|
min="0.01"
|
|
step="0.01"
|
|
label="Amount"
|
|
name="amount"
|
|
value="{{ amount }}"
|
|
readonly
|
|
></sl-input>
|
|
</p>
|
|
<p>
|
|
<sl-textarea label="Notes" name="notes" readonly>{{ notes }}</sl-textarea>
|
|
</p>
|
|
</div>
|
|
<div class="photo">
|
|
<p>
|
|
{% if filename is ending_with(".pdf") %}
|
|
<iframe src="/receipts/{{ id }}/view/{{ filename }}"></iframe>
|
|
{% else %}
|
|
<img src="/receipts/{{ id }}/view/{{ filename }}" />
|
|
{% endif %}
|
|
</p>
|
|
</div>
|
|
</article>
|
|
{% endblock %} {% block scripts %}
|
|
<script src="/static/receipt.js"></script>
|
|
{% endblock %}
|