diff --git a/index.html b/index.html
index 9094536..8b3174e 100644
--- a/index.html
+++ b/index.html
@@ -1530,6 +1530,7 @@
React.createElement('p', { key: 'desc', className: "text-xs text-muted leading-tight" }, "Pay-per-session via WebLN")
])
]),
+
// Wallet Logos Section
React.createElement('div', {
key: 'wallet-logos-section',
@@ -1867,6 +1868,8 @@
]),
React.createElement(UniqueFeatureSlider, { key: 'unique-features-slider' }),
+ React.createElement(DownloadApps, { key: 'download-apps' }),
+
React.createElement(ComparisonTable, { key: 'comparison-table' }),
React.createElement(Roadmap, { key: 'roadmap' }),
@@ -3519,7 +3522,8 @@
loadReactComponent('./src/components/ui/PasswordModal.jsx', 'PasswordModal'),
loadReactComponent('./src/components/ui/SessionTypeSelector.jsx', 'SessionTypeSelector'),
loadReactComponent('./src/components/ui/LightningPayment.jsx', 'LightningPayment'),
- loadReactComponent('./src/components/ui/PaymentModal.jsx', 'PaymentModal')
+ loadReactComponent('./src/components/ui/PaymentModal.jsx', 'PaymentModal'),
+ loadReactComponent('./src/components/ui/DownloadApps.jsx', 'DownloadApps')
]);
if (typeof initializeApp === 'function') {
diff --git a/src/components/ui/DownloadApps.jsx b/src/components/ui/DownloadApps.jsx
new file mode 100644
index 0000000..8937357
--- /dev/null
+++ b/src/components/ui/DownloadApps.jsx
@@ -0,0 +1,90 @@
+const DownloadApps = () => {
+ const apps = [
+ { id: 'web', name: 'Web App', subtitle: 'Browser Version', icon: 'fas fa-globe', platform: 'Web', isActive: true, url: 'https://securebitchat.github.io/securebit-chat/', color: 'green' },
+ { id: 'windows', name: 'Windows', subtitle: 'Desktop App', icon: 'fab fa-windows', platform: 'Desktop', isActive: false, url: '#', color: 'blue' },
+ { id: 'macos', name: 'macOS', subtitle: 'Desktop App', icon: 'fab fa-apple', platform: 'Desktop', isActive: false, url: '#', color: 'gray' },
+ { id: 'linux', name: 'Linux', subtitle: 'Desktop App', icon: 'fab fa-linux', platform: 'Desktop', isActive: false, url: '#', color: 'orange' },
+ { id: 'ios', name: 'iOS', subtitle: 'iPhone & iPad', icon: 'fab fa-apple', platform: 'Mobile', isActive: false, url: 'https://apps.apple.com/app/securebit-chat/', color: 'blue' },
+ { id: 'android', name: 'Android', subtitle: 'Google Play', icon: 'fab fa-android', platform: 'Mobile', isActive: false, url: 'https://play.google.com/store/apps/details?id=com.securebit.chat', color: 'green' }
+ ];
+
+ const handleDownload = (app) => {
+ if (app.isActive) window.open(app.url, '_blank');
+ };
+
+ const desktopApps = apps.filter(a => a.platform !== 'Mobile');
+ const mobileApps = apps.filter(a => a.platform === 'Mobile');
+
+ // Размер карточки
+ const cardSize = "w-28 h-28"; // квадратные
+
+ return React.createElement('div', { className: "mt-20 px-6" }, [
+ // Header
+ React.createElement('div', { key: 'header', className: "text-center max-w-3xl mx-auto mb-12" }, [
+ React.createElement('h3', { key: 'title', className: "text-3xl font-bold text-primary mb-3" }, 'Download SecureBit.chat'),
+ React.createElement('p', { key: 'subtitle', className: "text-secondary text-lg mb-5" }, 'Stay secure on every device. Choose your platform and start chatting privately.')
+ ]),
+
+ // Верхний ряд: Desktop + Web (скрыт на мобильных)
+ React.createElement('div', { key: 'desktop-row', className: "hidden sm:flex justify-center flex-wrap gap-6 mb-6" },
+ desktopApps.map(app =>
+ React.createElement('div', {
+ key: app.id,
+ className: `group relative ${cardSize} rounded-2xl overflow-hidden card-minimal cursor-pointer`
+ }, [
+ React.createElement('i', {
+ key: 'bg-icon',
+ className: `${app.icon} absolute text-[3rem] text-white/10 top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 pointer-events-none transition-all duration-500 group-hover:scale-105`
+ }),
+ React.createElement('div', {
+ key: 'overlay',
+ className: "absolute inset-0 bg-black/30 backdrop-blur-md flex flex-col items-center justify-center text-center opacity-0 transition-opacity duration-300 group-hover:opacity-100"
+ }, [
+ React.createElement('h4', { key: 'name', className: `text-sm font-semibold text-primary mb-1` }, app.name),
+ React.createElement('p', { key: 'subtitle', className: `text-xs text-secondary mb-2` }, app.subtitle),
+ app.isActive ?
+ React.createElement('button', {
+ key: 'btn',
+ onClick: () => handleDownload(app),
+ className: `px-2 py-1 rounded-xl bg-emerald-500 text-black font-medium hover:bg-emerald-600 transition-colors text-xs`
+ }, app.id === "web" ? "Launch" : "Download")
+ :
+ React.createElement('span', { key: 'coming', className: "text-gray-400 font-medium text-xs" }, "Coming Soon")
+ ])
+ ])
+ )
+ ),
+
+ // Нижний ряд: Mobile (всегда центрированы)
+ React.createElement('div', { key: 'mobile-row', className: "flex justify-center gap-6" },
+ mobileApps.map(app =>
+ React.createElement('div', {
+ key: app.id,
+ className: `group relative ${cardSize} rounded-2xl overflow-hidden card-minimal cursor-pointer`
+ }, [
+ React.createElement('i', {
+ key: 'bg-icon',
+ className: `${app.icon} absolute text-[3rem] text-white/10 top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 pointer-events-none transition-all duration-500 group-hover:scale-105`
+ }),
+ React.createElement('div', {
+ key: 'overlay',
+ className: "absolute inset-0 bg-black/30 backdrop-blur-md flex flex-col items-center justify-center text-center opacity-0 transition-opacity duration-300 group-hover:opacity-100"
+ }, [
+ React.createElement('h4', { key: 'name', className: `text-sm font-semibold text-primary mb-1` }, app.name),
+ React.createElement('p', { key: 'subtitle', className: `text-xs text-secondary mb-2` }, app.subtitle),
+ app.isActive ?
+ React.createElement('button', {
+ key: 'btn',
+ onClick: () => handleDownload(app),
+ className: `px-2 py-1 rounded-xl bg-emerald-500 text-black font-medium hover:bg-emerald-600 transition-colors text-xs`
+ }, "Download")
+ :
+ React.createElement('span', { key: 'coming', className: "text-gray-400 font-medium text-xs" }, "Coming Soon")
+ ])
+ ])
+ )
+ )
+ ]);
+};
+
+window.DownloadApps = DownloadApps;