diff --git a/make_post_sell/static/css/common.css b/make_post_sell/static/css/common.css index 0304630..97c5fd0 100644 --- a/make_post_sell/static/css/common.css +++ b/make_post_sell/static/css/common.css @@ -1401,3 +1401,144 @@ div.message-ribbon { background-color: red !important; cursor: not-allowed; } + +/* Phase 2: Static layout and status styling */ + +/* Crypto history layout classes */ +.crypto-history-container { + margin: 20px 0; +} + +.crypto-payment-card { + border: 1px solid #dee2e6; + border-radius: 4px; + padding: 15px; + margin-bottom: 15px; + background: #f8f9fa; +} + +.crypto-header-grid { + display: grid; + grid-template-columns: 1fr auto; + align-items: start; + margin-bottom: 10px; +} + +.crypto-header-title { + margin: 0 0 5px 0; +} + +.crypto-header-subtitle { + margin: 0; + color: #6c757d; + font-size: 0.9em; +} + +.crypto-details-grid { + display: grid; + grid-template-columns: 1fr 1fr 1fr; + gap: 15px; + margin: 10px 0; + align-items: start; +} + +.crypto-right-align { + text-align: right; +} + +.crypto-right-align-justify { + text-align: right; + justify-self: end; +} + +.crypto-small-text { + color: #6c757d; +} + +/* Status notice classes */ +.status-warning-notice { + background: #fff3cd; + border: 1px solid #ffeaa7; + border-radius: 3px; + padding: 8px; + margin-top: 10px; +} + +.status-error-notice { + background: #f8d7da; + border: 1px solid #f5c6cb; + border-radius: 3px; + padding: 8px; + margin-top: 10px; +} + +.status-info-notice { + background: #d1ecf1; + border: 1px solid #bee5eb; + border-radius: 3px; + padding: 8px; + margin-top: 10px; +} + +.crypto-help-section { + margin-top: 30px; + padding: 15px; + background: #e9ecef; + border-radius: 4px; +} + +.crypto-empty-state { + text-align: center; + padding: 40px; + color: #6c757d; +} + +/* Invoice layout classes */ +.invoice-right-section { + text-align: right; + margin: 15px 0; +} + +.invoice-total-section { + text-align: right; + margin: 20px 0; + font-size: 1.2em; +} + +.invoice-payment-box { + background-color: #f0f8ff; + padding: 15px; + border: 1px solid #4169e1; + border-radius: 5px; + margin: 15px 0; +} + +.invoice-margin-section { + margin-top: 15px; +} + +.invoice-margin-small { + margin: 5px 0; +} + +/* Status color classes */ +.status-success { + color: #28a745; +} + +.status-warning { + color: #ffc107; +} + +.status-info { + color: #6c757d; +} + +.status-error { + color: #dc3545; +} + +.code-monospace { + font-size: 0.9em; + font-family: monospace; +} diff --git a/make_post_sell/templates/crypto_quotes_history.j2 b/make_post_sell/templates/crypto_quotes_history.j2 index f4ff290..32b7b35 100644 --- a/make_post_sell/templates/crypto_quotes_history.j2 +++ b/make_post_sell/templates/crypto_quotes_history.j2 @@ -7,26 +7,26 @@

Your complete crypto payment history including all attempts, successful payments, and failed transactions.

{% if payments %} -
+
{% for payment in payments %} -
-
+
+
-

+

{{ payment.coin_name }} ({{ payment.coin_type }}) Payment

-

+

{{ payment.shop_name }} • {{ payment.created_formatted }}

-
+
{{ payment.status_label }}
-
+
Expected Amount:
{% if payment.coin_type == 'XMR' %} @@ -35,7 +35,7 @@ {{ '%.8f' % payment.amount_crypto }} {{ payment.coin_type }} {% endif %}
- ${{ '%.2f' % payment.usd_total }} USD + ${{ '%.2f' % payment.usd_total }} USD
{% if payment.received_crypto > 0 %} @@ -47,17 +47,17 @@ {{ '%.8f' % payment.received_crypto }} {{ payment.coin_type }} {% endif %}
- ${{ '%.2f' % (payment.received_crypto * (payment.rate_usd_per_coin|float)) }} USD + ${{ '%.2f' % (payment.received_crypto * (payment.rate_usd_per_coin|float)) }} USD {% if payment.confirmations > 0 %}
- {{ payment.confirmations }}/{{ payment.confirmations_required }} confirmations + {{ payment.confirmations }}/{{ payment.confirmations_required }} confirmations {% endif %}
{% else %}
{% endif %} -
+
{% if payment.status == 'confirmed' or payment.status == 'confirmed-complete' or payment.status == 'confirmed-overpay' or payment.status == 'confirmed-overpay-refunded' or payment.status == 'confirmed-overpay-refunded-complete' %} {% if payment.has_invoice %} @@ -74,7 +74,7 @@ {% else %} - + Payment ID: {{ payment.id[:8] }}... {% endif %} @@ -82,7 +82,7 @@
{% if payment.status == 'expired' or payment.status == 'cancelled' %} -
+
{% if payment.status == 'expired' %} ⏰ This quote expired before payment was received. @@ -92,7 +92,7 @@
{% elif payment.status.endswith('-not-refunded') %} -
+
❌ No refund possible: {% if payment.refund_reason %} @@ -103,7 +103,7 @@
{% elif payment.status.endswith('-refunded') %} -
+
{% if payment.refund_tx_hash %} 💸 This payment was automatically refunded. @@ -123,7 +123,7 @@
{% elif payment.status == 'no-refund' %} -
+
❌ No refund possible: {% if payment.refund_reason %} @@ -138,9 +138,9 @@ {% endfor %}
-
+

💡 About Crypto Payment History

-
    +
    • Successful payments create invoices and unlock your purchased products
    • Failed payments are automatically refunded when possible (9% restocking fee applies)
    • Out-of-stock refunds are issued in full since it wasn't your fault
      • @@ -149,7 +149,7 @@
{% else %} -
+

No crypto payment history yet

When you attempt crypto payments, they'll show up here.

Start Shopping diff --git a/make_post_sell/templates/invoice.j2 b/make_post_sell/templates/invoice.j2 index fd0bc28..12f64e5 100644 --- a/make_post_sell/templates/invoice.j2 +++ b/make_post_sell/templates/invoice.j2 @@ -36,48 +36,48 @@ {% if invoice.coupon_redemptions and invoice.discount_amount_in_cents > 0 %} -
+
{% for redemption in invoice.coupon_redemptions %} -

+

{{ redemption.coupon.code }}: {{ redemption.coupon.description }}

{% endfor %} -

+

Total Discounts: -${{ '%.2f' % (invoice.discount_amount_in_cents / 100) }}

{% endif %} -
+
Invoice Total: ${{ '%.2f' % invoice.total }}
{% if invoice.crypto_payment and invoice.crypto_payment|length > 0 %} {% set crypto_pay = invoice.crypto_payment[0] %} -
+

Crypto Payment Information

Currency: {{ crypto_pay.coin_type }}

Expected Amount: {{ '%.12f'|format(crypto_pay.expected_amount / (10**12 if crypto_pay.coin_type == 'XMR' else 10**8)) }} {{ crypto_pay.coin_type }}

Received Amount: {{ '%.12f'|format(crypto_pay.received_amount / (10**12 if crypto_pay.coin_type == 'XMR' else 10**8)) }} {{ crypto_pay.coin_type }}

{% if crypto_pay.status in ['confirmed', 'confirmed_overpaid'] %} -

✓ Payment Confirmed

+

✓ Payment Confirmed

{% elif crypto_pay.status == 'received' %} -

⏳ Awaiting Confirmations ({{ crypto_pay.current_confirmations }}/{{ crypto_pay.confirmations_required }})

+

⏳ Awaiting Confirmations ({{ crypto_pay.current_confirmations }}/{{ crypto_pay.confirmations_required }})

{% elif crypto_pay.status == 'pending' %} -

⏳ Waiting for Payment

+

⏳ Waiting for Payment

{% elif crypto_pay.status == 'expired' %} -

❌ Payment Expired

+

❌ Payment Expired

{% elif crypto_pay.status == 'underpaid_refunded' %} -

❌ Underpaid - Refunded

+

❌ Underpaid - Refunded

{% endif %} {% if crypto_pay.tx_hashes and crypto_pay.tx_hashes != '[]' %} -

Transaction(s): {{ crypto_pay.tx_hashes }}

+

Transaction(s): {{ crypto_pay.tx_hashes }}

{% endif %} -

+

Payment ID: {{ crypto_pay.id }}