From 79c01811c2299cf18f1aeca5cc88b92cc7703f0a Mon Sep 17 00:00:00 2001 From: Arc Date: Mon, 14 Sep 2026 14:46:06 +0100 Subject: [PATCH 1/6] install buttons --- assets/css/lnbits.css | 107 ++++++++++++++++++++++++++++++++++++++++++ assets/i18n/ar.json | 13 +++-- assets/i18n/de.json | 13 +++-- assets/i18n/en.json | 13 +++-- assets/i18n/es.json | 13 +++-- assets/i18n/fr.json | 13 +++-- assets/i18n/it.json | 13 +++-- assets/i18n/ja.json | 13 +++-- assets/i18n/ko.json | 13 +++-- assets/i18n/nl.json | 13 +++-- assets/i18n/pt.json | 13 +++-- assets/i18n/ru.json | 13 +++-- assets/i18n/zh.json | 13 +++-- assets/js/download.js | 91 +++++++++++++++++++++++++++++++++++ index.html | 54 ++++++++++----------- 15 files changed, 330 insertions(+), 78 deletions(-) create mode 100644 assets/js/download.js diff --git a/assets/css/lnbits.css b/assets/css/lnbits.css index c2e4807..3c88361 100644 --- a/assets/css/lnbits.css +++ b/assets/css/lnbits.css @@ -284,6 +284,113 @@ body.body--dark { white-space: nowrap; } +.ln-download { + max-width: 400px; + margin: 0 auto; + padding: 24px 0; +} + +.ln-download__title { + margin: 0 0 28px; + color: var(--ln-text); + font-size: clamp(1.8rem, 3vw, 2.6rem); + line-height: 1.15; + letter-spacing: -0.03em; +} + +.ln-download__control { + display: flex; + direction: ltr; + border-radius: 16px; + background: linear-gradient(135deg, var(--ln-pink), var(--ln-purple)); + box-shadow: 0 12px 30px rgba(255, 30, 230, 0.25); +} + +.ln-download__button, +.ln-download__toggle { + display: flex; + align-items: center; + justify-content: center; + min-height: 60px; + color: #0b0c11; + background: transparent; + border: 0; + font: inherit; + font-weight: 700; + text-decoration: none; +} + +.ln-download__button { + flex: 1; + gap: 10px; + padding: 14px 16px; + border-radius: 16px 0 0 16px; +} + +.ln-download__button svg { + flex-shrink: 0; +} + +.ln-download__toggle { + flex: 0 0 48px; + border-left: 1px solid rgba(11, 12, 17, 0.25); + border-radius: 0 16px 16px 0; +} + +.ln-download__toggle::after { + margin: 0; +} + +.ln-download__button:hover, +.ln-download__toggle:hover { + color: #0b0c11; + background: rgba(255, 255, 255, 0.15); +} + +.ln-download__button:focus-visible, +.ln-download__toggle:focus-visible { + outline: 2px solid white; + outline-offset: 3px; +} + +.ln-download__menu { + width: 100%; + padding: 8px; + border: 1px solid rgba(255, 30, 230, 0.3); + border-radius: 16px; + background: #1c1b2a; + box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4); +} + +.ln-download__menu .dropdown-item { + padding: 12px; + border-radius: 8px; + color: var(--ln-text); + white-space: normal; +} + +.ln-download__menu .dropdown-item:hover, +.ln-download__menu .dropdown-item:focus, +.ln-download__menu .dropdown-item.active { + color: var(--ln-pink); + background: rgba(255, 30, 230, 0.1); +} + +.ln-download__menu .dropdown-divider { + border-color: rgba(255, 255, 255, 0.15); +} + +.ln-download__status { + margin: 14px 0 0; + color: var(--ln-muted); + font-size: 0.85rem; + line-height: 1.5; +} + +.ln-download__status:empty { + display: none; +} + .ln-landing-product, .ln-landing-product:hover, .ln-landing-product:focus { diff --git a/assets/i18n/ar.json b/assets/i18n/ar.json index 1cd2d6b..d080755 100644 --- a/assets/i18n/ar.json +++ b/assets/i18n/ar.json @@ -44,10 +44,15 @@ "products.box.bullet1": "سهل", "products.box.bullet2": "يعمل محليًا", "products.box.bullet3": "عتاد جاهز للتشغيل", - "products.selfhost.title": "شغّله بنفسك", - "products.selfhost.bullet1": "متقدم", - "products.selfhost.bullet2": "شغّله في أي مكان", - "products.selfhost.bullet3": "تحكم كامل", + "download.title": "ابدأ بقبول المدفوعات خلال دقائق.", + "download.button": "تنزيل {format}", + "download.choose": "اختر التنزيل", + "download.select": "اختر نظام التشغيل", + "download.source": "البناء من الشيفرة المصدرية", + "download.releases": "عرض الإصدارات", + "download.fallback": "ابحث عن ملفات التثبيت المتاحة في إصدارات GitHub.", + "download.unavailable": "ملف التثبيت هذا غير متاح بعد. تصفح الإصدارات أو ابنِ التطبيق من الشيفرة المصدرية.", + "download.preview": "إصدار تجريبي", "contributors.label": "المساهمون", "features.title": "تطبيقك الشامل للمدفوعات.", "features.lead": "
LNbits منصة مدفوعات معيارية — محفظة ومتجر تطبيقات ومحرك أتمتة في منصة واحدة.", diff --git a/assets/i18n/de.json b/assets/i18n/de.json index 0de1e8a..f9eecad 100644 --- a/assets/i18n/de.json +++ b/assets/i18n/de.json @@ -44,10 +44,15 @@ "products.box.bullet1": "Einfach", "products.box.bullet2": "Läuft lokal", "products.box.bullet3": "Plug-and-Play-Hardware", - "products.selfhost.title": "Selbst betreiben", - "products.selfhost.bullet1": "Fortgeschritten", - "products.selfhost.bullet2": "Überall betreiben", - "products.selfhost.bullet3": "Volle Kontrolle", + "download.title": "Akzeptiere Zahlungen in wenigen Minuten.", + "download.button": "{format} herunterladen", + "download.choose": "Download auswählen", + "download.select": "Wähle dein Betriebssystem", + "download.source": "Aus dem Quellcode erstellen", + "download.releases": "Versionen ansehen", + "download.fallback": "Verfügbare Installationsdateien findest du in den GitHub-Releases.", + "download.unavailable": "Diese Installationsdatei ist noch nicht verfügbar. Sieh dir die Releases an oder erstelle LNbits aus dem Quellcode.", + "download.preview": "Vorabversion", "contributors.label": "Mitwirkende", "features.title": "Deine All-in-One-App für Zahlungen.", "features.lead": "
LNbits ist eine modulare Zahlungsplattform - Wallet, App-Store und Automatisierungs-Engine in einem.", diff --git a/assets/i18n/en.json b/assets/i18n/en.json index a11c826..57b941d 100644 --- a/assets/i18n/en.json +++ b/assets/i18n/en.json @@ -44,10 +44,15 @@ "products.box.bullet1": "Easy", "products.box.bullet2": "Runs locally", "products.box.bullet3": "Plug & play hardware", - "products.selfhost.title": "Run Yourself", - "products.selfhost.bullet1": "Advanced", - "products.selfhost.bullet2": "Run anywhere", - "products.selfhost.bullet3": "Complete control", + "download.title": "Start accepting payments in minutes.", + "download.button": "Download {format}", + "download.choose": "Choose download", + "download.select": "Choose your operating system", + "download.source": "Build from source", + "download.releases": "View releases", + "download.fallback": "Find available installers on GitHub releases.", + "download.unavailable": "This installer is not available yet. Check releases or build from source.", + "download.preview": "Pre-release", "contributors.label": "Contributors", "features.title": "Your Everything App for Payments.", "features.lead": "
LNbits is a modular payments platform — a wallet, app store, and automation engine in one.", diff --git a/assets/i18n/es.json b/assets/i18n/es.json index 8fff5b7..b97d1a0 100644 --- a/assets/i18n/es.json +++ b/assets/i18n/es.json @@ -44,10 +44,15 @@ "products.box.bullet1": "Fácil", "products.box.bullet2": "Funciona localmente", "products.box.bullet3": "Hardware plug & play", - "products.selfhost.title": "Ejecútalo tú mismo", - "products.selfhost.bullet1": "Avanzado", - "products.selfhost.bullet2": "Ejecútalo en cualquier lugar", - "products.selfhost.bullet3": "Control total", + "download.title": "Empieza a aceptar pagos en minutos.", + "download.button": "Descargar {format}", + "download.choose": "Elegir descarga", + "download.select": "Elige tu sistema operativo", + "download.source": "Compilar desde el código fuente", + "download.releases": "Ver versiones", + "download.fallback": "Encuentra los instaladores disponibles en las versiones de GitHub.", + "download.unavailable": "Este instalador aún no está disponible. Consulta las versiones o compila desde el código fuente.", + "download.preview": "Versión preliminar", "contributors.label": "Colaboradores", "features.title": "Tu app integral para pagos.", "features.lead": "
LNbits es una plataforma modular de pagos — una billetera, tienda de apps y motor de automatización en uno.", diff --git a/assets/i18n/fr.json b/assets/i18n/fr.json index e9f6a0c..288d5b3 100644 --- a/assets/i18n/fr.json +++ b/assets/i18n/fr.json @@ -44,10 +44,15 @@ "products.box.bullet1": "Facile", "products.box.bullet2": "Fonctionne en local", "products.box.bullet3": "Matériel plug & play", - "products.selfhost.title": "Hébergez-le vous-même", - "products.selfhost.bullet1": "Avancé", - "products.selfhost.bullet2": "Exécutez-le partout", - "products.selfhost.bullet3": "Contrôle total", + "download.title": "Commencez à accepter des paiements en quelques minutes.", + "download.button": "Télécharger {format}", + "download.choose": "Choisir un téléchargement", + "download.select": "Choisissez votre système d’exploitation", + "download.source": "Compiler depuis les sources", + "download.releases": "Voir les versions", + "download.fallback": "Retrouvez les programmes d’installation disponibles dans les versions GitHub.", + "download.unavailable": "Ce programme d’installation n’est pas encore disponible. Consultez les versions ou compilez depuis les sources.", + "download.preview": "Préversion", "contributors.label": "Contributeurs", "features.title": "Votre application tout-en-un pour les paiements.", "features.lead": "
LNbits est une plateforme de paiement modulaire — un portefeuille, une boutique d'apps et un moteur d'automatisation en un.", diff --git a/assets/i18n/it.json b/assets/i18n/it.json index 8330502..e33419c 100644 --- a/assets/i18n/it.json +++ b/assets/i18n/it.json @@ -44,10 +44,15 @@ "products.box.bullet1": "Facile", "products.box.bullet2": "Funziona in locale", "products.box.bullet3": "Hardware plug & play", - "products.selfhost.title": "Eseguilo da solo", - "products.selfhost.bullet1": "Avanzato", - "products.selfhost.bullet2": "Eseguilo ovunque", - "products.selfhost.bullet3": "Controllo completo", + "download.title": "Inizia ad accettare pagamenti in pochi minuti.", + "download.button": "Scarica {format}", + "download.choose": "Scegli il download", + "download.select": "Scegli il tuo sistema operativo", + "download.source": "Compila dal codice sorgente", + "download.releases": "Vedi le versioni", + "download.fallback": "Trova i programmi di installazione disponibili nelle release di GitHub.", + "download.unavailable": "Questo programma di installazione non è ancora disponibile. Consulta le release o compila dal codice sorgente.", + "download.preview": "Versione preliminare", "contributors.label": "Contributori", "features.title": "La tua app tutto-in-uno per i pagamenti.", "features.lead": "
LNbits è una piattaforma di pagamenti modulare — un wallet, un app store e un motore di automazione in uno.", diff --git a/assets/i18n/ja.json b/assets/i18n/ja.json index 0f2c8d4..ca13348 100644 --- a/assets/i18n/ja.json +++ b/assets/i18n/ja.json @@ -44,10 +44,15 @@ "products.box.bullet1": "簡単", "products.box.bullet2": "ローカルで動作", "products.box.bullet3": "プラグアンドプレイのハードウェア", - "products.selfhost.title": "自分で運用", - "products.selfhost.bullet1": "上級者向け", - "products.selfhost.bullet2": "どこでも運用可能", - "products.selfhost.bullet3": "完全なコントロール", + "download.title": "わずか数分で支払いの受け付けを開始。", + "download.button": "{format} をダウンロード", + "download.choose": "ダウンロードを選択", + "download.select": "お使いの OS を選択", + "download.source": "ソースからビルド", + "download.releases": "リリースを見る", + "download.fallback": "利用可能なインストーラーは GitHub のリリースページで確認できます。", + "download.unavailable": "このインストーラーはまだ利用できません。リリースを確認するか、ソースからビルドしてください。", + "download.preview": "プレリリース", "contributors.label": "貢献者", "features.title": "支払いのためのオールインワンアプリ。", "features.lead": "
LNbits はモジュール型の決済プラットフォーム — ウォレット、アプリストア、自動化エンジンが一体。", diff --git a/assets/i18n/ko.json b/assets/i18n/ko.json index a44bbe0..2766636 100644 --- a/assets/i18n/ko.json +++ b/assets/i18n/ko.json @@ -44,10 +44,15 @@ "products.box.bullet1": "쉬움", "products.box.bullet2": "로컬에서 실행", "products.box.bullet3": "플러그 앤 플레이 하드웨어", - "products.selfhost.title": "직접 실행", - "products.selfhost.bullet1": "고급", - "products.selfhost.bullet2": "어디서나 실행", - "products.selfhost.bullet3": "완전한 제어", + "download.title": "몇 분 만에 결제 수락을 시작하세요.", + "download.button": "{format} 다운로드", + "download.choose": "다운로드 선택", + "download.select": "운영체제를 선택하세요", + "download.source": "소스에서 빌드", + "download.releases": "릴리스 보기", + "download.fallback": "GitHub 릴리스에서 사용 가능한 설치 파일을 확인하세요.", + "download.unavailable": "이 설치 파일은 아직 제공되지 않습니다. 릴리스를 확인하거나 소스에서 빌드하세요.", + "download.preview": "사전 릴리스", "contributors.label": "기여자", "features.title": "결제를 위한 올인원 앱.", "features.lead": "
LNbits는 모듈형 결제 플랫폼입니다 — 지갑, 앱스토어, 자동화 엔진을 하나로.", diff --git a/assets/i18n/nl.json b/assets/i18n/nl.json index 4b950bb..dc59d73 100644 --- a/assets/i18n/nl.json +++ b/assets/i18n/nl.json @@ -44,10 +44,15 @@ "products.box.bullet1": "Eenvoudig", "products.box.bullet2": "Draait lokaal", "products.box.bullet3": "Plug & play-hardware", - "products.selfhost.title": "Zelf draaien", - "products.selfhost.bullet1": "Geavanceerd", - "products.selfhost.bullet2": "Draai overal", - "products.selfhost.bullet3": "Volledige controle", + "download.title": "Accepteer binnen enkele minuten betalingen.", + "download.button": "{format} downloaden", + "download.choose": "Download kiezen", + "download.select": "Kies je besturingssysteem", + "download.source": "Bouwen vanuit broncode", + "download.releases": "Releases bekijken", + "download.fallback": "Vind beschikbare installatiebestanden bij de GitHub-releases.", + "download.unavailable": "Dit installatiebestand is nog niet beschikbaar. Bekijk de releases of bouw vanuit de broncode.", + "download.preview": "Voorlopige versie", "contributors.label": "Bijdragers", "features.title": "Jouw alles-in-één app voor betalingen.", "features.lead": "
LNbits is een modulair betalingsplatform — een wallet, app store en automatiseringsengine in één.", diff --git a/assets/i18n/pt.json b/assets/i18n/pt.json index 0a4e79f..19a9389 100644 --- a/assets/i18n/pt.json +++ b/assets/i18n/pt.json @@ -44,10 +44,15 @@ "products.box.bullet1": "Fácil", "products.box.bullet2": "Roda localmente", "products.box.bullet3": "Hardware plug & play", - "products.selfhost.title": "Execute Você Mesmo", - "products.selfhost.bullet1": "Avançado", - "products.selfhost.bullet2": "Rode em qualquer lugar", - "products.selfhost.bullet3": "Controle total", + "download.title": "Comece a aceitar pagamentos em minutos.", + "download.button": "Baixar {format}", + "download.choose": "Escolher download", + "download.select": "Escolha seu sistema operacional", + "download.source": "Compilar a partir do código-fonte", + "download.releases": "Ver versões", + "download.fallback": "Encontre os instaladores disponíveis nas versões do GitHub.", + "download.unavailable": "Este instalador ainda não está disponível. Confira as versões ou compile a partir do código-fonte.", + "download.preview": "Versão de pré-lançamento", "contributors.label": "Contribuidores", "features.title": "Seu app completo para pagamentos.", "features.lead": "
LNbits é uma plataforma modular de pagamentos — uma carteira, app store e motor de automação em um só lugar.", diff --git a/assets/i18n/ru.json b/assets/i18n/ru.json index 577730b..42d420a 100644 --- a/assets/i18n/ru.json +++ b/assets/i18n/ru.json @@ -44,10 +44,15 @@ "products.box.bullet1": "Просто", "products.box.bullet2": "Работает локально", "products.box.bullet3": "Оборудование plug & play", - "products.selfhost.title": "Запустите сами", - "products.selfhost.bullet1": "Для продвинутых", - "products.selfhost.bullet2": "Запускайте где угодно", - "products.selfhost.bullet3": "Полный контроль", + "download.title": "Начните принимать платежи за считанные минуты.", + "download.button": "Скачать {format}", + "download.choose": "Выбрать загрузку", + "download.select": "Выберите операционную систему", + "download.source": "Собрать из исходного кода", + "download.releases": "Посмотреть релизы", + "download.fallback": "Доступные установщики можно найти в релизах на GitHub.", + "download.unavailable": "Этот установщик пока недоступен. Посмотрите релизы или соберите из исходного кода.", + "download.preview": "Предварительная версия", "contributors.label": "Участники", "features.title": "Ваше приложение «всё‑в‑одном» для платежей.", "features.lead": "
LNbits — модульная платформа платежей: кошелек, магазин приложений и движок автоматизации в одном.", diff --git a/assets/i18n/zh.json b/assets/i18n/zh.json index 98087c4..9a605ac 100644 --- a/assets/i18n/zh.json +++ b/assets/i18n/zh.json @@ -44,10 +44,15 @@ "products.box.bullet1": "简单", "products.box.bullet2": "本地运行", "products.box.bullet3": "即插即用硬件", - "products.selfhost.title": "自行运行", - "products.selfhost.bullet1": "高级", - "products.selfhost.bullet2": "可在任何地方运行", - "products.selfhost.bullet3": "完全控制", + "download.title": "几分钟内即可开始收款。", + "download.button": "下载 {format}", + "download.choose": "选择下载", + "download.select": "选择你的操作系统", + "download.source": "从源码构建", + "download.releases": "查看发布版本", + "download.fallback": "在 GitHub 发布页面查找可用的安装程序。", + "download.unavailable": "此安装程序暂不可用。请查看发布版本或从源码构建。", + "download.preview": "预发布版本", "contributors.label": "贡献者", "features.title": "你的全能支付应用。", "features.lead": "
LNbits 是一个模块化支付平台——钱包、应用商店和自动化引擎三合一。", diff --git a/assets/js/download.js b/assets/js/download.js new file mode 100644 index 0000000..32f349b --- /dev/null +++ b/assets/js/download.js @@ -0,0 +1,91 @@ +window.addEventListener("DOMContentLoaded", () => { + const link = document.getElementById("ln-download-link"); + const label = document.getElementById("ln-download-label"); + const status = document.getElementById("ln-download-status"); + const options = Array.from(document.querySelectorAll("[data-download]")); + if (!link || !label || !status) return; + + const releasesUrl = "https://github.com/lnbits/lnbits/releases"; + const formats = { linux: "AppImage", windows: "EXE", mac: "DMG" }; + const assets = {}; + const platform = navigator.userAgentData?.platform || navigator.platform || ""; + const mobile = /Android|iPhone|iPad|iPod/i.test(navigator.userAgent) || + (/Mac/i.test(platform) && navigator.maxTouchPoints > 1); + let selected = mobile ? null : /Win/i.test(platform) ? "windows" : + /Mac/i.test(platform) ? "mac" : /Linux/i.test(platform) ? "linux" : null; + let state = "loading"; + + function t(key, fallback) { + return window.LNbitsI18n?.t(key) || fallback; + } + + function render() { + const asset = assets[selected]; + link.href = asset?.browser_download_url || releasesUrl; + label.removeAttribute("data-i18n"); + label.textContent = !selected ? t("download.choose", "Choose download") : + state === "ready" && !asset ? t("download.releases", "View releases") : + t("download.button", "Download {format}").replace("{format}", formats[selected]); + status.textContent = state === "error" ? + t("download.fallback", "Find available installers on GitHub releases.") : + selected && state === "ready" && !asset ? + t("download.unavailable", "This installer is not available yet. Check releases or build from source.") : + asset?.prerelease ? t("download.preview", "Pre-release") : ""; + options.forEach((option) => { + const key = option.dataset.download; + option.href = assets[key]?.browser_download_url || releasesUrl; + option.classList.toggle("active", key === selected); + if (key === selected) option.setAttribute("aria-current", "true"); + else option.removeAttribute("aria-current"); + }); + } + + options.forEach((option) => { + option.addEventListener("click", (event) => { + if (event.ctrlKey || event.metaKey || event.shiftKey || event.altKey) return; + event.preventDefault(); + selected = option.dataset.download; + render(); + link.focus(); + }); + }); + window.LNbitsI18n?.onChange(render); + render(); + + // Resolve versioned filenames from published releases, preferring stable builds. + // Some releases have no installers, so inspect recent releases per format. + const controller = new AbortController(); + const timeout = setTimeout(() => controller.abort(), 8000); + fetch("https://api.github.com/repos/lnbits/lnbits/releases?per_page=10", { + signal: controller.signal, + headers: { Accept: "application/vnd.github+json" } + }) + .then((response) => { + if (!response.ok) throw new Error("Could not load releases"); + return response.json(); + }) + .then((releases) => { + if (!Array.isArray(releases)) throw new Error("Invalid releases"); + const published = releases.filter((release) => !release.draft); + const ordered = published.filter((release) => !release.prerelease) + .concat(published.filter((release) => release.prerelease)); + Object.entries(formats).forEach(([key, format]) => { + for (const release of ordered) { + const asset = (release.assets || []).find((candidate) => + candidate.name?.toLowerCase().endsWith("." + format.toLowerCase()) && + candidate.browser_download_url?.startsWith(releasesUrl + "/download/") + ); + if (asset) { + assets[key] = { ...asset, prerelease: release.prerelease }; + break; + } + } + }); + state = "ready"; + }) + .catch(() => { state = "error"; }) + .finally(() => { + clearTimeout(timeout); + render(); + }); +}); diff --git a/index.html b/index.html index 4c47a39..9a0a1d5 100644 --- a/index.html +++ b/index.html @@ -28,7 +28,6 @@ - @@ -228,8 +227,28 @@

-
-
+
+
+
+

Start accepting payments in minutes.

+
+ + + Choose download + + + +
+

+
+
+
-
+
-
- - Run Yourself product image -
- Run Yourself -
    -
  • Advanced
    • -
  • Run anywhere
    • -
  • Complete control
    • -
-
- -
@@ -677,6 +670,7 @@

+
From 2ab51da506d70ddbf97ca26c931e849ec483f9af Mon Sep 17 00:00:00 2001 From: Arc Date: Mon, 14 Sep 2026 15:18:43 +0100 Subject: [PATCH 2/6] looks good --- assets/css/lnbits.css | 199 ++++++++++++++++++++++++++---------------- assets/i18n/ar.json | 2 + assets/i18n/de.json | 2 + assets/i18n/en.json | 2 + assets/i18n/es.json | 2 + assets/i18n/fr.json | 2 + assets/i18n/it.json | 2 + assets/i18n/ja.json | 2 + assets/i18n/ko.json | 2 + assets/i18n/nl.json | 2 + assets/i18n/pt.json | 2 + assets/i18n/ru.json | 2 + assets/i18n/zh.json | 2 + index.html | 82 +++++++++-------- 14 files changed, 191 insertions(+), 114 deletions(-) diff --git a/assets/css/lnbits.css b/assets/css/lnbits.css index 3c88361..1dbb468 100644 --- a/assets/css/lnbits.css +++ b/assets/css/lnbits.css @@ -288,18 +288,23 @@ body.body--dark { max-width: 400px; margin: 0 auto; padding: 24px 0; + text-align: center; } .ln-download__title { margin: 0 0 28px; color: var(--ln-text); font-size: clamp(1.8rem, 3vw, 2.6rem); + font-weight: 400; line-height: 1.15; letter-spacing: -0.03em; } .ln-download__control { display: flex; + width: fit-content; + max-width: 100%; + margin-inline: auto; direction: ltr; border-radius: 16px; background: linear-gradient(135deg, var(--ln-pink), var(--ln-purple)); @@ -311,7 +316,7 @@ body.body--dark { display: flex; align-items: center; justify-content: center; - min-height: 60px; + min-height: 48px; color: #0b0c11; background: transparent; border: 0; @@ -322,8 +327,8 @@ body.body--dark { .ln-download__button { flex: 1; - gap: 10px; - padding: 14px 16px; + gap: 8px; + padding: 10px 16px; border-radius: 16px 0 0 16px; } @@ -332,7 +337,7 @@ body.body--dark { } .ln-download__toggle { - flex: 0 0 48px; + flex: 0 0 40px; border-left: 1px solid rgba(11, 12, 17, 0.25); border-radius: 0 16px 16px 0; } @@ -391,112 +396,164 @@ body.body--dark { display: none; } -.ln-landing-product, -.ln-landing-product:hover, -.ln-landing-product:focus { - min-height: 100%; - color: var(--ln-pink); +.ln-landing-products { + display: grid; + grid-auto-rows: 1fr; + gap: 16px; + width: 100%; +} + +.ln-landing-product { + position: relative; + display: grid; + grid-template-columns: minmax(0, 1fr) clamp(160px, 16vw, 220px) 32px; + grid-template-areas: "title image action" "bullets image action"; + grid-template-rows: 1fr 1fr; + gap: 12px 18px; + min-height: 168px; + padding: 18px 24px; + color: var(--ln-text); text-decoration: none; - border: 1.5px solid rgba(255, 30, 230, 0.3); - border-radius: 28px; - padding: 26px 24px 30px; - background: linear-gradient(180deg, rgba(28, 27, 42, 0.94), rgba(16, 17, 27, 0.88)); - box-shadow: 0 24px 50px rgba(0, 0, 0, 0.28); - transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease; + border: 1px solid rgba(255, 255, 255, 0.13); + border-radius: 22px; + background: + radial-gradient(ellipse at 85% 50%, rgba(174, 39, 255, 0.14), transparent 55%), + linear-gradient(120deg, #1c1b2a, #12121e); + box-shadow: 0 12px 30px rgba(0, 0, 0, 0.2); + transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease; } .ln-landing-product:hover, -.ln-landing-product:focus { - transform: translateY(-6px); - border-color: rgba(255, 30, 230, 0.48); - box-shadow: - 0 28px 60px rgba(0, 0, 0, 0.34), - 0 0 28px rgba(255, 30, 230, 0.12); +.ln-landing-product:focus-visible { + color: var(--ln-text); + transform: translateY(-3px); + border-color: rgba(255, 30, 230, 0.5); + box-shadow: 0 16px 32px rgba(0, 0, 0, 0.3); +} + +.ln-landing-product:focus-visible { + outline: 2px solid var(--ln-pink); + outline-offset: 4px; +} + +.ln-landing-product__visual { + grid-area: image; + position: relative; + min-width: 0; + min-height: 130px; } .ln-landing-product__image { + position: absolute; + inset: 0; display: block; - width: auto; + width: 100%; max-width: 100%; - height: auto; - max-height: 250px; - margin: 0 auto 18px; + height: 100%; object-fit: contain; - filter: drop-shadow(0 24px 42px rgba(0, 0, 0, 0.45)); - transition: filter 0.25s ease, transform 0.25s ease; + filter: drop-shadow(0 12px 16px rgba(0, 0, 0, 0.4)); + transition: transform 0.2s ease; } .ln-landing-product:hover .ln-landing-product__image, -.ln-landing-product:focus .ln-landing-product__image { - transform: translateY(-4px); - filter: - drop-shadow(0 24px 42px rgba(0, 0, 0, 0.45)) - drop-shadow(0 0 24px rgba(255, 30, 230, 0.22)); -} - -.ln-landing-product__body { - margin-top: auto; +.ln-landing-product:focus-visible .ln-landing-product__image { + transform: scale(1.05); } .ln-landing-product__title { + grid-area: title; + align-self: end; margin: 0; - color: var(--ln-pink); - font-size: clamp(1.9rem, 3vw, 2.45rem); - line-height: 1.05; + color: var(--ln-text); + font-size: clamp(1.5rem, 2.2vw, 1.9rem); + font-weight: 650; + line-height: 1.15; letter-spacing: -0.03em; + text-align: start; } .ln-landing-product__bullets { + grid-area: bullets; + align-self: start; + display: flex; + flex-wrap: wrap; + gap: 8px 12px; list-style: none; - margin: 18px 0 0; - padding-left: 0; - text-align: left; - color: rgba(255, 255, 255, 0.92); - font-size: 1rem; - line-height: 1.55; + margin: 0; + padding: 0; + text-align: start; + color: var(--ln-muted); + font-size: 0.95rem; + line-height: 1.5; } .ln-landing-product__bullets li { - position: relative; - padding-left: 1.6rem; + display: flex; + align-items: baseline; + gap: 6px; } .ln-landing-product__bullets li::before { content: "✓"; - position: absolute; - left: 0; - top: 0; + flex-shrink: 0; color: var(--ln-pink); font-weight: 700; } -.ln-landing-product__bullets li + li { - margin-top: 8px; +.ln-landing-product__action { + grid-area: action; + align-self: center; + display: grid; + place-items: center; + width: 32px; + height: 32px; + border: 1px solid rgba(255, 30, 230, 0.25); + border-radius: 50%; + color: var(--ln-pink); + background: rgba(255, 30, 230, 0.06); + transition: background 0.2s ease, color 0.2s ease; +} + +.ln-landing-product:hover .ln-landing-product__action, +.ln-landing-product:focus-visible .ln-landing-product__action { + color: #0b0c11; + background: var(--ln-pink); } -@media (max-width: 991px) { +@media (max-width: 575px) { .ln-landing-product { - padding: 20px 18px 22px; - border-radius: 22px; + grid-template-columns: minmax(0, 1fr) 86px 28px; + grid-template-areas: "title image action" "bullets bullets bullets"; + grid-template-rows: auto auto; + gap: 14px 8px; + min-height: 0; + padding: 16px; + border-radius: 18px; } - .ln-landing-product__image { - max-height: 150px; - margin-bottom: 14px; + .ln-landing-product__title { + align-self: center; } - .ln-landing-product__title { - font-size: 1.6rem; + .ln-landing-product__visual { + min-height: 76px; + } + + .ln-landing-product__action { + width: 28px; + height: 28px; } .ln-landing-product__bullets { - margin-top: 14px; - font-size: 0.9rem; - line-height: 1.45; + gap: 6px 12px; } +} - .ln-landing-product__bullets li { - padding-left: 1.35rem; +@media (prefers-reduced-motion: reduce) { + .ln-landing-product, + .ln-landing-product__image, + .ln-landing-product__action { + transition: none; } } @@ -1315,18 +1372,6 @@ body.body--dark { white-space: normal; } - .ln-landing-product__image { - max-height: 190px; - } - - .ln-landing-product__title { - font-size: 1.8rem; - } - - .ln-landing-product__bullets { - font-size: 0.95rem; - } - .ln-bootstrap-showcase { margin-top: 16px; max-width: 100%; diff --git a/assets/i18n/ar.json b/assets/i18n/ar.json index d080755..1dad6be 100644 --- a/assets/i18n/ar.json +++ b/assets/i18n/ar.json @@ -40,10 +40,12 @@ "products.saas.bullet1": "سهل", "products.saas.bullet2": "مُدار بالكامل", "products.saas.bullet3": "جهوزية 99.9%", + "products.saas.bullet4": "نسخ احتياطية", "products.box.title": "LNbits Box", "products.box.bullet1": "سهل", "products.box.bullet2": "يعمل محليًا", "products.box.bullet3": "عتاد جاهز للتشغيل", + "products.box.bullet4": "مبني على NixOS", "download.title": "ابدأ بقبول المدفوعات خلال دقائق.", "download.button": "تنزيل {format}", "download.choose": "اختر التنزيل", diff --git a/assets/i18n/de.json b/assets/i18n/de.json index f9eecad..a24a62c 100644 --- a/assets/i18n/de.json +++ b/assets/i18n/de.json @@ -40,10 +40,12 @@ "products.saas.bullet1": "Einfach", "products.saas.bullet2": "Voll verwaltet", "products.saas.bullet3": "99,9 % Verfügbarkeit", + "products.saas.bullet4": "Backups", "products.box.title": "LNbits Box", "products.box.bullet1": "Einfach", "products.box.bullet2": "Läuft lokal", "products.box.bullet3": "Plug-and-Play-Hardware", + "products.box.bullet4": "Basiert auf NixOS", "download.title": "Akzeptiere Zahlungen in wenigen Minuten.", "download.button": "{format} herunterladen", "download.choose": "Download auswählen", diff --git a/assets/i18n/en.json b/assets/i18n/en.json index 57b941d..db217dd 100644 --- a/assets/i18n/en.json +++ b/assets/i18n/en.json @@ -40,10 +40,12 @@ "products.saas.bullet1": "Easy", "products.saas.bullet2": "Fully managed", "products.saas.bullet3": "99.9% uptime", + "products.saas.bullet4": "Backups", "products.box.title": "LNbits Box", "products.box.bullet1": "Easy", "products.box.bullet2": "Runs locally", "products.box.bullet3": "Plug & play hardware", + "products.box.bullet4": "NixOS based", "download.title": "Start accepting payments in minutes.", "download.button": "Download {format}", "download.choose": "Choose download", diff --git a/assets/i18n/es.json b/assets/i18n/es.json index b97d1a0..285fa0c 100644 --- a/assets/i18n/es.json +++ b/assets/i18n/es.json @@ -40,10 +40,12 @@ "products.saas.bullet1": "Fácil", "products.saas.bullet2": "Totalmente gestionado", "products.saas.bullet3": "99,9 % de uptime", + "products.saas.bullet4": "Copias de seguridad", "products.box.title": "LNbits Box", "products.box.bullet1": "Fácil", "products.box.bullet2": "Funciona localmente", "products.box.bullet3": "Hardware plug & play", + "products.box.bullet4": "Basado en NixOS", "download.title": "Empieza a aceptar pagos en minutos.", "download.button": "Descargar {format}", "download.choose": "Elegir descarga", diff --git a/assets/i18n/fr.json b/assets/i18n/fr.json index 288d5b3..15840f7 100644 --- a/assets/i18n/fr.json +++ b/assets/i18n/fr.json @@ -40,10 +40,12 @@ "products.saas.bullet1": "Facile", "products.saas.bullet2": "Entièrement géré", "products.saas.bullet3": "99,9 % de disponibilité", + "products.saas.bullet4": "Sauvegardes", "products.box.title": "LNbits Box", "products.box.bullet1": "Facile", "products.box.bullet2": "Fonctionne en local", "products.box.bullet3": "Matériel plug & play", + "products.box.bullet4": "Basé sur NixOS", "download.title": "Commencez à accepter des paiements en quelques minutes.", "download.button": "Télécharger {format}", "download.choose": "Choisir un téléchargement", diff --git a/assets/i18n/it.json b/assets/i18n/it.json index e33419c..089a801 100644 --- a/assets/i18n/it.json +++ b/assets/i18n/it.json @@ -40,10 +40,12 @@ "products.saas.bullet1": "Facile", "products.saas.bullet2": "Completamente gestito", "products.saas.bullet3": "Uptime al 99,9%", + "products.saas.bullet4": "Backup", "products.box.title": "LNbits Box", "products.box.bullet1": "Facile", "products.box.bullet2": "Funziona in locale", "products.box.bullet3": "Hardware plug & play", + "products.box.bullet4": "Basato su NixOS", "download.title": "Inizia ad accettare pagamenti in pochi minuti.", "download.button": "Scarica {format}", "download.choose": "Scegli il download", diff --git a/assets/i18n/ja.json b/assets/i18n/ja.json index ca13348..923f4a0 100644 --- a/assets/i18n/ja.json +++ b/assets/i18n/ja.json @@ -40,10 +40,12 @@ "products.saas.bullet1": "簡単", "products.saas.bullet2": "フルマネージド", "products.saas.bullet3": "99.9% 稼働率", + "products.saas.bullet4": "バックアップ", "products.box.title": "LNbits Box", "products.box.bullet1": "簡単", "products.box.bullet2": "ローカルで動作", "products.box.bullet3": "プラグアンドプレイのハードウェア", + "products.box.bullet4": "NixOS ベース", "download.title": "わずか数分で支払いの受け付けを開始。", "download.button": "{format} をダウンロード", "download.choose": "ダウンロードを選択", diff --git a/assets/i18n/ko.json b/assets/i18n/ko.json index 2766636..0880833 100644 --- a/assets/i18n/ko.json +++ b/assets/i18n/ko.json @@ -40,10 +40,12 @@ "products.saas.bullet1": "쉬움", "products.saas.bullet2": "완전 관리형", "products.saas.bullet3": "99.9% 가동 시간", + "products.saas.bullet4": "백업", "products.box.title": "LNbits Box", "products.box.bullet1": "쉬움", "products.box.bullet2": "로컬에서 실행", "products.box.bullet3": "플러그 앤 플레이 하드웨어", + "products.box.bullet4": "NixOS 기반", "download.title": "몇 분 만에 결제 수락을 시작하세요.", "download.button": "{format} 다운로드", "download.choose": "다운로드 선택", diff --git a/assets/i18n/nl.json b/assets/i18n/nl.json index dc59d73..d469992 100644 --- a/assets/i18n/nl.json +++ b/assets/i18n/nl.json @@ -40,10 +40,12 @@ "products.saas.bullet1": "Eenvoudig", "products.saas.bullet2": "Volledig beheerd", "products.saas.bullet3": "99,9% uptime", + "products.saas.bullet4": "Back-ups", "products.box.title": "LNbits Box", "products.box.bullet1": "Eenvoudig", "products.box.bullet2": "Draait lokaal", "products.box.bullet3": "Plug & play-hardware", + "products.box.bullet4": "Gebaseerd op NixOS", "download.title": "Accepteer binnen enkele minuten betalingen.", "download.button": "{format} downloaden", "download.choose": "Download kiezen", diff --git a/assets/i18n/pt.json b/assets/i18n/pt.json index 19a9389..d62182d 100644 --- a/assets/i18n/pt.json +++ b/assets/i18n/pt.json @@ -40,10 +40,12 @@ "products.saas.bullet1": "Fácil", "products.saas.bullet2": "Totalmente gerido", "products.saas.bullet3": "99,9% de uptime", + "products.saas.bullet4": "Backups", "products.box.title": "LNbits Box", "products.box.bullet1": "Fácil", "products.box.bullet2": "Roda localmente", "products.box.bullet3": "Hardware plug & play", + "products.box.bullet4": "Baseado em NixOS", "download.title": "Comece a aceitar pagamentos em minutos.", "download.button": "Baixar {format}", "download.choose": "Escolher download", diff --git a/assets/i18n/ru.json b/assets/i18n/ru.json index 42d420a..a12e3d0 100644 --- a/assets/i18n/ru.json +++ b/assets/i18n/ru.json @@ -40,10 +40,12 @@ "products.saas.bullet1": "Просто", "products.saas.bullet2": "Полностью управляется", "products.saas.bullet3": "99,9% доступности", + "products.saas.bullet4": "Резервные копии", "products.box.title": "LNbits Box", "products.box.bullet1": "Просто", "products.box.bullet2": "Работает локально", "products.box.bullet3": "Оборудование plug & play", + "products.box.bullet4": "На базе NixOS", "download.title": "Начните принимать платежи за считанные минуты.", "download.button": "Скачать {format}", "download.choose": "Выбрать загрузку", diff --git a/assets/i18n/zh.json b/assets/i18n/zh.json index 9a605ac..b5c4421 100644 --- a/assets/i18n/zh.json +++ b/assets/i18n/zh.json @@ -40,10 +40,12 @@ "products.saas.bullet1": "简单", "products.saas.bullet2": "全托管", "products.saas.bullet3": "99.9% 在线率", + "products.saas.bullet4": "备份", "products.box.title": "LNbits Box", "products.box.bullet1": "简单", "products.box.bullet2": "本地运行", "products.box.bullet3": "即插即用硬件", + "products.box.bullet4": "基于 NixOS", "download.title": "几分钟内即可开始收款。", "download.button": "下载 {format}", "download.choose": "选择下载", diff --git a/index.html b/index.html index 9a0a1d5..ee11ae6 100644 --- a/index.html +++ b/index.html @@ -248,57 +248,65 @@

Start accepting paymen

-
- - SaaS product image +
+ -
LNbits Hosted
  • Easy
  • Fully managed
  • 99.9% uptime
    • +
  • Backups
-
- -
-
- - LNbitsBox product image + SaaS product image +
+ + + -
LNbits Box
  • Easy
  • Runs locally
  • Plug & play hardware
    • +
  • NixOS based
-
- +
+ LNbitsBox product image +
+ + +
From f8b60546071f06f900739c05e8ef6dadcf19274f Mon Sep 17 00:00:00 2001 From: Arc Date: Mon, 14 Sep 2026 17:22:33 +0100 Subject: [PATCH 3/6] looking good --- assets/css/lnbits.css | 9 ++------- assets/js/download.js | 47 ++++++++++++++++++++++++++++++++----------- index.html | 32 +++++++++++++++++++++-------- 3 files changed, 61 insertions(+), 27 deletions(-) diff --git a/assets/css/lnbits.css b/assets/css/lnbits.css index 1dbb468..e6d317b 100644 --- a/assets/css/lnbits.css +++ b/assets/css/lnbits.css @@ -400,17 +400,14 @@ body.body--dark { display: grid; grid-auto-rows: 1fr; gap: 16px; - width: 100%; } .ln-landing-product { - position: relative; display: grid; grid-template-columns: minmax(0, 1fr) clamp(160px, 16vw, 220px) 32px; grid-template-areas: "title image action" "bullets image action"; grid-template-rows: 1fr 1fr; gap: 12px 18px; - min-height: 168px; padding: 18px 24px; color: var(--ln-text); text-decoration: none; @@ -448,7 +445,6 @@ body.body--dark { inset: 0; display: block; width: 100%; - max-width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 12px 16px rgba(0, 0, 0, 0.4)); @@ -464,7 +460,7 @@ body.body--dark { grid-area: title; align-self: end; margin: 0; - color: var(--ln-text); + color: var(--ln-pink); font-size: clamp(1.5rem, 2.2vw, 1.9rem); font-weight: 650; line-height: 1.15; @@ -483,7 +479,7 @@ body.body--dark { padding: 0; text-align: start; color: var(--ln-muted); - font-size: 0.95rem; + font-size: 1.1rem; line-height: 1.5; } @@ -526,7 +522,6 @@ body.body--dark { grid-template-areas: "title image action" "bullets bullets bullets"; grid-template-rows: auto auto; gap: 14px 8px; - min-height: 0; padding: 16px; border-radius: 18px; } diff --git a/assets/js/download.js b/assets/js/download.js index 32f349b..aa939f5 100644 --- a/assets/js/download.js +++ b/assets/js/download.js @@ -9,12 +9,20 @@ window.addEventListener("DOMContentLoaded", () => { const formats = { linux: "AppImage", windows: "EXE", mac: "DMG" }; const assets = {}; const platform = navigator.userAgentData?.platform || navigator.platform || ""; - const mobile = /Android|iPhone|iPad|iPod/i.test(navigator.userAgent) || + const mobile = + /Android|iPhone|iPad|iPod/i.test(navigator.userAgent) || (/Mac/i.test(platform) && navigator.maxTouchPoints > 1); - let selected = mobile ? null : /Win/i.test(platform) ? "windows" : - /Mac/i.test(platform) ? "mac" : /Linux/i.test(platform) ? "linux" : null; + let selected = null; + if (!mobile) { + if (/Win/i.test(platform)) selected = "windows"; + else if (/Mac/i.test(platform)) selected = "mac"; + else if (/Linux/i.test(platform)) selected = "linux"; + } let state = "loading"; + // The label depends on the selection as well as the current language. + label.removeAttribute("data-i18n"); + function t(key, fallback) { return window.LNbitsI18n?.t(key) || fallback; } @@ -22,15 +30,30 @@ window.addEventListener("DOMContentLoaded", () => { function render() { const asset = assets[selected]; link.href = asset?.browser_download_url || releasesUrl; - label.removeAttribute("data-i18n"); - label.textContent = !selected ? t("download.choose", "Choose download") : - state === "ready" && !asset ? t("download.releases", "View releases") : - t("download.button", "Download {format}").replace("{format}", formats[selected]); - status.textContent = state === "error" ? - t("download.fallback", "Find available installers on GitHub releases.") : - selected && state === "ready" && !asset ? - t("download.unavailable", "This installer is not available yet. Check releases or build from source.") : - asset?.prerelease ? t("download.preview", "Pre-release") : ""; + const unavailable = selected && state === "ready" && !asset; + + if (!selected) { + label.textContent = t("download.choose", "Choose download"); + } else if (unavailable) { + label.textContent = t("download.releases", "View releases"); + } else { + label.textContent = t("download.button", "Download {format}").replace( + "{format}", formats[selected] + ); + } + + status.textContent = ""; + if (state === "error") { + status.textContent = t("download.fallback", "Find available installers on GitHub releases."); + } else if (unavailable) { + status.textContent = t( + "download.unavailable", + "This installer is not available yet. Check releases or build from source." + ); + } else if (asset?.prerelease) { + status.textContent = t("download.preview", "Pre-release"); + } + options.forEach((option) => { const key = option.dataset.download; option.href = assets[key]?.browser_download_url || releasesUrl; diff --git a/index.html b/index.html index ee11ae6..50961c8 100644 --- a/index.html +++ b/index.html @@ -233,10 +233,22 @@

Start accepting payments in minutes.

- + Choose download - +
From ef508854a8c242af4cb5b95ef02d5f9d7bafea3f Mon Sep 17 00:00:00 2001 From: Arc Date: Mon, 14 Sep 2026 17:25:27 +0100 Subject: [PATCH 4/6] minimal --- assets/css/lnbits.css | 36 ++++-------------------------------- 1 file changed, 4 insertions(+), 32 deletions(-) diff --git a/assets/css/lnbits.css b/assets/css/lnbits.css index e6d317b..c716aab 100644 --- a/assets/css/lnbits.css +++ b/assets/css/lnbits.css @@ -233,25 +233,14 @@ body.body--dark { .ud-hero { position: relative; overflow: hidden; + background: #000; + animation: none; padding: 118px 0 8px; flex: 1 0 auto; display: flex; align-items: center; } -.ud-hero::before { - content: ""; - position: absolute; - inset: 0; - background: - radial-gradient(700px 280px at 20% 0%, rgba(255, 30, 230, 0.25), transparent 60%), - radial-gradient(700px 300px at 80% 10%, rgba(39, 215, 255, 0.24), transparent 62%), - radial-gradient(520px 240px at 55% 20%, rgba(76, 126, 255, 0.22), transparent 60%); - pointer-events: none; - background-size: 200% 200%; - animation: heroFlow 14s ease-in-out infinite alternate; -} - .ud-hero > .container { position: relative; z-index: 1; @@ -411,11 +400,9 @@ body.body--dark { padding: 18px 24px; color: var(--ln-text); text-decoration: none; - border: 1px solid rgba(255, 255, 255, 0.13); + border: 1px solid var(--ln-pink); border-radius: 22px; - background: - radial-gradient(ellipse at 85% 50%, rgba(174, 39, 255, 0.14), transparent 55%), - linear-gradient(120deg, #1c1b2a, #12121e); + background: #000; box-shadow: 0 12px 30px rgba(0, 0, 0, 0.2); transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease; } @@ -424,7 +411,6 @@ body.body--dark { .ln-landing-product:focus-visible { color: var(--ln-text); transform: translateY(-3px); - border-color: rgba(255, 30, 230, 0.5); box-shadow: 0 16px 32px rgba(0, 0, 0, 0.3); } @@ -1433,15 +1419,6 @@ body.body--dark { } } -@keyframes heroFlow { - 0% { - background-position: 20% 0%, 80% 20%, 50% 10%; - } - 100% { - background-position: 40% 20%, 60% 0%, 70% 30%; - } -} - @-moz-document url-prefix() { .ud-header, .ln-btn-outline, @@ -1449,11 +1426,6 @@ body.body--dark { backdrop-filter: none; } - .ud-hero, - .ud-hero::before { - animation: none; - } - .ln-section::before { mix-blend-mode: normal; opacity: 0.35; From df420afed0ad4ac995acca936d394593d0d917d2 Mon Sep 17 00:00:00 2001 From: Arc Date: Mon, 14 Sep 2026 17:50:59 +0100 Subject: [PATCH 5/6] f8b6054 looking good --- assets/css/lnbits.css | 10 +++++++--- assets/i18n/ar.json | 5 +++-- assets/i18n/de.json | 5 +++-- assets/i18n/en.json | 5 +++-- assets/i18n/es.json | 5 +++-- assets/i18n/fr.json | 5 +++-- assets/i18n/it.json | 5 +++-- assets/i18n/ja.json | 5 +++-- assets/i18n/ko.json | 5 +++-- assets/i18n/nl.json | 5 +++-- assets/i18n/pt.json | 5 +++-- assets/i18n/ru.json | 5 +++-- assets/i18n/zh.json | 5 +++-- assets/js/landing.js | 4 ++-- index.html | 10 +++++++--- 15 files changed, 52 insertions(+), 32 deletions(-) diff --git a/assets/css/lnbits.css b/assets/css/lnbits.css index c716aab..13ac24c 100644 --- a/assets/css/lnbits.css +++ b/assets/css/lnbits.css @@ -260,7 +260,7 @@ body.body--dark { } .ln-hero-intro .ud-hero-title { - font-size: var(--ln-hero-title-size, 3.6rem); + font-size: var(--ln-hero-title-size, 4rem); line-height: 1.05; white-space: nowrap; } @@ -268,7 +268,7 @@ body.body--dark { .ln-hero-intro .ud-hero-desc { display: block; margin: 0 auto; - font-size: var(--ln-hero-desc-size, 3rem); + font-size: var(--ln-hero-desc-size, 2.8rem); line-height: 1.08; white-space: nowrap; } @@ -1231,6 +1231,10 @@ body.body--dark { text-transform: uppercase; color: rgba(255, 255, 255, 0.6); margin-bottom: 12px; +} + +.ln-contrib-label, +.ln-contrib-metrics { display: flex; align-items: center; gap: 10px; @@ -1348,7 +1352,7 @@ body.body--dark { } .ln-hero-intro .ud-hero-desc { - font-size: clamp(1.4rem, 5.4vw, 2rem); + font-size: clamp(1.125rem, 4vw, 1.5rem); line-height: 1.15; white-space: normal; } diff --git a/assets/i18n/ar.json b/assets/i18n/ar.json index 1dad6be..cc243c7 100644 --- a/assets/i18n/ar.json +++ b/assets/i18n/ar.json @@ -22,8 +22,8 @@ "tooltip.extensions": "اطّلع على إضافات LNbits", "tooltip.store": "زر متجر LNbits الإلكتروني", "tooltip.github": "عرض المستودع", - "hero.title": "أقوى مجموعة أدوات بيتكوين في العالم.", - "hero.subtitle": "شغّلها لنفسك أو للآخرين أو كجزء من حزمة.", + "hero.title": "أقوى حزمة أدوات للدفع في العالم.", + "hero.subtitle": "اقبل المدفوعات. استخدم/طوّر الإضافات. ادمجها في منظومتك التقنية.", "hero.slide1.title": "نظام المستخدم/المحفظة", "hero.slide1.subtitle": "محفظة ويب متجاوبة بالكامل
", "hero.slide1.time": "(43 ثانية)", @@ -55,6 +55,7 @@ "download.fallback": "ابحث عن ملفات التثبيت المتاحة في إصدارات GitHub.", "download.unavailable": "ملف التثبيت هذا غير متاح بعد. تصفح الإصدارات أو ابنِ التطبيق من الشيفرة المصدرية.", "download.preview": "إصدار تجريبي", + "contributors.open_source": "مجاني بالكامل ومفتوح المصدر", "contributors.label": "المساهمون", "features.title": "تطبيقك الشامل للمدفوعات.", "features.lead": "
LNbits منصة مدفوعات معيارية — محفظة ومتجر تطبيقات ومحرك أتمتة في منصة واحدة.", diff --git a/assets/i18n/de.json b/assets/i18n/de.json index a24a62c..f4e4ae0 100644 --- a/assets/i18n/de.json +++ b/assets/i18n/de.json @@ -22,8 +22,8 @@ "tooltip.extensions": "Schau dir die Erweiterungen in LNbits an", "tooltip.store": "Besuche den LNbits Webshop", "tooltip.github": "Zum Repository", - "hero.title": "Die weltweit leistungsstärkste Suite an Bitcoin-Tools.", - "hero.subtitle": "Betreibe es für dich, für andere oder als Teil eines Stacks.", + "hero.title": "Die leistungsstärkste Zahlungssuite der Welt.", + "hero.subtitle": "Nimm Zahlungen an. Nutze/entwickle Erweiterungen. Integriere sie in deinen Stack.", "hero.slide1.title": "Benutzer-/Wallet-System", "hero.slide1.subtitle": "Voll responsives Web-Wallet
", "hero.slide1.time": "(43 s)", @@ -55,6 +55,7 @@ "download.fallback": "Verfügbare Installationsdateien findest du in den GitHub-Releases.", "download.unavailable": "Diese Installationsdatei ist noch nicht verfügbar. Sieh dir die Releases an oder erstelle LNbits aus dem Quellcode.", "download.preview": "Vorabversion", + "contributors.open_source": "Völlig kostenlos und quelloffen", "contributors.label": "Mitwirkende", "features.title": "Deine All-in-One-App für Zahlungen.", "features.lead": "
LNbits ist eine modulare Zahlungsplattform - Wallet, App-Store und Automatisierungs-Engine in einem.", diff --git a/assets/i18n/en.json b/assets/i18n/en.json index db217dd..e62c0c5 100644 --- a/assets/i18n/en.json +++ b/assets/i18n/en.json @@ -22,8 +22,8 @@ "tooltip.extensions": "Checkout the extensions in LNbits", "tooltip.store": "Visit the LNbits web store", "tooltip.github": "Checkout the repo", - "hero.title": "The world's most powerful suite of bitcoin tools.", - "hero.subtitle": "Run for yourself, for others, or as part of a stack.", + "hero.title": "The world's most powerful payment suite.", + "hero.subtitle": "Take payments. Use/build extensions. Integrate into your stack.", "hero.slide1.title": "User/Wallet System", "hero.slide1.subtitle": "Fully responsive web wallet
", "hero.slide1.time": "(43 secs)", @@ -55,6 +55,7 @@ "download.fallback": "Find available installers on GitHub releases.", "download.unavailable": "This installer is not available yet. Check releases or build from source.", "download.preview": "Pre-release", + "contributors.open_source": "Completely free and open-source", "contributors.label": "Contributors", "features.title": "Your Everything App for Payments.", "features.lead": "
LNbits is a modular payments platform — a wallet, app store, and automation engine in one.", diff --git a/assets/i18n/es.json b/assets/i18n/es.json index 285fa0c..0a9c5a2 100644 --- a/assets/i18n/es.json +++ b/assets/i18n/es.json @@ -22,8 +22,8 @@ "tooltip.extensions": "Explora las extensiones en LNbits", "tooltip.store": "Visita la tienda web de LNbits", "tooltip.github": "Ver el repositorio", - "hero.title": "La suite de herramientas de bitcoin más poderosa del mundo.", - "hero.subtitle": "Ejecuta para ti, para otros, o como parte de un stack.", + "hero.title": "La suite de pagos más potente del mundo.", + "hero.subtitle": "Acepta pagos. Usa/crea extensiones. Integra en tu stack.", "hero.slide1.title": "Sistema de usuarios/carteras", "hero.slide1.subtitle": "Billetera web totalmente responsive
", "hero.slide1.time": "(43 s)", @@ -55,6 +55,7 @@ "download.fallback": "Encuentra los instaladores disponibles en las versiones de GitHub.", "download.unavailable": "Este instalador aún no está disponible. Consulta las versiones o compila desde el código fuente.", "download.preview": "Versión preliminar", + "contributors.open_source": "Completamente gratis y de código abierto", "contributors.label": "Colaboradores", "features.title": "Tu app integral para pagos.", "features.lead": "
LNbits es una plataforma modular de pagos — una billetera, tienda de apps y motor de automatización en uno.", diff --git a/assets/i18n/fr.json b/assets/i18n/fr.json index 15840f7..081fd31 100644 --- a/assets/i18n/fr.json +++ b/assets/i18n/fr.json @@ -22,8 +22,8 @@ "tooltip.extensions": "Voir les extensions dans LNbits", "tooltip.store": "Visitez la boutique web LNbits", "tooltip.github": "Voir le dépôt", - "hero.title": "La suite d'outils bitcoin la plus puissante au monde.", - "hero.subtitle": "Exécutez-la pour vous, pour d'autres, ou comme partie d'une stack.", + "hero.title": "La suite de paiement la plus puissante au monde.", + "hero.subtitle": "Acceptez des paiements. Utilisez/créez des extensions. Intégrez à votre stack.", "hero.slide1.title": "Système utilisateur/portefeuille", "hero.slide1.subtitle": "Portefeuille web totalement responsive
", "hero.slide1.time": "(43 s)", @@ -55,6 +55,7 @@ "download.fallback": "Retrouvez les programmes d’installation disponibles dans les versions GitHub.", "download.unavailable": "Ce programme d’installation n’est pas encore disponible. Consultez les versions ou compilez depuis les sources.", "download.preview": "Préversion", + "contributors.open_source": "Entièrement gratuit et open source", "contributors.label": "Contributeurs", "features.title": "Votre application tout-en-un pour les paiements.", "features.lead": "
LNbits est une plateforme de paiement modulaire — un portefeuille, une boutique d'apps et un moteur d'automatisation en un.", diff --git a/assets/i18n/it.json b/assets/i18n/it.json index 089a801..89db1b9 100644 --- a/assets/i18n/it.json +++ b/assets/i18n/it.json @@ -22,8 +22,8 @@ "tooltip.extensions": "Scopri le estensioni in LNbits", "tooltip.store": "Visita lo store web di LNbits", "tooltip.github": "Vai al repository", - "hero.title": "La suite di strumenti bitcoin più potente al mondo.", - "hero.subtitle": "Esegui per te, per altri, o come parte di uno stack.", + "hero.title": "La suite di pagamento più potente al mondo.", + "hero.subtitle": "Accetta pagamenti. Usa/crea estensioni. Integra nel tuo stack.", "hero.slide1.title": "Sistema utenti/wallet", "hero.slide1.subtitle": "Wallet web completamente responsive
", "hero.slide1.time": "(43 s)", @@ -55,6 +55,7 @@ "download.fallback": "Trova i programmi di installazione disponibili nelle release di GitHub.", "download.unavailable": "Questo programma di installazione non è ancora disponibile. Consulta le release o compila dal codice sorgente.", "download.preview": "Versione preliminare", + "contributors.open_source": "Completamente gratuito e open source", "contributors.label": "Contributori", "features.title": "La tua app tutto-in-uno per i pagamenti.", "features.lead": "
LNbits è una piattaforma di pagamenti modulare — un wallet, un app store e un motore di automazione in uno.", diff --git a/assets/i18n/ja.json b/assets/i18n/ja.json index 923f4a0..40cf626 100644 --- a/assets/i18n/ja.json +++ b/assets/i18n/ja.json @@ -22,8 +22,8 @@ "tooltip.extensions": "LNbits の拡張をチェック", "tooltip.store": "LNbits のウェブストアを見る", "tooltip.github": "リポジトリを見る", - "hero.title": "世界で最も強力なビットコインツール群。", - "hero.subtitle": "自分のため、他者のため、またはスタックの一部として運用。", + "hero.title": "世界で最もパワフルな決済スイート。", + "hero.subtitle": "決済を受け付ける。拡張機能を使う・開発する。スタックに統合する。", "hero.slide1.title": "ユーザー/ウォレットシステム", "hero.slide1.subtitle": "完全レスポンシブなWebウォレット
", "hero.slide1.time": "(43 秒)", @@ -55,6 +55,7 @@ "download.fallback": "利用可能なインストーラーは GitHub のリリースページで確認できます。", "download.unavailable": "このインストーラーはまだ利用できません。リリースを確認するか、ソースからビルドしてください。", "download.preview": "プレリリース", + "contributors.open_source": "完全無料・オープンソース", "contributors.label": "貢献者", "features.title": "支払いのためのオールインワンアプリ。", "features.lead": "
LNbits はモジュール型の決済プラットフォーム — ウォレット、アプリストア、自動化エンジンが一体。", diff --git a/assets/i18n/ko.json b/assets/i18n/ko.json index 0880833..528e50f 100644 --- a/assets/i18n/ko.json +++ b/assets/i18n/ko.json @@ -22,8 +22,8 @@ "tooltip.extensions": "LNbits 확장 보기", "tooltip.store": "LNbits 웹 스토어 방문", "tooltip.github": "레포지토리 보기", - "hero.title": "세계에서 가장 강력한 비트코인 도구 모음.", - "hero.subtitle": "나를 위해, 다른 사람을 위해, 혹은 스택의 일부로 운영하세요.", + "hero.title": "세계에서 가장 강력한 결제 도구 모음.", + "hero.subtitle": "결제를 받으세요. 확장 기능을 사용/개발하세요. 스택에 통합하세요.", "hero.slide1.title": "사용자/지갑 시스템", "hero.slide1.subtitle": "완전 반응형 웹 지갑
", "hero.slide1.time": "(43초)", @@ -55,6 +55,7 @@ "download.fallback": "GitHub 릴리스에서 사용 가능한 설치 파일을 확인하세요.", "download.unavailable": "이 설치 파일은 아직 제공되지 않습니다. 릴리스를 확인하거나 소스에서 빌드하세요.", "download.preview": "사전 릴리스", + "contributors.open_source": "완전 무료 및 오픈 소스", "contributors.label": "기여자", "features.title": "결제를 위한 올인원 앱.", "features.lead": "
LNbits는 모듈형 결제 플랫폼입니다 — 지갑, 앱스토어, 자동화 엔진을 하나로.", diff --git a/assets/i18n/nl.json b/assets/i18n/nl.json index d469992..1ef9dc9 100644 --- a/assets/i18n/nl.json +++ b/assets/i18n/nl.json @@ -22,8 +22,8 @@ "tooltip.extensions": "Bekijk de extensies in LNbits", "tooltip.store": "Bezoek de LNbits webwinkel", "tooltip.github": "Bekijk de repo", - "hero.title": "De krachtigste suite van bitcoin-tools ter wereld.", - "hero.subtitle": "Draai het voor jezelf, voor anderen, of als onderdeel van een stack.", + "hero.title": "De krachtigste betaalsuite ter wereld.", + "hero.subtitle": "Ontvang betalingen. Gebruik/bouw extensies. Integreer in je stack.", "hero.slide1.title": "Gebruikers-/walletsysteem", "hero.slide1.subtitle": "Volledig responsieve webwallet
", "hero.slide1.time": "(43 s)", @@ -55,6 +55,7 @@ "download.fallback": "Vind beschikbare installatiebestanden bij de GitHub-releases.", "download.unavailable": "Dit installatiebestand is nog niet beschikbaar. Bekijk de releases of bouw vanuit de broncode.", "download.preview": "Voorlopige versie", + "contributors.open_source": "Volledig gratis en open source", "contributors.label": "Bijdragers", "features.title": "Jouw alles-in-één app voor betalingen.", "features.lead": "
LNbits is een modulair betalingsplatform — een wallet, app store en automatiseringsengine in één.", diff --git a/assets/i18n/pt.json b/assets/i18n/pt.json index d62182d..0c86a0e 100644 --- a/assets/i18n/pt.json +++ b/assets/i18n/pt.json @@ -22,8 +22,8 @@ "tooltip.extensions": "Confira as extensões no LNbits", "tooltip.store": "Visite a loja web do LNbits", "tooltip.github": "Ver o repositório", - "hero.title": "O conjunto de ferramentas de bitcoin mais poderoso do mundo.", - "hero.subtitle": "Execute para você, para outros, ou como parte de uma stack.", + "hero.title": "A suíte de pagamentos mais poderosa do mundo.", + "hero.subtitle": "Receba pagamentos. Use/crie extensões. Integre à sua stack.", "hero.slide1.title": "Sistema de usuários/carteiras", "hero.slide1.subtitle": "Carteira web totalmente responsiva
", "hero.slide1.time": "(43 s)", @@ -55,6 +55,7 @@ "download.fallback": "Encontre os instaladores disponíveis nas versões do GitHub.", "download.unavailable": "Este instalador ainda não está disponível. Confira as versões ou compile a partir do código-fonte.", "download.preview": "Versão de pré-lançamento", + "contributors.open_source": "Totalmente gratuito e de código aberto", "contributors.label": "Contribuidores", "features.title": "Seu app completo para pagamentos.", "features.lead": "
LNbits é uma plataforma modular de pagamentos — uma carteira, app store e motor de automação em um só lugar.", diff --git a/assets/i18n/ru.json b/assets/i18n/ru.json index a12e3d0..dedc8e1 100644 --- a/assets/i18n/ru.json +++ b/assets/i18n/ru.json @@ -22,8 +22,8 @@ "tooltip.extensions": "Посмотрите расширения в LNbits", "tooltip.store": "Посетите веб‑магазин LNbits", "tooltip.github": "Открыть репозиторий", - "hero.title": "Самый мощный набор инструментов для биткоина в мире.", - "hero.subtitle": "Запускайте для себя, для других или как часть стека.", + "hero.title": "Самый мощный в мире набор платёжных инструментов.", + "hero.subtitle": "Принимайте платежи. Используйте/создавайте расширения. Интегрируйте в свой стек.", "hero.slide1.title": "Система пользователей/кошельков", "hero.slide1.subtitle": "Полностью адаптивный веб‑кошелек
", "hero.slide1.time": "(43 сек)", @@ -55,6 +55,7 @@ "download.fallback": "Доступные установщики можно найти в релизах на GitHub.", "download.unavailable": "Этот установщик пока недоступен. Посмотрите релизы или соберите из исходного кода.", "download.preview": "Предварительная версия", + "contributors.open_source": "Полностью бесплатно и с открытым исходным кодом", "contributors.label": "Участники", "features.title": "Ваше приложение «всё‑в‑одном» для платежей.", "features.lead": "
LNbits — модульная платформа платежей: кошелек, магазин приложений и движок автоматизации в одном.", diff --git a/assets/i18n/zh.json b/assets/i18n/zh.json index b5c4421..4a69c07 100644 --- a/assets/i18n/zh.json +++ b/assets/i18n/zh.json @@ -22,8 +22,8 @@ "tooltip.extensions": "查看 LNbits 的扩展", "tooltip.store": "访问 LNbits 网店", "tooltip.github": "查看仓库", - "hero.title": "全球最强大的比特币工具套件。", - "hero.subtitle": "为你自己、为他人，或作为技术栈的一部分运行。", + "hero.title": "全球最强大的支付套件。", + "hero.subtitle": "接受付款。使用/构建扩展。集成到你的技术栈。", "hero.slide1.title": "用户/钱包系统", "hero.slide1.subtitle": "完全响应式网页钱包
", "hero.slide1.time": "(43 秒)", @@ -55,6 +55,7 @@ "download.fallback": "在 GitHub 发布页面查找可用的安装程序。", "download.unavailable": "此安装程序暂不可用。请查看发布版本或从源码构建。", "download.preview": "预发布版本", + "contributors.open_source": "完全免费且开源", "contributors.label": "贡献者", "features.title": "你的全能支付应用。", "features.lead": "
LNbits 是一个模块化支付平台——钱包、应用商店和自动化引擎三合一。", diff --git a/assets/js/landing.js b/assets/js/landing.js index a8aa8f2..83d5ca2 100644 --- a/assets/js/landing.js +++ b/assets/js/landing.js @@ -23,8 +23,8 @@ window.addEventListener("DOMContentLoaded", () => { } function fitHeroText() { - fitElement(title, "--ln-hero-title-size", 57.6, 36); - fitElement(desc, "--ln-hero-desc-size", 48, 28); + fitElement(title, "--ln-hero-title-size", 64, 36); + fitElement(desc, "--ln-hero-desc-size", 44.8, 20); } fitHeroText(); diff --git a/index.html b/index.html index 50961c8..67af01a 100644 --- a/index.html +++ b/index.html @@ -217,10 +217,10 @@

- The world's most powerful suite of bitcoin tools. + The world's most powerful payment suite.

- Run for yourself, for others, or as part of a stack. + Take payments. Use/build extensions. Integrate into your stack.

@@ -333,7 +333,11 @@

Start accepting paymen
-
Contributors
+
+ Completely free and open-source + + Contributors +
From ec9a632ec67264fee780112794996209513b2650 Mon Sep 17 00:00:00 2001 From: Arc Date: Mon, 14 Sep 2026 22:08:00 +0100 Subject: [PATCH 6/6] font size --- assets/css/lnbits.css | 2 +- assets/js/landing.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/assets/css/lnbits.css b/assets/css/lnbits.css index 13ac24c..091752c 100644 --- a/assets/css/lnbits.css +++ b/assets/css/lnbits.css @@ -268,7 +268,7 @@ body.body--dark { .ln-hero-intro .ud-hero-desc { display: block; margin: 0 auto; - font-size: var(--ln-hero-desc-size, 2.8rem); + font-size: var(--ln-hero-desc-size, 2.5rem); line-height: 1.08; white-space: nowrap; } diff --git a/assets/js/landing.js b/assets/js/landing.js index 83d5ca2..d1b696d 100644 --- a/assets/js/landing.js +++ b/assets/js/landing.js @@ -24,7 +24,7 @@ window.addEventListener("DOMContentLoaded", () => { function fitHeroText() { fitElement(title, "--ln-hero-title-size", 64, 36); - fitElement(desc, "--ln-hero-desc-size", 44.8, 20); + fitElement(desc, "--ln-hero-desc-size", 40, 20); } fitHeroText();