115 lines
4.8 KiB
HTML
115 lines
4.8 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
<title>Zappier — Documentation</title>
|
|
<style>
|
|
:root {
|
|
--bg: #f4f5fb;
|
|
--panel: #ffffff;
|
|
--ink: #171a26;
|
|
--muted: #6b7186;
|
|
--line: #e5e7f0;
|
|
--accent: #4f46e5;
|
|
--accent-soft: #eef0fe;
|
|
--radius: 12px;
|
|
--shadow: 0 1px 2px rgba(23, 26, 38, 0.05), 0 8px 24px rgba(23, 26, 38, 0.06);
|
|
}
|
|
* { box-sizing: border-box; }
|
|
body {
|
|
margin: 0;
|
|
font-family: -apple-system, "SF Pro Text", "Segoe UI", "PingFang SC", sans-serif;
|
|
background: var(--bg);
|
|
color: var(--ink);
|
|
font-size: 15px;
|
|
line-height: 1.5;
|
|
}
|
|
header {
|
|
background: linear-gradient(160deg, #312e81 0%, #4f46e5 55%, #7c74f0 100%);
|
|
color: #fff;
|
|
padding: 3rem 1.5rem 2.5rem;
|
|
text-align: center;
|
|
}
|
|
header .dot {
|
|
width: 44px; height: 44px; border-radius: 12px;
|
|
background: rgba(255, 255, 255, 0.16);
|
|
display: inline-grid; place-items: center;
|
|
font-weight: 800; font-size: 1.3rem; margin-bottom: 0.75rem;
|
|
}
|
|
header h1 { margin: 0 0 0.35rem; font-size: 1.7rem; }
|
|
header p { margin: 0; opacity: 0.85; }
|
|
main { max-width: 880px; margin: 0 auto; padding: 2rem 1.5rem 4rem; }
|
|
h2 { font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--muted); margin: 2rem 0 0.9rem; }
|
|
.cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1rem; }
|
|
a.card {
|
|
display: block;
|
|
background: var(--panel);
|
|
border: 1px solid var(--line);
|
|
border-radius: var(--radius);
|
|
box-shadow: var(--shadow);
|
|
padding: 1.1rem 1.25rem;
|
|
text-decoration: none;
|
|
color: inherit;
|
|
transition: transform 0.12s ease, box-shadow 0.12s ease;
|
|
}
|
|
a.card:hover { transform: translateY(-2px); box-shadow: 0 4px 8px rgba(23,26,38,0.06), 0 16px 36px rgba(23,26,38,0.1); }
|
|
a.card h3 { margin: 0 0 0.35rem; font-size: 1.02rem; color: var(--accent); }
|
|
a.card p { margin: 0 0 0.7rem; color: var(--muted); font-size: 0.9rem; }
|
|
.fmt { display: inline-block; padding: 0.08rem 0.55rem; border-radius: 999px; font-size: 0.72rem; font-weight: 700; background: var(--accent-soft); color: var(--accent); margin-right: 0.3rem; }
|
|
.fmt.md { background: #f1f5f9; color: #475569; }
|
|
footer { text-align: center; color: var(--muted); font-size: 0.85rem; padding-bottom: 2rem; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<header>
|
|
<span class="dot">Z</span>
|
|
<h1>Zappier Documentation</h1>
|
|
<p>Metered API platform — pricing, billing, invoicing, customer portal, and Zapier integration.</p>
|
|
</header>
|
|
<main>
|
|
<h2>Operations</h2>
|
|
<div class="cards">
|
|
<a class="card" href="USER-MANUAL.pdf">
|
|
<h3>Operations & Usage Manual</h3>
|
|
<p>Running the system day to day: pricing, customers, billing operations, runbook, troubleshooting.</p>
|
|
<span class="fmt">PDF</span><span class="fmt">10 pages</span>
|
|
</a>
|
|
<a class="card" href="ACCOUNTING.pdf">
|
|
<h3>Company Accounting Walkthrough</h3>
|
|
<p>Invoices, purchase-order billing, prepaid drawdown, reports with CSV export, usage trends.</p>
|
|
<span class="fmt">PDF</span><span class="fmt">7 pages</span>
|
|
</a>
|
|
<a class="card" href="USER-MANAGEMENT.pdf">
|
|
<h3>User Management Walkthrough</h3>
|
|
<p>Admin accounts, rate card (free / fixed / variable pricing), customer types, customer accounts.</p>
|
|
<span class="fmt">PDF</span><span class="fmt">5 pages</span>
|
|
</a>
|
|
</div>
|
|
|
|
<h2>For your customers</h2>
|
|
<div class="cards">
|
|
<a class="card" href="CUSTOMER-PORTAL.pdf">
|
|
<h3>Customer Portal Walkthrough</h3>
|
|
<p>End-user guide: signup, two-factor authentication, usage dashboard, invoices, reloads, API & pricing.</p>
|
|
<span class="fmt">PDF</span><span class="fmt">8 pages</span>
|
|
</a>
|
|
</div>
|
|
|
|
<h2>Technical</h2>
|
|
<div class="cards">
|
|
<a class="card" href="DEVELOPER.pdf">
|
|
<h3>Developer Documentation</h3>
|
|
<p>Architecture, module reference, pricing engine, billing pipeline, full API reference, extension guide.</p>
|
|
<span class="fmt">PDF</span><span class="fmt">9 pages</span>
|
|
</a>
|
|
<a class="card" href="WALKTHROUGH.pdf">
|
|
<h3>Step-by-Step Usage Walkthrough</h3>
|
|
<p>The original guided tour of the pricing admin UI with screenshots at every step.</p>
|
|
<span class="fmt">PDF</span><span class="fmt">13 pages</span>
|
|
</a>
|
|
</div>
|
|
</main>
|
|
<footer>Zappier · generated 2026-07-28</footer>
|
|
</body>
|
|
</html>
|