234 lines
9.3 KiB
HTML
234 lines
9.3 KiB
HTML
{% extends "main.html" %}
|
|
|
|
{% block extrahead %}
|
|
{{ super() }}
|
|
<script>
|
|
// Add data attribute for CSS targeting
|
|
document.body.setAttribute('data-md-template', 'home');
|
|
</script>
|
|
{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="md-content--home">
|
|
|
|
<!-- Hero Grid Section -->
|
|
<section class="hero-grid">
|
|
<div class="grid-container">
|
|
<!-- Main Hero Block -->
|
|
<div class="hero-main">
|
|
<div class="meta-badge">🤯 This Site Runs On Changemaker Lite</div>
|
|
<h1>The Infrastructure That Runs Itself</h1>
|
|
<p>You're looking at Changemaker Lite right now. This entire documentation platform, our email campaigns, databases, and automation all run on the same $200 hardware we're selling you.</p>
|
|
|
|
<div class="self-hosting-proof">
|
|
<div class="proof-item">
|
|
<span class="proof-icon">🏠</span>
|
|
<span class="proof-text">This website</span>
|
|
</div>
|
|
<div class="proof-item">
|
|
<span class="proof-icon">📧</span>
|
|
<span class="proof-text">BNKops newsletters</span>
|
|
</div>
|
|
<div class="proof-item">
|
|
<span class="proof-icon">💾</span>
|
|
<span class="proof-text">Community database</span>
|
|
</div>
|
|
<div class="proof-item">
|
|
<span class="proof-icon">🔄</span>
|
|
<span class="proof-text">Automated workflows</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="hero-ctas">
|
|
<a href="#video-demo" class="btn btn-primary">Watch It Work ▶️</a>
|
|
<a href="#get-started" class="btn btn-secondary">Get Started $200</a>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Video Demo Block -->
|
|
<div class="hero-video" id="video-demo">
|
|
<div class="video-placeholder">
|
|
<div class="video-icon">▶️</div>
|
|
<h3>See Changemaker Lite In Action</h3>
|
|
<p>3-minute demo of everything running on one box</p>
|
|
<!-- VIDEO PLACEHOLDER: Terminal demo showing docker compose ps, accessing services -->
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Stats Block -->
|
|
<div class="hero-stats">
|
|
<div class="stat-item">
|
|
<div class="stat-number">$200</div>
|
|
<div class="stat-label">Total hardware cost</div>
|
|
</div>
|
|
<div class="stat-item">
|
|
<div class="stat-number">11</div>
|
|
<div class="stat-label">Services included</div>
|
|
</div>
|
|
<div class="stat-item">
|
|
<div class="stat-number">100%</div>
|
|
<div class="stat-label">Data ownership</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Trust Indicators -->
|
|
<div class="hero-trust">
|
|
<div class="trust-item">
|
|
<span class="trust-icon">⚡</span>
|
|
<span class="trust-text">Powers BNKops.com</span>
|
|
</div>
|
|
<div class="trust-item">
|
|
<span class="trust-icon">🏳️⚧️</span>
|
|
<span class="trust-text">Trans liberation tech</span>
|
|
</div>
|
|
<div class="trust-item">
|
|
<span class="trust-icon">🛡️</span>
|
|
<span class="trust-text">Zero surveillance</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Self-Hosting Proof Grid -->
|
|
<section class="proof-grid-section">
|
|
<div class="grid-container">
|
|
<div class="section-header">
|
|
<h2>What You're Looking At Right Now</h2>
|
|
<p>This entire platform runs on Changemaker Lite. We're not just selling it - we're living it.</p>
|
|
</div>
|
|
|
|
<div class="proof-grid-layout">
|
|
<!-- Backend Demo -->
|
|
<div class="proof-card">
|
|
<div class="proof-header">
|
|
<span class="proof-icon">🖥️</span>
|
|
<h3>Backend Demo</h3>
|
|
</div>
|
|
<div class="video-placeholder small">
|
|
<!-- VIDEO: Screen recording of homepage dashboard -->
|
|
<div class="video-icon">▶️</div>
|
|
<p>Homepage dashboard tour</p>
|
|
</div>
|
|
<p>Live view of all 11 services running on one box</p>
|
|
</div>
|
|
|
|
<!-- Email System -->
|
|
<div class="proof-card">
|
|
<div class="proof-header">
|
|
<span class="proof-icon">📧</span>
|
|
<h3>Email System</h3>
|
|
</div>
|
|
<div class="live-stats">
|
|
<div class="stat">2.3K subscribers</div>
|
|
<div class="stat">98% delivery rate</div>
|
|
</div>
|
|
<p>Listmonk powers all BNKops newsletters</p>
|
|
</div>
|
|
|
|
<!-- Database -->
|
|
<div class="proof-card">
|
|
<div class="proof-header">
|
|
<span class="proof-icon">💾</span>
|
|
<h3>Database</h3>
|
|
</div>
|
|
<div class="video-placeholder small">
|
|
<!-- VIDEO: Quick NocoDB demo -->
|
|
<div class="video-icon">▶️</div>
|
|
<p>NocoDB interface</p>
|
|
</div>
|
|
<p>Managing inquiries, contacts, projects</p>
|
|
</div>
|
|
|
|
<!-- Cost Savings -->
|
|
<div class="proof-card highlighted">
|
|
<div class="proof-header">
|
|
<span class="proof-icon">💰</span>
|
|
<h3>Our Savings</h3>
|
|
</div>
|
|
<div class="savings-breakdown">
|
|
<div class="savings-item">
|
|
<span class="corporate">Corporate SaaS: $1,200/mo</span>
|
|
<span class="ours">Changemaker: $50/mo</span>
|
|
</div>
|
|
<div class="savings-total">Saving $13,800/year</div>
|
|
</div>
|
|
<p>Money that goes to organizing, not shareholders</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Hardware Options Grid -->
|
|
<section class="hardware-grid-section" id="get-started">
|
|
<div class="grid-container">
|
|
<div class="section-header">
|
|
<h2>Get The Same Setup</h2>
|
|
<p>Three ways to join the digital liberation movement</p>
|
|
</div>
|
|
|
|
<div class="hardware-options-grid">
|
|
<!-- Plug & Play -->
|
|
<div class="option-card featured">
|
|
<div class="option-badge">Recommended</div>
|
|
<div class="option-icon">🚀</div>
|
|
<h3>Plug & Play</h3>
|
|
<div class="option-price">$200</div>
|
|
<div class="option-features">
|
|
<div class="feature">✓ Pre-configured hardware</div>
|
|
<div class="feature">✓ 30-minute setup</div>
|
|
<div class="feature">✓ Everything included</div>
|
|
<div class="feature">✓ Priority support</div>
|
|
</div>
|
|
<a href="https://bnkops.com/hardware" class="btn btn-primary">Order Hardware</a>
|
|
<div class="option-note">Ships in 5 days</div>
|
|
</div>
|
|
|
|
<!-- DIY -->
|
|
<div class="option-card">
|
|
<div class="option-icon">🛠️</div>
|
|
<h3>DIY Install</h3>
|
|
<div class="option-price">Free</div>
|
|
<div class="option-features">
|
|
<div class="feature">✓ Use your hardware</div>
|
|
<div class="feature">✓ Learn the system</div>
|
|
<div class="feature">✓ Full control</div>
|
|
<div class="feature">✓ Community support</div>
|
|
</div>
|
|
<a href="/getting-started/" class="btn btn-secondary">Install Guide</a>
|
|
<div class="option-note">+$50/mo hosting</div>
|
|
</div>
|
|
|
|
<!-- Managed -->
|
|
<div class="option-card">
|
|
<div class="option-icon">☁️</div>
|
|
<h3>Managed Hosting</h3>
|
|
<div class="option-price">$150/mo</div>
|
|
<div class="option-features">
|
|
<div class="feature">✓ We handle everything</div>
|
|
<div class="feature">✓ Your domain</div>
|
|
<div class="feature">✓ Your data</div>
|
|
<div class="feature">✓ 24/7 monitoring</div>
|
|
</div>
|
|
<a href="https://bnkops.com/hosting" class="btn btn-secondary">Learn More</a>
|
|
<div class="option-note">Still your infrastructure</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Quick Setup Demo -->
|
|
<div class="setup-demo">
|
|
<h3>See The 30-Minute Setup</h3>
|
|
<div class="video-placeholder">
|
|
<!-- VIDEO: Time-lapse of complete setup process -->
|
|
<div class="video-icon">▶️</div>
|
|
<div class="video-meta">
|
|
<span>5:23</span>
|
|
<span>Time-lapse setup</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
</div>
|
|
{% endblock %}
|