16eda07b3d
The SSH Access page was boxed to max-width 860px and centered, unlike the Overview and System admin pages (.admin-page) which span the full content width. Drop the cap and match .admin-page padding so /admin/tools/ssh-access looks like the rest of the Admin area. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> Signed-off-by: librelad <librelad@digitalangels.vip>
587 lines
24 KiB
HTML
587 lines
24 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en" data-theme="nebula">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>LibrePortal — your own private corner of the universe</title>
|
|
<meta name="description" content="LibrePortal is a free, open, self-hosted app platform. One command brings up the apps you rely on — on your own server, with your data staying yours.">
|
|
<link rel="icon" type="image/svg+xml" href="assets/libreportal.svg">
|
|
<link rel="icon" href="assets/favicon.ico" sizes="any">
|
|
<link rel="stylesheet" href="assets/style.css">
|
|
</head>
|
|
<body>
|
|
<div class="cosmos"></div>
|
|
<div class="stars"></div>
|
|
|
|
<div class="topbar">
|
|
<button class="mobile-menu-toggle" id="mobile-menu-toggle" aria-label="Toggle navigation menu">
|
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="3" y1="6" x2="21" y2="6"/><line x1="3" y1="12" x2="21" y2="12"/><line x1="3" y1="18" x2="21" y2="18"/></svg>
|
|
</button>
|
|
<div class="topbar-left">
|
|
<a class="libreportal-logo" href="#top"><img src="assets/libreportal.svg" alt="LibrePortal" width="32" height="32">Libre<b>Portal</b></a>
|
|
</div>
|
|
<div class="mobile-drawer" id="mobile-drawer">
|
|
<nav class="topbar-nav">
|
|
<a href="#top" class="nav-item nav-active" data-spy="top">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 11l9-8 9 8"/><path d="M5 10v10h14V10"/></svg>Home
|
|
</a>
|
|
<a href="#features" class="nav-item" data-spy="features">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="3" width="7" height="7"/><rect x="14" y="3" width="7" height="7"/><rect x="14" y="14" width="7" height="7"/><rect x="3" y="14" width="7" height="7"/></svg>Features
|
|
</a>
|
|
<a href="#apps" class="nav-item" data-spy="apps">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="4"/><path d="M12 2v3M12 19v3M2 12h3M19 12h3M5 5l2 2M17 17l2 2M19 5l-2 2M7 17l-2 2"/></svg>Apps
|
|
</a>
|
|
<a href="#connect" class="nav-item" data-spy="connect">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10Z"/></svg>Privacy
|
|
</a>
|
|
<a href="#promise" class="nav-item" data-spy="promise">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10Z"/><path d="M9 11l2 2 4-4"/></svg>Promise
|
|
</a>
|
|
</nav>
|
|
<div class="topbar-controls">
|
|
<a class="tb-ghost" href="https://gitea.scottwebstar.co.uk/Webstar/LibrePortal" target="_blank" rel="noopener">Source ↗</a>
|
|
<a class="tb-cta" href="#install">Install</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<!-- ===== HERO ===== -->
|
|
<header class="hero" id="top">
|
|
<span class="badge h-anim d1"><span class="dot"></span>v0.1.0 · early days, no telemetry ever</span>
|
|
<img class="hero-logo h-anim d2" src="assets/libreportal.svg" alt="">
|
|
<h1 class="h-anim d2">Your own private corner<br>of the <span class="grad">universe</span></h1>
|
|
<p class="sub h-anim d3">Self-host the apps you actually rely on — on your own server.
|
|
One command brings up a whole platform, and your data never leaves your orbit.</p>
|
|
|
|
<div class="portal h-anim d4" id="install">
|
|
<div class="term">
|
|
<div class="term-bar"><i></i><i></i><i></i><em>~ one command, your whole server</em></div>
|
|
<div class="term-body">
|
|
<code data-install-cmd="bash <(curl -fsSL https://get.libreportal.org) init"><span class="p">bash</span> <(<span class="p">curl</span> -fsSL <span class="u">https://get.libreportal.org</span>) init</code>
|
|
<button class="copy" aria-label="Copy install command">
|
|
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="9" y="9" width="11" height="11" rx="2"/><path d="M5 15V5a2 2 0 0 1 2-2h10"/></svg>
|
|
<span>Copy</span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div class="portal-foot">
|
|
<span class="hint">curl·to·shell, on a privacy tool? <a href="https://gitea.scottwebstar.co.uk/Webstar/LibrePortal/raw/branch/main/init.sh" target="_blank" rel="noopener">read it first →</a></span>
|
|
<span>·</span>
|
|
<a href="https://gitea.scottwebstar.co.uk/Webstar/LibrePortal" target="_blank" rel="noopener">or clone the repo</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="scroll-cue">explore</div>
|
|
</header>
|
|
|
|
<!-- ===== FEATURES ===== -->
|
|
<section class="pad wrap" id="features">
|
|
<span class="eyebrow reveal">What comes online</span>
|
|
<h2 class="reveal">A whole platform, <span class="grad">handled for you</span></h2>
|
|
<p class="lead reveal">No yak-shaving. LibrePortal wires up the boring, fiddly infrastructure so you can run the good stuff.</p>
|
|
|
|
<div class="feat-grid stagger">
|
|
<div class="card glass">
|
|
<div class="ico"><svg viewBox="0 0 24 24"><path d="M21 8 12 3 3 8l9 5 9-5Z"/><path d="m3 8 9 5v8M21 8l-9 5"/></svg></div>
|
|
<h3>One-click apps</h3>
|
|
<p>Nextcloud, Vaultwarden, Jellyfin, Gitea and dozens more — picked from a menu, deployed clean.</p>
|
|
</div>
|
|
<div class="card glass">
|
|
<div class="ico"><svg viewBox="0 0 24 24"><path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10Z"/><path d="m9 12 2 2 4-4"/></svg></div>
|
|
<h3>Traefik + auto-SSL</h3>
|
|
<p>A reverse proxy with automatic Let's Encrypt certificates. HTTPS everywhere, configured for you.</p>
|
|
</div>
|
|
<div class="card glass">
|
|
<div class="ico"><svg viewBox="0 0 24 24"><path d="M3 7l9-4 9 4-9 4-9-4Z"/><path d="m3 12 9 4 9-4M3 17l9 4 9-4"/></svg></div>
|
|
<h3>Rootless Docker</h3>
|
|
<p>Containers run without root and with sane security defaults — CrowdSec on guard out of the box.</p>
|
|
</div>
|
|
<div class="card glass">
|
|
<div class="ico"><svg viewBox="0 0 24 24"><rect x="3" y="4" width="18" height="14" rx="2"/><path d="M3 9h18M8 21h8"/></svg></div>
|
|
<h3>A real dashboard</h3>
|
|
<p>Install, configure, back up and monitor everything from a clean web UI. No SSH archaeology.</p>
|
|
</div>
|
|
<div class="card glass">
|
|
<div class="ico"><svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="9"/><path d="M3 12h18M12 3a15 15 0 0 1 0 18M12 3a15 15 0 0 0 0 18"/></svg></div>
|
|
<h3>Optional VPN routing</h3>
|
|
<p>Send any app's traffic through gluetun. Keep the things that should be private, private.</p>
|
|
</div>
|
|
<div class="card glass">
|
|
<div class="ico"><svg viewBox="0 0 24 24"><path d="M2 12s4-7 10-7 10 7 10 7-4 7-10 7S2 12 2 12Z"/><path d="m4 4 16 16"/></svg></div>
|
|
<h3>No telemetry</h3>
|
|
<p>Nothing phones home. No accounts required to self-host. The software is yours, entirely.</p>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- ===== APPS (generated from the repo) ===== -->
|
|
<section class="pad wrap apps-section" id="apps">
|
|
<span class="eyebrow reveal">The constellation</span>
|
|
<h2 class="reveal">Dozens of apps, <span class="grad">one sky</span></h2>
|
|
<p class="lead reveal" style="margin-inline:auto">Pulled straight from the repo — 31 apps you can light up from the dashboard, and switch off just as easily.</p>
|
|
|
|
<div class="app-filters reveal">
|
|
<button class="chip active" data-cat="all">All <span class="n">31</span></button>
|
|
<button class="chip" data-cat="networking">Networking <span class="n">9</span></button>
|
|
<button class="chip" data-cat="recommended">Recommended <span class="n">4</span></button>
|
|
<button class="chip" data-cat="security">Security <span class="n">4</span></button>
|
|
<button class="chip" data-cat="knowledge">Knowledge <span class="n">3</span></button>
|
|
<button class="chip" data-cat="productivity">Productivity <span class="n">3</span></button>
|
|
<button class="chip" data-cat="storage">Storage <span class="n">3</span></button>
|
|
<button class="chip" data-cat="communication">Communication <span class="n">2</span></button>
|
|
<button class="chip" data-cat="development">Development <span class="n">2</span></button>
|
|
<button class="chip" data-cat="media">Media <span class="n">2</span></button>
|
|
<button class="chip" data-cat="monitoring">Monitoring <span class="n">2</span></button>
|
|
<button class="chip" data-cat="system">System <span class="n">1</span></button>
|
|
</div>
|
|
|
|
<div class="app-grid reveal">
|
|
<article class="app-card glass" data-cats="networking">
|
|
<div class="app-card-head">
|
|
<img class="app-ico" src="assets/apps/adguard.svg" alt="" loading="lazy" width="42" height="42">
|
|
<div>
|
|
<h3>AdGuard</h3>
|
|
<span class="app-cat">networking</span>
|
|
</div>
|
|
</div>
|
|
<p>DNS based Ad Blocking</p>
|
|
</article>
|
|
|
|
<article class="app-card glass" data-cats="security">
|
|
<div class="app-card-head">
|
|
<img class="app-ico" src="assets/apps/authelia.svg" alt="" loading="lazy" width="42" height="42">
|
|
<div>
|
|
<h3>Authelia</h3>
|
|
<span class="app-cat">security</span>
|
|
</div>
|
|
</div>
|
|
<p>Authentication & SSO</p>
|
|
</article>
|
|
|
|
<article class="app-card glass" data-cats="knowledge">
|
|
<div class="app-card-head">
|
|
<img class="app-ico" src="assets/apps/bookstack.svg" alt="" loading="lazy" width="42" height="42">
|
|
<div>
|
|
<h3>Bookstack</h3>
|
|
<span class="app-cat">knowledge</span>
|
|
</div>
|
|
</div>
|
|
<p>Wiki/Knowledge Base</p>
|
|
</article>
|
|
|
|
<article class="app-card glass" data-cats="security recommended">
|
|
<div class="app-card-head">
|
|
<img class="app-ico" src="assets/apps/crowdsec.svg" alt="" loading="lazy" width="42" height="42">
|
|
<div>
|
|
<h3>CrowdSec</h3>
|
|
<span class="app-cat">security</span>
|
|
</div>
|
|
</div>
|
|
<p>Intrusion Prevention</p>
|
|
</article>
|
|
|
|
<article class="app-card glass" data-cats="productivity">
|
|
<div class="app-card-head">
|
|
<img class="app-ico" src="assets/apps/dashy.svg" alt="" loading="lazy" width="42" height="42">
|
|
<div>
|
|
<h3>Dashy</h3>
|
|
<span class="app-cat">productivity</span>
|
|
</div>
|
|
</div>
|
|
<p>Dashboard Tool</p>
|
|
</article>
|
|
|
|
<article class="app-card glass" data-cats="productivity">
|
|
<div class="app-card-head">
|
|
<img class="app-ico" src="assets/apps/focalboard.svg" alt="" loading="lazy" width="42" height="42">
|
|
<div>
|
|
<h3>Focalboard</h3>
|
|
<span class="app-cat">productivity</span>
|
|
</div>
|
|
</div>
|
|
<p>Project Management</p>
|
|
</article>
|
|
|
|
<article class="app-card glass" data-cats="development">
|
|
<div class="app-card-head">
|
|
<img class="app-ico" src="assets/apps/gitea.svg" alt="" loading="lazy" width="42" height="42">
|
|
<div>
|
|
<h3>Gitea</h3>
|
|
<span class="app-cat">development</span>
|
|
</div>
|
|
</div>
|
|
<p>Git Repository Management</p>
|
|
</article>
|
|
|
|
<article class="app-card glass" data-cats="networking recommended">
|
|
<div class="app-card-head">
|
|
<img class="app-ico" src="assets/apps/gluetun.svg" alt="" loading="lazy" width="42" height="42">
|
|
<div>
|
|
<h3>Gluetun</h3>
|
|
<span class="app-cat">networking</span>
|
|
</div>
|
|
</div>
|
|
<p>VPN Container Router</p>
|
|
</article>
|
|
|
|
<article class="app-card glass" data-cats="monitoring">
|
|
<div class="app-card-head">
|
|
<img class="app-ico" src="assets/apps/grafana.svg" alt="" loading="lazy" width="42" height="42">
|
|
<div>
|
|
<h3>Grafana</h3>
|
|
<span class="app-cat">monitoring</span>
|
|
</div>
|
|
</div>
|
|
<p>Metrics Visualizer</p>
|
|
</article>
|
|
|
|
<article class="app-card glass" data-cats="networking">
|
|
<div class="app-card-head">
|
|
<img class="app-ico" src="assets/apps/headscale.svg" alt="" loading="lazy" width="42" height="42">
|
|
<div>
|
|
<h3>Headscale</h3>
|
|
<span class="app-cat">networking</span>
|
|
</div>
|
|
</div>
|
|
<p>WireGuard VPN Controller</p>
|
|
</article>
|
|
|
|
<article class="app-card glass" data-cats="media">
|
|
<div class="app-card-head">
|
|
<img class="app-ico" src="assets/apps/invidious.svg" alt="" loading="lazy" width="42" height="42">
|
|
<div>
|
|
<h3>Invidious</h3>
|
|
<span class="app-cat">media</span>
|
|
</div>
|
|
</div>
|
|
<p>YouTube Frontend</p>
|
|
</article>
|
|
|
|
<article class="app-card glass" data-cats="networking">
|
|
<div class="app-card-head">
|
|
<img class="app-ico" src="assets/apps/ipinfo.svg" alt="" loading="lazy" width="42" height="42">
|
|
<div>
|
|
<h3>IPinfo</h3>
|
|
<span class="app-cat">networking</span>
|
|
</div>
|
|
</div>
|
|
<p>IP Information</p>
|
|
</article>
|
|
|
|
<article class="app-card glass" data-cats="media">
|
|
<div class="app-card-head">
|
|
<img class="app-ico" src="assets/apps/jellyfin.svg" alt="" loading="lazy" width="42" height="42">
|
|
<div>
|
|
<h3>Jellyfin</h3>
|
|
<span class="app-cat">media</span>
|
|
</div>
|
|
</div>
|
|
<p>Media Server</p>
|
|
</article>
|
|
|
|
<article class="app-card glass" data-cats="communication">
|
|
<div class="app-card-head">
|
|
<img class="app-ico" src="assets/apps/jitsimeet.svg" alt="" loading="lazy" width="42" height="42">
|
|
<div>
|
|
<h3>Jitsi Meet</h3>
|
|
<span class="app-cat">communication</span>
|
|
</div>
|
|
</div>
|
|
<p>Video Conferencing</p>
|
|
</article>
|
|
|
|
<article class="app-card glass" data-cats="system">
|
|
<div class="app-card-head">
|
|
<img class="app-ico" src="assets/apps/libreportal.svg" alt="" loading="lazy" width="42" height="42">
|
|
<div>
|
|
<h3>LibrePortal</h3>
|
|
<span class="app-cat">system</span>
|
|
</div>
|
|
</div>
|
|
<p>WebUI Dashboard</p>
|
|
</article>
|
|
|
|
<article class="app-card glass" data-cats="knowledge">
|
|
<div class="app-card-head">
|
|
<img class="app-ico" src="assets/apps/linkding.svg" alt="" loading="lazy" width="42" height="42">
|
|
<div>
|
|
<h3>Linkding</h3>
|
|
<span class="app-cat">knowledge</span>
|
|
</div>
|
|
</div>
|
|
<p>Bookmark Manager</p>
|
|
</article>
|
|
|
|
<article class="app-card glass" data-cats="communication">
|
|
<div class="app-card-head">
|
|
<img class="app-ico" src="assets/apps/mastodon.svg" alt="" loading="lazy" width="42" height="42">
|
|
<div>
|
|
<h3>Mastodon</h3>
|
|
<span class="app-cat">communication</span>
|
|
</div>
|
|
</div>
|
|
<p>Social Network</p>
|
|
</article>
|
|
|
|
<article class="app-card glass" data-cats="productivity">
|
|
<div class="app-card-head">
|
|
<img class="app-ico" src="assets/apps/default.svg" alt="" loading="lazy" width="42" height="42">
|
|
<div>
|
|
<h3>MoneyApp</h3>
|
|
<span class="app-cat">productivity</span>
|
|
</div>
|
|
</div>
|
|
<p>Household Money Management</p>
|
|
</article>
|
|
|
|
<article class="app-card glass" data-cats="storage">
|
|
<div class="app-card-head">
|
|
<img class="app-ico" src="assets/apps/nextcloud.svg" alt="" loading="lazy" width="42" height="42">
|
|
<div>
|
|
<h3>Nextcloud</h3>
|
|
<span class="app-cat">storage</span>
|
|
</div>
|
|
</div>
|
|
<p>Self-hosted Cloud Storage</p>
|
|
</article>
|
|
|
|
<article class="app-card glass" data-cats="development">
|
|
<div class="app-card-head">
|
|
<img class="app-ico" src="assets/apps/ollama.svg" alt="" loading="lazy" width="42" height="42">
|
|
<div>
|
|
<h3>Ollama</h3>
|
|
<span class="app-cat">development</span>
|
|
</div>
|
|
</div>
|
|
<p>Local AI Model Hosting</p>
|
|
</article>
|
|
|
|
<article class="app-card glass" data-cats="storage">
|
|
<div class="app-card-head">
|
|
<img class="app-ico" src="assets/apps/onlyoffice.svg" alt="" loading="lazy" width="42" height="42">
|
|
<div>
|
|
<h3>OnlyOffice</h3>
|
|
<span class="app-cat">storage</span>
|
|
</div>
|
|
</div>
|
|
<p>Collaborative Office Suite</p>
|
|
</article>
|
|
|
|
<article class="app-card glass" data-cats="storage">
|
|
<div class="app-card-head">
|
|
<img class="app-ico" src="assets/apps/owncloud.svg" alt="" loading="lazy" width="42" height="42">
|
|
<div>
|
|
<h3>OwnCloud</h3>
|
|
<span class="app-cat">storage</span>
|
|
</div>
|
|
</div>
|
|
<p>Cloud Storage</p>
|
|
</article>
|
|
|
|
<article class="app-card glass" data-cats="networking">
|
|
<div class="app-card-head">
|
|
<img class="app-ico" src="assets/apps/pihole.svg" alt="" loading="lazy" width="42" height="42">
|
|
<div>
|
|
<h3>PiHole</h3>
|
|
<span class="app-cat">networking</span>
|
|
</div>
|
|
</div>
|
|
<p>DNS-based Ad Blocking</p>
|
|
</article>
|
|
|
|
<article class="app-card glass" data-cats="monitoring">
|
|
<div class="app-card-head">
|
|
<img class="app-ico" src="assets/apps/prometheus.svg" alt="" loading="lazy" width="42" height="42">
|
|
<div>
|
|
<h3>Prometheus</h3>
|
|
<span class="app-cat">monitoring</span>
|
|
</div>
|
|
</div>
|
|
<p>Monitoring and Alerting</p>
|
|
</article>
|
|
|
|
<article class="app-card glass" data-cats="security">
|
|
<div class="app-card-head">
|
|
<img class="app-ico" src="assets/apps/searxng.svg" alt="" loading="lazy" width="42" height="42">
|
|
<div>
|
|
<h3>SearxNG</h3>
|
|
<span class="app-cat">security</span>
|
|
</div>
|
|
</div>
|
|
<p>Search Engine</p>
|
|
</article>
|
|
|
|
<article class="app-card glass" data-cats="networking">
|
|
<div class="app-card-head">
|
|
<img class="app-ico" src="assets/apps/speedtest.svg" alt="" loading="lazy" width="42" height="42">
|
|
<div>
|
|
<h3>Speedtest</h3>
|
|
<span class="app-cat">networking</span>
|
|
</div>
|
|
</div>
|
|
<p>Network Performance Monitoring</p>
|
|
</article>
|
|
|
|
<article class="app-card glass" data-cats="networking recommended">
|
|
<div class="app-card-head">
|
|
<img class="app-ico" src="assets/apps/traefik.svg" alt="" loading="lazy" width="42" height="42">
|
|
<div>
|
|
<h3>Traefik</h3>
|
|
<span class="app-cat">networking</span>
|
|
</div>
|
|
</div>
|
|
<p>Reverse Proxy</p>
|
|
</article>
|
|
|
|
<article class="app-card glass" data-cats="knowledge">
|
|
<div class="app-card-head">
|
|
<img class="app-ico" src="assets/apps/trilium.svg" alt="" loading="lazy" width="42" height="42">
|
|
<div>
|
|
<h3>Trilium</h3>
|
|
<span class="app-cat">knowledge</span>
|
|
</div>
|
|
</div>
|
|
<p>Notes & Knowledge Management</p>
|
|
</article>
|
|
|
|
<article class="app-card glass" data-cats="networking">
|
|
<div class="app-card-head">
|
|
<img class="app-ico" src="assets/apps/unbound.svg" alt="" loading="lazy" width="42" height="42">
|
|
<div>
|
|
<h3>Unbound</h3>
|
|
<span class="app-cat">networking</span>
|
|
</div>
|
|
</div>
|
|
<p>DNS Resolver</p>
|
|
</article>
|
|
|
|
<article class="app-card glass" data-cats="security">
|
|
<div class="app-card-head">
|
|
<img class="app-ico" src="assets/apps/vaultwarden.svg" alt="" loading="lazy" width="42" height="42">
|
|
<div>
|
|
<h3>Vaultwarden</h3>
|
|
<span class="app-cat">security</span>
|
|
</div>
|
|
</div>
|
|
<p>Password Manager</p>
|
|
</article>
|
|
|
|
<article class="app-card glass" data-cats="networking recommended">
|
|
<div class="app-card-head">
|
|
<img class="app-ico" src="assets/apps/wireguard.svg" alt="" loading="lazy" width="42" height="42">
|
|
<div>
|
|
<h3>Wireguard Easy</h3>
|
|
<span class="app-cat">networking</span>
|
|
</div>
|
|
</div>
|
|
<p>VPN Server</p>
|
|
</article>
|
|
|
|
</div>
|
|
<p class="app-count">31 apps</p>
|
|
</section>
|
|
|
|
<!-- ===== CONNECT / COURIER ===== -->
|
|
<section class="pad wrap" id="connect">
|
|
<div class="connect">
|
|
<div class="reveal">
|
|
<span class="eyebrow">LibrePortal Connect · optional</span>
|
|
<h2>We're the courier.<br><span class="grad">You hold the key.</span></h2>
|
|
<p class="lead">Reaching your server from your phone and keeping off-site backups are the fiddly bits.
|
|
Connect handles them — but works like a courier carrying a <b>sealed box</b>.</p>
|
|
<ul>
|
|
<li><svg viewBox="0 0 24 24"><path d="M5 12h14M13 6l6 6-6 6"/></svg><span><b>Reach it anywhere.</b> No port-forwarding, no exposing your box to the internet.</span></li>
|
|
<li><svg viewBox="0 0 24 24"><rect x="4" y="10" width="16" height="11" rx="2"/><path d="M8 10V7a4 4 0 0 1 8 0v3"/></svg><span><b>Encrypted off-site backups.</b> We only ever hold a locked box — you keep the only key.</span></li>
|
|
<li><svg viewBox="0 0 24 24"><path d="m2 12 5-5 5 5-5 5-5-5Z" opacity=".5"/><path d="M12 12h10"/></svg><span><b>We never run your apps.</b> Your data and keys never leave your machine.</span></li>
|
|
</ul>
|
|
<span class="pill">every part is free to self-host, too — you pay only for convenience</span>
|
|
</div>
|
|
<div class="vault reveal">
|
|
<svg viewBox="0 0 200 200" aria-hidden="true">
|
|
<g class="orbit" opacity=".55">
|
|
<ellipse cx="100" cy="100" rx="92" ry="40" stroke="var(--accent)" stroke-width="1" fill="none" opacity=".5"/>
|
|
<circle cx="192" cy="100" r="3.2" fill="var(--accent)"/>
|
|
</g>
|
|
<g class="orbit" style="animation-duration:18s;animation-direction:reverse" opacity=".55">
|
|
<ellipse cx="100" cy="100" rx="40" ry="92" stroke="#7ae9ff" stroke-width="1" fill="none" opacity=".45"/>
|
|
<circle cx="100" cy="8" r="2.6" fill="#7ae9ff"/>
|
|
</g>
|
|
<g transform="translate(100 100)">
|
|
<rect x="-38" y="-30" width="76" height="62" rx="9" fill="rgba(10,16,32,.92)" stroke="url(#bg)" stroke-width="1.6"/>
|
|
<path d="M-38 -10 H38" stroke="url(#bg)" stroke-width="1.2" opacity=".5"/>
|
|
<rect x="-12" y="-4" width="24" height="20" rx="4" fill="none" stroke="var(--accent)" stroke-width="2"/>
|
|
<path d="M-6 -4 V-12 a6 6 0 0 1 12 0 V-4" fill="none" stroke="var(--accent)" stroke-width="2"/>
|
|
<circle cx="0" cy="6" r="2.4" fill="var(--accent)"/>
|
|
</g>
|
|
<defs><linearGradient id="bg" x1="-40" y1="-40" x2="40" y2="40" gradientUnits="userSpaceOnUse"><stop stop-color="#7ae9ff"/><stop offset="1" stop-color="#00d4ff"/></linearGradient></defs>
|
|
</svg>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- ===== PROMISE ===== -->
|
|
<section class="pad wrap promise" id="promise">
|
|
<span class="eyebrow reveal">The promise</span>
|
|
<h2 class="reveal">Free software, <span class="grad">and it stays that way</span></h2>
|
|
<p class="lead reveal" style="margin-inline:auto">In plain language, so you can hold us to it.</p>
|
|
<div class="pledges stagger">
|
|
<div class="pledge glass"><div class="big grad">100%</div><p>Every feature, free to self-host. Forever. No crippled edition.</p></div>
|
|
<div class="pledge glass"><div class="big grad">0</div><p>Trackers. No telemetry, no phoning home, no accounts to run it.</p></div>
|
|
<div class="pledge glass"><div class="big grad">∅</div><p>Feature paywalls. You never pay to <em>unlock</em> — only for convenience.</p></div>
|
|
<div class="pledge glass"><div class="big grad">∞</div><p>What's open stays open. No rug-pulls, ever. AGPLv3.</p></div>
|
|
</div>
|
|
<a class="link reveal" href="https://gitea.scottwebstar.co.uk/Webstar/LibrePortal/raw/branch/main/PROMISE.md" target="_blank" rel="noopener">Read the full Promise →</a>
|
|
</section>
|
|
|
|
<!-- ===== FINAL CTA ===== -->
|
|
<section class="final wrap">
|
|
<span class="eyebrow reveal">Ready when you are</span>
|
|
<h2 class="reveal">Light up your corner<br>of the <span class="grad">universe.</span></h2>
|
|
<div class="portal reveal">
|
|
<div class="term">
|
|
<div class="term-bar"><i></i><i></i><i></i><em>~</em></div>
|
|
<div class="term-body">
|
|
<code data-install-cmd="bash <(curl -fsSL https://get.libreportal.org) init"><span class="p">bash</span> <(<span class="p">curl</span> -fsSL <span class="u">https://get.libreportal.org</span>) init</code>
|
|
<button class="copy" aria-label="Copy install command">
|
|
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="9" y="9" width="11" height="11" rx="2"/><path d="M5 15V5a2 2 0 0 1 2-2h10"/></svg>
|
|
<span>Copy</span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
|
|
<footer>
|
|
<div class="wrap">
|
|
<div class="foot-grid">
|
|
<div style="max-width:300px">
|
|
<a class="libreportal-logo" href="#top"><img src="assets/libreportal.svg" alt="" width="32" height="32">Libre<b>Portal</b></a>
|
|
<p style="color:var(--text-faint);font-size:.92rem">Your own private corner of the internet — free, open, and yours.</p>
|
|
</div>
|
|
<div class="foot-col">
|
|
<h4>Project</h4>
|
|
<a href="https://gitea.scottwebstar.co.uk/Webstar/LibrePortal" target="_blank" rel="noopener">Source code</a>
|
|
<a href="https://gitea.scottwebstar.co.uk/Webstar/LibrePortal/raw/branch/main/PROMISE.md" target="_blank" rel="noopener">The Promise</a>
|
|
<a href="https://gitea.scottwebstar.co.uk/Webstar/LibrePortal/raw/branch/main/CONTRIBUTING.md" target="_blank" rel="noopener">Contributing</a>
|
|
</div>
|
|
<div class="foot-col">
|
|
<h4>Get started</h4>
|
|
<a href="#install">Install</a>
|
|
<a href="#apps">Browse apps</a>
|
|
<a href="#connect">LibrePortal Connect</a>
|
|
</div>
|
|
</div>
|
|
<div class="colophon">
|
|
<span>Built from scratch since 2023 · inspired by <a href="https://gitlab.com/bmcgonag/docker_installs" target="_blank" rel="noopener">bmcgonag/docker_installs</a></span>
|
|
<span>GNU AGPLv3 · what's open stays open 🕊️</span>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
|
|
<script src="assets/main.js" defer></script>
|
|
</body>
|
|
</html>
|