nngo/JQC_multi_tenant
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Jun 28 - Update and polish UI/UX

Browse Source
This commit is contained in:
nngo
2026-06-28 19:00:34 -04:00
parent 54fa5b8c87
commit a42fc31fc5
14 changed files with 943 additions and 91 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/templates/billing/email/base.html
+40
View File
@@ -0,0 +1,40 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>{{ subject }}</title>
</head>
<body style="margin:0;padding:0;background:#f6f7f9;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;">
<table width="100%" cellpadding="0" cellspacing="0" style="background:#f6f7f9;padding:40px 0;">
<tr><td align="center">
<table width="560" cellpadding="0" cellspacing="0" style="background:#fff;border-radius:8px;box-shadow:0 1px 4px rgba(0,0,0,.08);overflow:hidden;max-width:100%;">
<!-- Header -->
<tr>
<td style="background:#1a56db;padding:24px 32px;">
<span style="color:#fff;font-size:1.1rem;font-weight:700;letter-spacing:-.01em;">
&#10003;&nbsp;Janitorial QC
</span>
</td>
</tr>
<!-- Body -->
<tr>
<td style="padding:32px;">
{% block body %}{% endblock %}
</td>
</tr>
<!-- Footer -->
<tr>
<td style="background:#f6f7f9;padding:20px 32px;border-top:1px solid #e5e7eb;">
<p style="margin:0;font-size:.8rem;color:#9ca3af;line-height:1.5;">
You received this email because you are the billing contact for your
JQC workspace. If you have questions, reply to this email or contact
<a href="mailto:support@jqc.app" style="color:#1a56db;text-decoration:none;">support@jqc.app</a>.
</p>
</td>
</tr>
</table>
</td></tr>
</table>
</body>
</html>
app/templates/billing/email/payment_failed.html
+39
View File
@@ -0,0 +1,39 @@
{% extends "billing/email/base.html" %}
{% set subject = "Action Required: Payment failed for your JQC subscription" %}
{% block body %}
<h2 style="margin:0 0 8px;font-size:1.2rem;color:#111827;">Payment failed</h2>
<p style="margin:0 0 20px;color:#6b7280;font-size:.9rem;">We were unable to process your most recent payment.</p>
<table width="100%" cellpadding="12" cellspacing="0" style="background:#fef3c7;border-radius:6px;margin-bottom:24px;">
<tr>
<td>
<p style="margin:0;font-size:.9rem;color:#92400e;line-height:1.5;">
<strong>&#9888; Your subscription may be suspended</strong> if the payment is not resolved.
Please update your payment method as soon as possible.
</p>
</td>
</tr>
</table>
<p style="margin:0 0 24px;font-size:.9rem;color:#374151;line-height:1.6;">
This can happen when a card expires, has insufficient funds, or is declined by
your bank. Updating your payment method takes less than a minute.
</p>
<table width="100%" cellpadding="0" cellspacing="0" style="margin-bottom:24px;">
<tr>
<td align="center">
<a href="{{ portal_url }}"
style="display:inline-block;background:#1a56db;color:#fff;text-decoration:none;
padding:12px 28px;border-radius:6px;font-size:.95rem;font-weight:600;">
Update Payment Method
</a>
</td>
</tr>
</table>
<p style="margin:0;font-size:.85rem;color:#9ca3af;">
Or copy this link into your browser:<br>
<a href="{{ portal_url }}" style="color:#1a56db;word-break:break-all;">{{ portal_url }}</a>
</p>
{% endblock %}
app/templates/billing/email/subscription_cancelled.html
+39
View File
@@ -0,0 +1,39 @@
{% extends "billing/email/base.html" %}
{% set subject = "Your JQC subscription has been cancelled" %}
{% block body %}
<h2 style="margin:0 0 8px;font-size:1.2rem;color:#111827;">Subscription cancelled</h2>
<p style="margin:0 0 20px;color:#6b7280;font-size:.9rem;">Your JQC subscription has ended and your workspace has been suspended.</p>
<table width="100%" cellpadding="12" cellspacing="0" style="background:#fef2f2;border-radius:6px;margin-bottom:24px;">
<tr>
<td>
<p style="margin:0;font-size:.9rem;color:#991b1b;line-height:1.5;">
<strong>&#10007; Workspace access suspended</strong><br>
Your data is safe and will be retained for 30 days. Reactivate at any time to restore access immediately.
</p>
</td>
</tr>
</table>
<p style="margin:0 0 24px;font-size:.9rem;color:#374151;line-height:1.6;">
If this was a mistake or you'd like to reactivate your subscription,
click the button below to manage your billing.
</p>
<table width="100%" cellpadding="0" cellspacing="0" style="margin-bottom:24px;">
<tr>
<td align="center">
<a href="{{ portal_url }}"
style="display:inline-block;background:#1a56db;color:#fff;text-decoration:none;
padding:12px 28px;border-radius:6px;font-size:.95rem;font-weight:600;">
Reactivate Subscription
</a>
</td>
</tr>
</table>
<p style="margin:0;font-size:.85rem;color:#9ca3af;">
Or copy this link into your browser:<br>
<a href="{{ portal_url }}" style="color:#1a56db;word-break:break-all;">{{ portal_url }}</a>
</p>
{% endblock %}
app/templates/billing/email/trial_ending.html
+40
View File
@@ -0,0 +1,40 @@
{% extends "billing/email/base.html" %}
{% set subject = "Your JQC free trial ends in 3 days" %}
{% block body %}
<h2 style="margin:0 0 8px;font-size:1.2rem;color:#111827;">Your free trial is ending soon</h2>
<p style="margin:0 0 20px;color:#6b7280;font-size:.9rem;">Subscribe before <strong>{{ trial_ends_at }}</strong> to keep your workspace active.</p>
<table width="100%" cellpadding="12" cellspacing="0" style="background:#eff6ff;border-radius:6px;margin-bottom:24px;">
<tr>
<td>
<p style="margin:0;font-size:.9rem;color:#1e40af;line-height:1.5;">
<strong>&#8987; Trial expiry: {{ trial_ends_at }}</strong><br>
After this date your workspace will be locked until you subscribe.
All your data is preserved.
</p>
</td>
</tr>
</table>
<p style="margin:0 0 24px;font-size:.9rem;color:#374151;line-height:1.6;">
Choose the plan that fits your team — you can upgrade or downgrade at any time,
and your first bill is prorated to today.
</p>
<table width="100%" cellpadding="0" cellspacing="0" style="margin-bottom:24px;">
<tr>
<td align="center">
<a href="{{ subscribe_url }}"
style="display:inline-block;background:#1a56db;color:#fff;text-decoration:none;
padding:12px 28px;border-radius:6px;font-size:.95rem;font-weight:600;">
Subscribe Now
</a>
</td>
</tr>
</table>
<p style="margin:0;font-size:.85rem;color:#9ca3af;">
Or copy this link into your browser:<br>
<a href="{{ subscribe_url }}" style="color:#1a56db;word-break:break-all;">{{ subscribe_url }}</a>
</p>
{% endblock %}
app/templates/tenant_settings/plan.html
+61
View File
@@ -121,6 +121,67 @@
</div>
</div>
{% if billing_enabled and invoices %}
<div class="card border-0 shadow-sm mt-3">
<div class="card-header bg-white py-2 d-flex justify-content-between align-items-center">
<span class="fw-semibold" style="font-size:.9rem;">Invoice History</span>
<a href="{{ url_for('billing.portal') }}" class="btn btn-xs btn-outline-secondary"
style="font-size:.75rem;padding:2px 10px;">
Manage in Stripe &rsaquo;
</a>
</div>
<div class="table-responsive">
<table class="table table-sm table-hover mb-0" style="font-size:.85rem;">
<thead class="table-light">
<tr>
<th>Invoice #</th>
<th>Date</th>
<th>Amount</th>
<th>Status</th>
<th></th>
</tr>
</thead>
<tbody>
{% for inv in invoices %}
<tr>
<td class="text-muted">{{ inv.number }}</td>
<td>{{ inv.date }}</td>
<td>{{ inv.amount }}</td>
<td>
{% if inv.status == 'paid' %}
<span class="badge bg-success-subtle text-success border border-success-subtle">Paid</span>
{% elif inv.status == 'open' %}
<span class="badge bg-warning-subtle text-warning border border-warning-subtle">Open</span>
{% elif inv.status == 'void' %}
<span class="badge bg-secondary-subtle text-secondary border border-secondary-subtle">Void</span>
{% elif inv.status == 'uncollectible' %}
<span class="badge bg-danger-subtle text-danger border border-danger-subtle">Uncollectible</span>
{% else %}
<span class="badge bg-light text-muted border">{{ inv.status }}</span>
{% endif %}
</td>
<td class="text-end">
{% if inv.pdf_url %}
<a href="{{ inv.pdf_url }}" target="_blank" class="btn btn-xs btn-outline-secondary me-1"
style="font-size:.75rem;padding:2px 8px;">
<i class="bi bi-file-pdf me-1"></i>PDF
</a>
{% endif %}
{% if inv.hosted_url %}
<a href="{{ inv.hosted_url }}" target="_blank" class="btn btn-xs btn-outline-primary"
style="font-size:.75rem;padding:2px 8px;">
View
</a>
{% endif %}
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</div>
{% endif %}
{% else %}
<div class="alert alert-info">
Plan information is only available when multi-tenancy is enabled.