Convert crypto quotes history to use CSS Grid consistently
- Replace flexbox layout with CSS Grid for header section - Add align-items: start for proper grid alignment - Add justify-self: end for button positioning - Add empty div placeholder when no received amount to maintain grid structure - Ensure all layouts use CSS Grid for consistency
This commit is contained in:
parent
eff2808371
commit
2ec9c5fc74
1 changed files with 5 additions and 3 deletions
|
|
@ -10,7 +10,7 @@
|
|||
<div style="margin: 20px 0;">
|
||||
{% for payment in payments %}
|
||||
<div style="border: 1px solid #dee2e6; border-radius: 4px; padding: 15px; margin-bottom: 15px; background: #f8f9fa;">
|
||||
<div style="display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 10px;">
|
||||
<div style="display: grid; grid-template-columns: 1fr auto; align-items: start; margin-bottom: 10px;">
|
||||
<div>
|
||||
<h4 style="margin: 0 0 5px 0;">
|
||||
{{ payment.coin_name }} ({{ payment.coin_type }}) Payment
|
||||
|
|
@ -26,7 +26,7 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div style="display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 15px; margin: 10px 0;">
|
||||
<div style="display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 15px; margin: 10px 0; align-items: start;">
|
||||
<div>
|
||||
<strong>Expected Amount:</strong><br>
|
||||
{% if payment.coin_type == 'XMR' %}
|
||||
|
|
@ -51,9 +51,11 @@
|
|||
<small style="color: #6c757d;">{{ payment.confirmations }}/{{ payment.confirmations_required }} confirmations</small>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% else %}
|
||||
<div></div>
|
||||
{% endif %}
|
||||
|
||||
<div style="text-align: right;">
|
||||
<div style="text-align: right; justify-self: end;">
|
||||
{% if payment.status == 'confirmed' or payment.status == 'confirmed-overpaid' %}
|
||||
{% if payment.has_invoice %}
|
||||
<a href="{{ request.route_url('view_invoice', invoice_id=payment.invoice_id) }}" class="mps-button" style="background: #28a745;">
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue