| <!doctype html> |
| <html lang="en"> |
| <head> |
| <meta charset="utf-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover, interactive-widget=resizes-content"> |
| <meta name="description" content="Arx by Devseis, your security assistant: ask about securing your computer or phone, ISO 27001, GDPR and the EU AI Act, and run a free audit. The AI runs on your device; nothing is uploaded."> |
| <meta name="theme-color" content="#ED2939"> |
| <title>Arx · Devseis security assistant</title> |
| <link rel="icon" href="app/build/icon.png"> |
| <link rel="apple-touch-icon" href="app/build/icon.png"> |
| <link rel="stylesheet" href="chat/chat.css"> |
| </head> |
| <body> |
| <header> |
| <div class="header-left"> |
| <button type="button" id="sidebarToggle" class="icon-btn" aria-label="Conversations" title="Conversations"> |
| <svg viewBox="0 0 24 24" width="20" height="20" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 6h16M4 12h16M4 18h16"/></svg> |
| </button> |
| <a class="brand" href="index.html"><img src="app/build/icon.png" alt=""><span><b>Arx</b> by Devseis</span></a> |
| </div> |
| <div class="header-actions"> |
| <button type="button" id="aiChip" class="ai-chip" data-state="off">⚡ Enable AI</button> |
| <button type="button" id="newChat" class="icon-btn" aria-label="New chat" title="New chat"> |
| <svg viewBox="0 0 24 24" width="19" height="19" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M12 5v14M5 12h14"/></svg> |
| </button> |
| <button type="button" id="themeToggle" class="icon-btn" aria-label="Light or dark" title="Light or dark">◐</button> |
| <button type="button" id="auditBtn" class="audit-btn">🛡 Run audit</button> |
| </div> |
| </header> |
| <div class="status-bar hidden" id="statusBar"><div class="status-text" id="statusText"></div><div class="status-progress"><div id="statusFill"></div></div></div> |
|
|
| <main id="chatMain"> |
| <div class="empty-state" id="emptyState"> |
| <div class="hero-icon"><img src="app/build/icon.png" alt=""></div> |
| <h1>Hi, I'm Arx, your Devseis security assistant.</h1> |
| <p class="hero-sub">Ask me how to secure your computer or phone, or about ISO 27001, GDPR and the EU AI Act. I can also <b>audit this device</b> for free. I run on your device: nothing you type is uploaded.</p> |
| <div class="ai-card hidden" id="aiCard"> |
| <div><b>⚡ Turn on the AI assistant</b><br><span id="aiCardText">One-time download of about 1 GB; it then runs on this device, even offline. Until then I answer instantly from the Devseis knowledge base.</span></div> |
| <div class="btn-row"><button type="button" class="primary-btn" id="aiCardYes">Download now</button><button type="button" class="small-btn" id="aiCardNo">Not now</button></div> |
| </div> |
| <div class="chips"> |
| <button type="button" class="chip" data-prompt="How do I turn on disk encryption on my computer?">🔒 Turn on disk encryption</button> |
| <button type="button" class="chip" data-prompt="Is ChatGPT OK to use at work under GDPR?">🤖 Is ChatGPT OK at work?</button> |
| <button type="button" class="chip" data-prompt="What does ISO 27001 A.8.7 require?">📘 Explain ISO 27001 A.8.7</button> |
| <button type="button" class="chip" data-action="audit">🛡 Audit this device</button> |
| </div> |
| </div> |
| <div id="thread" aria-live="polite"></div> |
| </main> |
|
|
| <form id="composer" autocomplete="off"> |
| <button type="button" id="attachBtn" class="icon-btn attach" title="Add an audit report (.json from the Devseis app)" aria-label="Add an audit report"> |
| <svg viewBox="0 0 24 24" width="19" height="19" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21.44 11.05l-9.19 9.19a5.5 5.5 0 01-7.78-7.78l9.2-9.19a3.5 3.5 0 014.95 4.95l-9.2 9.19a1.5 1.5 0 01-2.12-2.12l8.49-8.48"/></svg> |
| </button> |
| <input type="file" id="fileInput" accept=".json,application/json" hidden> |
| <div class="input-pill"> |
| <textarea id="input" rows="1" placeholder="Ask Arx about security, or add your audit report…" aria-label="Message"></textarea> |
| </div> |
| <button type="submit" id="sendBtn" class="send-btn" aria-label="Send" disabled> |
| <svg viewBox="0 0 24 24" width="18" height="18" fill="currentColor"><path d="M3.4 20.4l17.45-7.48a1 1 0 000-1.84L3.4 3.6a.99.99 0 00-1.39.91L2 9.12c0 .5.37.93.87.99L17 12 2.87 13.88c-.5.07-.87.5-.87 1l.01 4.61c0 .71.73 1.2 1.39.91z"/></svg> |
| </button> |
| </form> |
| <p class="disclaimer">Runs on your device · Answers come from the Devseis knowledge base and can be wrong · Not legal advice</p> |
|
|
| <div class="overlay hidden" id="overlay"></div> |
| <aside class="sidebar" id="sidebar" aria-label="Conversations"> |
| <div class="sidebar-head"><h2>Conversations</h2><button type="button" class="icon-btn" id="sidebarClose" aria-label="Close">✕</button></div> |
| <div class="sidebar-list" id="sidebarList"></div> |
| <div class="sidebar-foot"> |
| <div class="row"><span>AI model</span><span class="muted" id="modelName">loads on first question</span></div> |
| <div class="row"><a href="phone.html">📱 Phone check</a><a href="download.html">💻 Desktop app</a></div> |
| <div class="row"><a href="about.html">About</a><button type="button" class="small-btn" id="clearAll">Clear history</button></div> |
| <p class="muted tiny">Conversations are stored only in this browser. Open source by Devseis (Apache-2.0).</p> |
| </div> |
| </aside> |
|
|
| <div class="modal hidden" id="auditModal" role="dialog" aria-modal="true" aria-labelledby="auditTitle"> |
| <div class="modal-card"> |
| <h2 id="auditTitle">Audit this device</h2> |
| <div id="auditOptions"></div> |
| <button type="button" class="link-btn" id="auditClose">Not now</button> |
| </div> |
| </div> |
|
|
| <script type="module" src="chat/chat.js"></script> |
| </body> |
| </html> |
|
|
