From 2fefbf47e403137a02edd5fd2fdcf656df881a25 Mon Sep 17 00:00:00 2001 From: naturallaw77 Date: Thu, 2 Apr 2026 16:17:39 -0500 Subject: [PATCH] added qr code --- app/sovran_systemsos_web/static/style.css | 166 +++++++++++++++++++++- modules/core/sovran-hub.nix | 6 +- 2 files changed, 168 insertions(+), 4 deletions(-) diff --git a/app/sovran_systemsos_web/static/style.css b/app/sovran_systemsos_web/static/style.css index dc655a2..e9cf6d9 100644 --- a/app/sovran_systemsos_web/static/style.css +++ b/app/sovran_systemsos_web/static/style.css @@ -680,4 +680,168 @@ button.btn-reboot:hover:not(:disabled) { margin-bottom: 10px; } -. \ No newline at end of file +/* ── QR code in credentials modal ────────────────────────────────── */ + +.creds-qr-wrap { + display: flex; + flex-direction: column; + align-items: center; + padding: 20px 0; + margin-bottom: 10px; +} + +.creds-qr-img { + width: 240px; + height: 240px; + border-radius: 12px; + border: 4px solid #fff; + background-color: #fff; + image-rendering: pixelated; + box-shadow: 0 4px 16px rgba(0,0,0,0.4); +} + +.creds-qr-hint { + margin-top: 10px; + font-size: 0.82rem; + color: var(--text-secondary); + font-style: italic; +} + +/* ── Reboot overlay ─────────────────────────────────────────────── */ + +.reboot-overlay { + display: none; + position: fixed; + inset: 0; + background-color: rgba(15, 15, 25, 0.92); + z-index: 999; + align-items: center; + justify-content: center; +} + +.reboot-overlay.visible { + display: flex; +} + +.reboot-card { + background-color: var(--surface-color); + border: 1px solid var(--border-color); + border-radius: 20px; + padding: 48px 56px; + text-align: center; + max-width: 480px; + box-shadow: 0 24px 64px rgba(0, 0, 0, 0.8); + animation: reboot-fade-in 0.4s ease-out; +} + +@keyframes reboot-fade-in { + from { opacity: 0; transform: scale(0.92) translateY(12px); } + to { opacity: 1; transform: scale(1) translateY(0); } +} + +.reboot-icon { + font-size: 3rem; + color: var(--accent-color); + margin-bottom: 16px; + animation: reboot-spin 2s linear infinite; + display: inline-block; +} + +@keyframes reboot-spin { + to { transform: rotate(360deg); } +} + +.reboot-title { + font-size: 1.35rem; + font-weight: 700; + color: var(--text-primary); + margin-bottom: 12px; +} + +.reboot-message { + font-size: 0.92rem; + color: var(--text-secondary); + line-height: 1.6; + margin-bottom: 24px; +} + +.reboot-dots { + display: flex; + align-items: center; + justify-content: center; + gap: 8px; + margin-bottom: 16px; +} + +.reboot-dot { + width: 10px; + height: 10px; + border-radius: 50%; + background-color: var(--accent-color); + animation: reboot-bounce 1.4s ease-in-out infinite; +} + +.reboot-dot:nth-child(2) { animation-delay: 0.2s; } +.reboot-dot:nth-child(3) { animation-delay: 0.4s; } + +@keyframes reboot-bounce { + 0%, 80%, 100% { opacity: 0.3; transform: scale(0.8); } + 40% { opacity: 1; transform: scale(1.2); } +} + +.reboot-submessage { + font-size: 0.82rem; + color: var(--text-dim); + font-style: italic; +} + +/* ── Empty state ────────────────────────────────────────────────── */ + +.empty-state { + text-align: center; + padding: 64px 24px; + color: var(--text-dim); +} + +.empty-state p { + font-size: 1rem; + margin-bottom: 8px; +} + +/* ── Responsive ─────────────────────────────────────────────────── */ + +@media (max-width: 600px) { + .header-bar { + padding: 10px 14px; + gap: 10px; + } + .header-bar .title { + font-size: 0.95rem; + } + .ip-bar { + gap: 16px; + flex-wrap: wrap; + padding: 8px 14px; + } + .main-content { + padding: 16px 12px 40px; + } + .tiles-grid { + justify-content: center; + } + .service-tile { + width: 160px; + min-height: 200px; + } + .reboot-card { + padding: 36px 28px; + margin: 0 16px; + } + .creds-dialog { + margin: 0 12px; + } + .creds-qr-img { + width: 200px; + height: 200px; + } +} diff --git a/modules/core/sovran-hub.nix b/modules/core/sovran-hub.nix index e7ccb59..9f49bde 100644 --- a/modules/core/sovran-hub.nix +++ b/modules/core/sovran-hub.nix @@ -44,8 +44,8 @@ let { label = "Note"; value = "Create your admin account on first visit"; } ]; } { name = "Zeus Connect"; unit = "zeus-connect-setup.service"; type = "system"; icon = "zeus"; enabled = cfg.services.bitcoin; category = "bitcoin-apps"; credentials = [ - { label = "Connection URL"; file = "/var/lib/secrets/zeus-connect-url"; } - { label = "How to Connect"; value = "1. Download Zeus from App Store or Google Play\n2. Open Zeus → Scan Node Config\n3. Copy and paste the Connection URL above"; } + { label = "Connection URL"; file = "/var/lib/secrets/zeus-connect-url"; qrcode = true; } + { label = "How to Connect"; value = "1. Download Zeus from App Store or Google Play\n2. Open Zeus → Scan Node Config\n3. Scan the QR code above or paste the Connection URL"; } ]; } { name = "Mempool"; unit = "mempool.service"; type = "system"; icon = "mempool"; enabled = cfg.features.mempool; category = "bitcoin-apps"; credentials = [ { label = "Tor Access"; file = "/var/lib/tor/onion/mempool-frontend/hostname"; prefix = "http://"; } @@ -241,4 +241,4 @@ in # ── Open firewall port ───────────────────────────────────── networking.firewall.allowedTCPPorts = [ 8937 ]; }; -} \ No newline at end of file +}